new-engine/libs/ui/src/atoms/numeric-input.figma.tsx at 092d378daed813786ba0f1d38ff80224438c7779 · TechsioCZ/new-engine · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
import figma from "@figma/code-connect"
import { NumericInput } from "./numeric-input"

figma.connect(
  NumericInput,
  "https://www.figma.com/design/12xb1pqXKwE2vbOByN3ntg/New-Design-System-vol.-2?node-id=607-107",
  {
    imports: [
      'import { NumericInput } from "@techsio/ui-kit/atoms/numeric-input"',
    ],
    props: {
      size: figma.enum("size", {
        sm: "sm",
        md: "md",
        lg: "lg",
      }),
      invalid: figma.enum("state", {
        default: false,
        error: true,
        disabled: false,
        readonly: false,
      }),
      disabled: figma.enum("state", {
        default: false,
        error: false,
        disabled: true,
        readonly: false,
      }),
      readOnly: figma.enum("state", {
        default: false,
        error: false,
        disabled: false,
        readonly: true,
      }),
    },
    example: ({ disabled, invalid, readOnly, size }) => (
      <NumericInput
        defaultValue={42}
        disabled={disabled}
        id="quantity"
        invalid={invalid}
        readOnly={readOnly}
        size={size}
      >
        <NumericInput.Control>
          <NumericInput.Input />
          <NumericInput.TriggerContainer>
            <NumericInput.IncrementTrigger />
            <NumericInput.DecrementTrigger />
          </NumericInput.TriggerContainer>
        </NumericInput.Control>
      </NumericInput>
    ),
  }
)