@panneau/ui 5.0.0-alpha.4 → 5.0.0-alpha.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (121) hide show
  1. package/README.md +55 -2
  2. package/dist/command-palette/CommandPalette.css +299 -0
  3. package/dist/command-palette/CommandPalette.d.ts +37 -0
  4. package/dist/command-palette/CommandPalette.d.ts.map +1 -0
  5. package/dist/command-palette/CommandPalette.js +194 -0
  6. package/dist/command-palette/CommandPalette.js.map +1 -0
  7. package/dist/command-palette/CommandPalette.module.js +62 -0
  8. package/dist/command-palette/CommandPalette.module.js.map +1 -0
  9. package/dist/command-palette/match.d.ts +39 -0
  10. package/dist/command-palette/match.d.ts.map +1 -0
  11. package/dist/command-palette/match.js +44 -0
  12. package/dist/command-palette/match.js.map +1 -0
  13. package/dist/command-palette/tokens.d.ts +3 -0
  14. package/dist/command-palette/tokens.d.ts.map +1 -0
  15. package/dist/command-palette/tokens.js +23 -0
  16. package/dist/command-palette/tokens.js.map +1 -0
  17. package/dist/command-palette/useCommandShortcut.d.ts +12 -0
  18. package/dist/command-palette/useCommandShortcut.d.ts.map +1 -0
  19. package/dist/command-palette/useCommandShortcut.js +29 -0
  20. package/dist/command-palette/useCommandShortcut.js.map +1 -0
  21. package/dist/date-picker/DatePicker.css +40 -0
  22. package/dist/date-picker/DatePicker.d.ts +2 -1
  23. package/dist/date-picker/DatePicker.d.ts.map +1 -1
  24. package/dist/date-picker/DatePicker.js +54 -8
  25. package/dist/date-picker/DatePicker.js.map +1 -1
  26. package/dist/date-picker/DatePicker.module.js +5 -1
  27. package/dist/date-picker/DatePicker.module.js.map +1 -1
  28. package/dist/dialog/Dialog.css +36 -2
  29. package/dist/dialog/Dialog.d.ts +15 -3
  30. package/dist/dialog/Dialog.d.ts.map +1 -1
  31. package/dist/dialog/Dialog.js +22 -14
  32. package/dist/dialog/Dialog.js.map +1 -1
  33. package/dist/dialog/Dialog.module.js +8 -2
  34. package/dist/dialog/Dialog.module.js.map +1 -1
  35. package/dist/dialog/tokens.d.ts +1 -1
  36. package/dist/dialog/tokens.d.ts.map +1 -1
  37. package/dist/dialog/tokens.js +2 -0
  38. package/dist/dialog/tokens.js.map +1 -1
  39. package/dist/field/Field.css +9 -0
  40. package/dist/field/Field.module.js.map +1 -1
  41. package/dist/index.d.ts +9 -2
  42. package/dist/index.d.ts.map +1 -1
  43. package/dist/index.js +10 -3
  44. package/dist/menu/Menu.css +84 -0
  45. package/dist/menu/Menu.d.ts +33 -6
  46. package/dist/menu/Menu.d.ts.map +1 -1
  47. package/dist/menu/Menu.js +110 -25
  48. package/dist/menu/Menu.js.map +1 -1
  49. package/dist/menu/Menu.module.js +22 -0
  50. package/dist/menu/Menu.module.js.map +1 -0
  51. package/dist/menu/tokens.d.ts +3 -0
  52. package/dist/menu/tokens.d.ts.map +1 -0
  53. package/dist/menu/tokens.js +31 -0
  54. package/dist/menu/tokens.js.map +1 -0
  55. package/dist/number-input/NumberInput.css +18 -0
  56. package/dist/number-input/NumberInput.js +1 -1
  57. package/dist/number-input/NumberInput.js.map +1 -1
  58. package/dist/number-input/NumberInput.module.js +3 -1
  59. package/dist/number-input/NumberInput.module.js.map +1 -1
  60. package/dist/pill-trigger/PillTrigger.css +104 -0
  61. package/dist/pill-trigger/PillTrigger.d.ts +20 -0
  62. package/dist/pill-trigger/PillTrigger.d.ts.map +1 -0
  63. package/dist/pill-trigger/PillTrigger.js +38 -0
  64. package/dist/pill-trigger/PillTrigger.js.map +1 -0
  65. package/dist/pill-trigger/PillTrigger.module.js +18 -0
  66. package/dist/pill-trigger/PillTrigger.module.js.map +1 -0
  67. package/dist/pill-trigger/tokens.d.ts +3 -0
  68. package/dist/pill-trigger/tokens.d.ts.map +1 -0
  69. package/dist/pill-trigger/tokens.js +37 -0
  70. package/dist/pill-trigger/tokens.js.map +1 -0
  71. package/dist/radio-group/RadioGroup.css +90 -0
  72. package/dist/radio-group/RadioGroup.d.ts +22 -3
  73. package/dist/radio-group/RadioGroup.d.ts.map +1 -1
  74. package/dist/radio-group/RadioGroup.js +42 -21
  75. package/dist/radio-group/RadioGroup.js.map +1 -1
  76. package/dist/radio-group/RadioGroup.module.js +12 -2
  77. package/dist/radio-group/RadioGroup.module.js.map +1 -1
  78. package/dist/radio-group/tokens.d.ts +2 -2
  79. package/dist/radio-group/tokens.d.ts.map +1 -1
  80. package/dist/radio-group/tokens.js +22 -2
  81. package/dist/radio-group/tokens.js.map +1 -1
  82. package/dist/segmented-control/SegmentedControl.css +83 -0
  83. package/dist/segmented-control/SegmentedControl.d.ts +35 -0
  84. package/dist/segmented-control/SegmentedControl.d.ts.map +1 -0
  85. package/dist/segmented-control/SegmentedControl.js +44 -0
  86. package/dist/segmented-control/SegmentedControl.js.map +1 -0
  87. package/dist/segmented-control/SegmentedControl.module.js +16 -0
  88. package/dist/segmented-control/SegmentedControl.module.js.map +1 -0
  89. package/dist/segmented-control/tokens.d.ts +3 -0
  90. package/dist/segmented-control/tokens.d.ts.map +1 -0
  91. package/dist/segmented-control/tokens.js +29 -0
  92. package/dist/segmented-control/tokens.js.map +1 -0
  93. package/dist/select/ListBox.css +23 -1
  94. package/dist/select/ListBox.module.js +2 -2
  95. package/dist/select/ListBox.module.js.map +1 -1
  96. package/dist/select/listBoxTokens.d.ts +1 -1
  97. package/dist/select/listBoxTokens.d.ts.map +1 -1
  98. package/dist/select/listBoxTokens.js +2 -0
  99. package/dist/select/listBoxTokens.js.map +1 -1
  100. package/dist/slider/Slider.css +84 -0
  101. package/dist/slider/Slider.d.ts +20 -0
  102. package/dist/slider/Slider.d.ts.map +1 -0
  103. package/dist/slider/Slider.js +70 -0
  104. package/dist/slider/Slider.js.map +1 -0
  105. package/dist/slider/Slider.module.js +20 -0
  106. package/dist/slider/Slider.module.js.map +1 -0
  107. package/dist/tags-input/TagsInput.css +60 -0
  108. package/dist/tags-input/TagsInput.d.ts +32 -0
  109. package/dist/tags-input/TagsInput.d.ts.map +1 -0
  110. package/dist/tags-input/TagsInput.js +160 -0
  111. package/dist/tags-input/TagsInput.js.map +1 -0
  112. package/dist/tags-input/TagsInput.module.js +20 -0
  113. package/dist/tags-input/TagsInput.module.js.map +1 -0
  114. package/dist/text-input/TextInput.d.ts.map +1 -1
  115. package/dist/text-input/TextInput.js +2 -0
  116. package/dist/text-input/TextInput.js.map +1 -1
  117. package/dist/theme/components.d.ts +7 -3
  118. package/dist/theme/components.d.ts.map +1 -1
  119. package/dist/theme/components.js +8 -0
  120. package/dist/theme/components.js.map +1 -1
  121. package/package.json +3 -3
@@ -0,0 +1 @@
1
+ {"version":3,"file":"TagsInput.js","names":["suggestion","text","tag","next","event","fieldStyles","styles"],"sources":["../../src/tags-input/TagsInput.tsx"],"sourcesContent":["import { X } from 'lucide-react';\nimport { type ClipboardEvent, type KeyboardEvent, useId, useState } from 'react';\nimport { Button, Tag, TagGroup, TagList } from 'react-aria-components';\n\nimport { type FieldChromeProps, fieldStyles } from '../field/FieldParts';\nimport { Icon } from '../icon/Icon';\nimport { messages } from '../intl/messages';\nimport { usePanneauIntl } from '../intl/usePanneauIntl';\nimport { cx } from '../utils/cx';\nimport styles from './TagsInput.module.css';\n\n/** A suggested tag: its value, and the label shown for it. */\nexport interface TagSuggestion {\n value: string;\n label?: string;\n}\n\nexport interface TagsInputProps extends FieldChromeProps {\n /** The tags, or `null` when there are none. */\n value?: readonly string[] | null;\n /** Called with the tags, or `null` when the last one is removed. */\n onChange?: (value: string[] | null) => void;\n onBlur?: () => void;\n /** Tags offered as the user types. */\n suggestions?: readonly TagSuggestion[];\n /** Whether tags outside the suggestions are allowed. Defaults to true. */\n allowCustom?: boolean;\n placeholder?: string;\n name?: string;\n isRequired?: boolean;\n isDisabled?: boolean;\n isReadOnly?: boolean;\n autoFocus?: boolean;\n controlClassName?: string;\n}\n\n/**\n * A list of words. Enter, Tab or a comma adds what is typed, Backspace in the empty input removes\n * the last tag, and pasting a list separated by commas or lines adds each one. Tags are trimmed,\n * and a tag already in the list isn't added again. Suggestions complete what is typed; without\n * `allowCustom`, only they can be added.\n */\nexport function TagsInput({\n label,\n description,\n errors = [],\n value,\n onChange,\n onBlur,\n suggestions = [],\n allowCustom = true,\n placeholder,\n name,\n isRequired,\n isDisabled,\n isReadOnly,\n autoFocus,\n className,\n labelClassName,\n descriptionClassName,\n errorsClassName,\n controlClassName,\n}: TagsInputProps) {\n const intl = usePanneauIntl();\n const id = useId();\n const [draft, setDraft] = useState('');\n const tags = value ?? [];\n const invalid = errors.length > 0;\n const editable = isDisabled !== true && isReadOnly !== true;\n const labelOf = (tag: string) =>\n suggestions.find((suggestion) => suggestion.value === tag)?.label ?? tag;\n\n /** The tag a text adds: the suggestion it names, or the text itself when allowed. */\n const resolve = (text: string): string | null => {\n const trimmed = text.trim();\n if (trimmed === '') {\n return null;\n }\n const lower = trimmed.toLocaleLowerCase();\n const suggestion = suggestions.find(\n (candidate) =>\n candidate.value.toLocaleLowerCase() === lower ||\n (candidate.label ?? '').toLocaleLowerCase() === lower,\n );\n if (suggestion !== undefined) {\n return suggestion.value;\n }\n return allowCustom ? trimmed : null;\n };\n\n const add = (texts: readonly string[]) => {\n const next = [...tags];\n texts.forEach((text) => {\n const tag = resolve(text);\n if (tag !== null && !next.includes(tag)) {\n next.push(tag);\n }\n });\n if (next.length !== tags.length) {\n onChange?.(next);\n }\n };\n\n const remove = (removed: ReadonlySet<string | number>) => {\n const next = tags.filter((tag) => !removed.has(tag));\n onChange?.(next.length > 0 ? next : null);\n };\n\n const commit = () => {\n if (draft.trim() !== '') {\n add([draft]);\n setDraft('');\n }\n };\n\n const onKeyDown = (event: KeyboardEvent<HTMLInputElement>) => {\n if (event.key === 'Enter' || event.key === ',' || (event.key === 'Tab' && draft !== '')) {\n if (draft.trim() !== '') {\n event.preventDefault();\n commit();\n } else if (event.key !== 'Tab') {\n event.preventDefault();\n }\n } else if (event.key === 'Backspace' && draft === '' && tags.length > 0) {\n event.preventDefault();\n remove(new Set([tags[tags.length - 1] as string]));\n }\n };\n\n const onPaste = (event: ClipboardEvent<HTMLInputElement>) => {\n const text = event.clipboardData.getData('text');\n if (/[,\\n]/.test(text)) {\n event.preventDefault();\n add(text.split(/[,\\n]/));\n }\n };\n\n const describedBy = [\n description !== undefined && description !== null ? `${id}-description` : null,\n invalid ? `${id}-errors` : null,\n ]\n .filter((part) => part !== null)\n .join(' ');\n\n return (\n <div className={cx('panneau-tags-input', fieldStyles.field, className)}>\n {label !== undefined && label !== null ? (\n <label htmlFor={`${id}-input`} className={cx(fieldStyles.label, labelClassName)}>\n {label}\n {isRequired === true ? (\n <span className={fieldStyles.required} aria-hidden=\"true\">\n *\n </span>\n ) : null}\n </label>\n ) : null}\n <div\n className={cx(fieldStyles.control, styles.control, controlClassName)}\n data-invalid={invalid || undefined}\n data-disabled={isDisabled || undefined}\n data-readonly={isReadOnly || undefined}\n >\n {tags.length > 0 ? (\n <TagGroup\n aria-label={intl.formatMessage(messages.tags, {\n label: typeof label === 'string' ? label : '',\n })}\n onRemove={editable ? remove : undefined}\n className={styles.group}\n >\n <TagList className={styles.list}>\n {tags.map((tag) => (\n <Tag\n key={tag}\n id={tag}\n textValue={labelOf(tag)}\n className={styles.tag}\n >\n {labelOf(tag)}\n {editable ? (\n <Button slot=\"remove\" className={styles.remove}>\n <Icon icon={X} size=\"xs\" />\n </Button>\n ) : null}\n </Tag>\n ))}\n </TagList>\n </TagGroup>\n ) : null}\n {editable ? (\n <input\n id={`${id}-input`}\n className={cx(fieldStyles.bare, styles.input)}\n value={draft}\n placeholder={tags.length === 0 ? placeholder : undefined}\n list={suggestions.length > 0 ? `${id}-suggestions` : undefined}\n autoComplete=\"off\"\n autoFocus={autoFocus}\n aria-invalid={invalid || undefined}\n aria-required={isRequired || undefined}\n aria-describedby={describedBy !== '' ? describedBy : undefined}\n onChange={(event) => setDraft(event.target.value)}\n onKeyDown={onKeyDown}\n onPaste={onPaste}\n onBlur={() => {\n commit();\n onBlur?.();\n }}\n />\n ) : null}\n {suggestions.length > 0 ? (\n <datalist id={`${id}-suggestions`}>\n {suggestions\n .filter((suggestion) => !tags.includes(suggestion.value))\n .map((suggestion) => (\n <option\n key={suggestion.value}\n value={suggestion.label ?? suggestion.value}\n />\n ))}\n </datalist>\n ) : null}\n </div>\n {name !== undefined\n ? tags.map((tag) => (\n <input key={tag} type=\"hidden\" name={`${name}[]`} value={tag} />\n ))\n : null}\n {description !== undefined && description !== null ? (\n <div\n id={`${id}-description`}\n className={cx(fieldStyles.description, descriptionClassName)}\n >\n {description}\n </div>\n ) : null}\n {invalid ? (\n <div id={`${id}-errors`} className={cx(fieldStyles.errors, errorsClassName)}>\n {errors.map((error, index) => (\n <span key={index} className={fieldStyles.error}>\n {error}\n </span>\n ))}\n </div>\n ) : null}\n </div>\n );\n}\n"],"mappings":"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"}
@@ -0,0 +1,20 @@
1
+ import "./TagsInput.css";
2
+ //#region src/tags-input/TagsInput.module.css
3
+ var control = "panneau-tags-input-control";
4
+ var group = "panneau-tags-input-group";
5
+ var list = "panneau-tags-input-list";
6
+ var tag = "panneau-tags-input-tag";
7
+ var remove = "panneau-tags-input-remove";
8
+ var input = "panneau-tags-input-input";
9
+ var TagsInput_module_default = {
10
+ control,
11
+ group,
12
+ list,
13
+ tag,
14
+ remove,
15
+ input
16
+ };
17
+ //#endregion
18
+ export { control, TagsInput_module_default as default, group, input, list, remove, tag };
19
+
20
+ //# sourceMappingURL=TagsInput.module.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"TagsInput.module.js","names":[],"sources":["../../src/tags-input/TagsInput.module.css"],"sourcesContent":["/* The tags as chips in the control, before the input. */\n\n.control.control {\n flex-wrap: wrap;\n gap: var(--panneau-space-1);\n height: auto;\n padding-block: var(--panneau-space-1);\n}\n\n.group {\n display: contents;\n}\n\n.list {\n display: contents;\n}\n\n.tag {\n display: inline-flex;\n align-items: center;\n gap: var(--panneau-space-1);\n max-width: 100%;\n padding: 0.125rem var(--panneau-space-1) 0.125rem var(--panneau-space-2);\n font-size: var(--panneau-font-size-sm);\n line-height: var(--panneau-line-height-tight);\n color: var(--panneau-color-text);\n background-color: var(--panneau-color-surface-sunken);\n border: var(--panneau-border-width) solid var(--panneau-color-border);\n border-radius: var(--panneau-radius-full);\n outline: none;\n overflow-wrap: anywhere;\n}\n\n.tag[data-focus-visible] {\n outline: var(--panneau-focus-width) solid var(--panneau-color-focus);\n outline-offset: 1px;\n}\n\n.remove {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n padding: 0.125rem;\n color: var(--panneau-color-text-muted);\n cursor: pointer;\n background: none;\n border: 0;\n border-radius: var(--panneau-radius-full);\n outline: none;\n}\n\n.remove[data-hovered] {\n color: var(--panneau-color-text);\n background-color: var(--panneau-color-hover);\n}\n\n.input {\n flex: 1 1 6rem;\n min-width: 6rem;\n}\n"],"mappings":""}
@@ -1 +1 @@
1
- {"version":3,"file":"TextInput.d.ts","sourceRoot":"","sources":["../../src/text-input/TextInput.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,EACH,KAAK,cAAc,IAAI,kBAAkB,EAI5C,MAAM,uBAAuB,CAAC;AAE/B,OAAO,EACH,KAAK,gBAAgB,EAKxB,MAAM,qBAAqB,CAAC;AAG7B,MAAM,WAAW,cACb,SACI,IAAI,CACA,kBAAkB,EAClB,WAAW,GAAG,OAAO,GAAG,UAAU,GAAG,WAAW,GAAG,UAAU,GAAG,MAAM,CACzE,EACD,gBAAgB;IACpB,IAAI,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,KAAK,GAAG,KAAK,GAAG,UAAU,GAAG,QAAQ,CAAC;IAChE,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,kFAAkF;IAClF,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,kDAAkD;IAClD,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,2DAA2D;IAC3D,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,cAAc,CAAC,EAAE,MAAM,CAAC;CAC3B;AAED,uEAAuE;AACvE,wBAAgB,SAAS,CAAC,EACtB,KAAK,EACL,WAAW,EACX,MAAW,EACX,WAAW,EACX,MAAM,EACN,MAAM,EACN,SAAS,EACT,cAAc,EACd,oBAAoB,EACpB,eAAe,EACf,gBAAgB,EAChB,cAAc,EACd,UAAU,EACV,UAAU,EACV,GAAG,KAAK,EACX,EAAE,cAAc,+BAwChB"}
1
+ {"version":3,"file":"TextInput.d.ts","sourceRoot":"","sources":["../../src/text-input/TextInput.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,EACH,KAAK,cAAc,IAAI,kBAAkB,EAI5C,MAAM,uBAAuB,CAAC;AAE/B,OAAO,EACH,KAAK,gBAAgB,EAKxB,MAAM,qBAAqB,CAAC;AAG7B,MAAM,WAAW,cACb,SACI,IAAI,CACA,kBAAkB,EAClB,WAAW,GAAG,OAAO,GAAG,UAAU,GAAG,WAAW,GAAG,UAAU,GAAG,MAAM,CACzE,EACD,gBAAgB;IACpB,IAAI,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,KAAK,GAAG,KAAK,GAAG,UAAU,GAAG,QAAQ,CAAC;IAChE,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,kFAAkF;IAClF,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,kDAAkD;IAClD,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,2DAA2D;IAC3D,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,cAAc,CAAC,EAAE,MAAM,CAAC;CAC3B;AAED,uEAAuE;AACvE,wBAAgB,SAAS,CAAC,EACtB,KAAK,EACL,WAAW,EACX,MAAW,EACX,WAAW,EACX,MAAM,EACN,MAAM,EACN,SAAS,EACT,cAAc,EACd,oBAAoB,EACpB,eAAe,EACf,gBAAgB,EAChB,cAAc,EACd,UAAU,EACV,UAAU,EACV,GAAG,KAAK,EACX,EAAE,cAAc,+BAkDhB"}
@@ -29,6 +29,7 @@ function TextInput({ label, description, errors = [], placeholder, prefix, suffi
29
29
  children: [
30
30
  prefix !== void 0 ? /* @__PURE__ */ jsx("span", {
31
31
  className: Field_module_default.adornment,
32
+ "data-text": typeof prefix === "string" || void 0,
32
33
  children: prefix
33
34
  }) : null,
34
35
  /* @__PURE__ */ jsx(Input, {
@@ -37,6 +38,7 @@ function TextInput({ label, description, errors = [], placeholder, prefix, suffi
37
38
  }),
38
39
  suffix !== void 0 ? /* @__PURE__ */ jsx("span", {
39
40
  className: Field_module_default.adornment,
41
+ "data-text": typeof suffix === "string" || void 0,
40
42
  children: suffix
41
43
  }) : null
42
44
  ]
@@ -1 +1 @@
1
- {"version":3,"file":"TextInput.js","names":["styles"],"sources":["../../src/text-input/TextInput.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport {\n type TextFieldProps as AriaTextFieldProps,\n Group,\n Input,\n TextField,\n} from 'react-aria-components';\n\nimport {\n type FieldChromeProps,\n FieldDescription,\n FieldErrors,\n FieldLabel,\n fieldStyles as styles,\n} from '../field/FieldParts';\nimport { cx } from '../utils/cx';\n\nexport interface TextInputProps\n extends\n Omit<\n AriaTextFieldProps,\n 'className' | 'style' | 'children' | 'isInvalid' | 'validate' | 'type'\n >,\n FieldChromeProps {\n type?: 'text' | 'email' | 'url' | 'tel' | 'password' | 'search';\n placeholder?: string;\n /** Content before the text, inside the control: a unit, a URL prefix, an icon. */\n prefix?: ReactNode;\n /** Content after the text, inside the control. */\n suffix?: ReactNode;\n /** Class name of the control (the box around the text). */\n controlClassName?: string;\n inputClassName?: string;\n}\n\n/** A single-line text input with its label, description and errors. */\nexport function TextInput({\n label,\n description,\n errors = [],\n placeholder,\n prefix,\n suffix,\n className,\n labelClassName,\n descriptionClassName,\n errorsClassName,\n controlClassName,\n inputClassName,\n isRequired,\n isReadOnly,\n ...props\n}: TextInputProps) {\n const invalid = errors.length > 0;\n const adorned = prefix !== undefined || suffix !== undefined;\n return (\n <TextField\n {...props}\n isRequired={isRequired}\n isReadOnly={isReadOnly}\n isInvalid={invalid}\n validationBehavior=\"aria\"\n className={cx('panneau-text-input', styles.field, className)}\n >\n <FieldLabel isRequired={isRequired} className={labelClassName}>\n {label}\n </FieldLabel>\n {adorned ? (\n <Group\n className={cx(styles.control, controlClassName)}\n data-invalid={invalid || undefined}\n data-readonly={isReadOnly || undefined}\n isDisabled={props.isDisabled}\n >\n {prefix !== undefined ? (\n <span className={styles.adornment}>{prefix}</span>\n ) : null}\n <Input placeholder={placeholder} className={cx(styles.bare, inputClassName)} />\n {suffix !== undefined ? (\n <span className={styles.adornment}>{suffix}</span>\n ) : null}\n </Group>\n ) : (\n <Input\n placeholder={placeholder}\n className={cx(styles.control, controlClassName, inputClassName)}\n />\n )}\n <FieldDescription className={descriptionClassName}>{description}</FieldDescription>\n <FieldErrors errors={errors} className={errorsClassName} />\n </TextField>\n );\n}\n"],"mappings":";;;;;;;AAoCA,SAAgB,UAAU,EACtB,OACA,aACA,SAAS,CAAA,GACT,aACA,QACA,QACA,WACA,gBACA,sBACA,iBACA,kBACA,gBACA,YACA,YACA,GAAG,SACY;CACf,MAAM,UAAU,OAAO,SAAS;CAChC,MAAM,UAAU,WAAW,KAAA,KAAa,WAAW,KAAA;CACnD,OACI,qBAAC,WAAD;EACI,GAAI;EACQ;EACA;EACZ,WAAW;EACX,oBAAmB;EACnB,WAAW,GAAG,sBAAsBA,qBAAO,OAAO,SAAS;EAN/D,UAAA;GAQI,oBAAC,YAAD;IAAwB;IAAY,WAAW;IAC1C,UAAA;GACO,CAAA;GACX,UACG,qBAAC,OAAD;IACI,WAAW,GAAGA,qBAAO,SAAS,gBAAgB;IAC9C,gBAAc,WAAW,KAAA;IACzB,iBAAe,cAAc,KAAA;IAC7B,YAAY,MAAM;IAJtB,UAAA;KAMK,WAAW,KAAA,IACR,oBAAC,QAAD;MAAM,WAAWA,qBAAO;MAAY,UAAA;KAAa,CAAA,IACjD;KACJ,oBAAC,OAAD;MAAoB;MAAa,WAAW,GAAGA,qBAAO,MAAM,cAAc;KAAE,CAAA;KAC3E,WAAW,KAAA,IACR,oBAAC,QAAD;MAAM,WAAWA,qBAAO;MAAY,UAAA;KAAa,CAAA,IACjD;IACD;GAEP,CAAA,IAAA,oBAAC,OAAD;IACiB;IACb,WAAW,GAAGA,qBAAO,SAAS,kBAAkB,cAAc;GAAE,CAAA;GAGxE,oBAAC,kBAAD;IAAkB,WAAW;IAAuB,UAAA;GAA8B,CAAA;GAClF,oBAAC,aAAD;IAAqB;IAAQ,WAAW;GAAgB,CAAA;EACjD;;AAEnB"}
1
+ {"version":3,"file":"TextInput.js","names":["styles"],"sources":["../../src/text-input/TextInput.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport {\n type TextFieldProps as AriaTextFieldProps,\n Group,\n Input,\n TextField,\n} from 'react-aria-components';\n\nimport {\n type FieldChromeProps,\n FieldDescription,\n FieldErrors,\n FieldLabel,\n fieldStyles as styles,\n} from '../field/FieldParts';\nimport { cx } from '../utils/cx';\n\nexport interface TextInputProps\n extends\n Omit<\n AriaTextFieldProps,\n 'className' | 'style' | 'children' | 'isInvalid' | 'validate' | 'type'\n >,\n FieldChromeProps {\n type?: 'text' | 'email' | 'url' | 'tel' | 'password' | 'search';\n placeholder?: string;\n /** Content before the text, inside the control: a unit, a URL prefix, an icon. */\n prefix?: ReactNode;\n /** Content after the text, inside the control. */\n suffix?: ReactNode;\n /** Class name of the control (the box around the text). */\n controlClassName?: string;\n inputClassName?: string;\n}\n\n/** A single-line text input with its label, description and errors. */\nexport function TextInput({\n label,\n description,\n errors = [],\n placeholder,\n prefix,\n suffix,\n className,\n labelClassName,\n descriptionClassName,\n errorsClassName,\n controlClassName,\n inputClassName,\n isRequired,\n isReadOnly,\n ...props\n}: TextInputProps) {\n const invalid = errors.length > 0;\n const adorned = prefix !== undefined || suffix !== undefined;\n return (\n <TextField\n {...props}\n isRequired={isRequired}\n isReadOnly={isReadOnly}\n isInvalid={invalid}\n validationBehavior=\"aria\"\n className={cx('panneau-text-input', styles.field, className)}\n >\n <FieldLabel isRequired={isRequired} className={labelClassName}>\n {label}\n </FieldLabel>\n {adorned ? (\n <Group\n className={cx(styles.control, controlClassName)}\n data-invalid={invalid || undefined}\n data-readonly={isReadOnly || undefined}\n isDisabled={props.isDisabled}\n >\n {prefix !== undefined ? (\n <span\n className={styles.adornment}\n data-text={typeof prefix === 'string' || undefined}\n >\n {prefix}\n </span>\n ) : null}\n <Input placeholder={placeholder} className={cx(styles.bare, inputClassName)} />\n {suffix !== undefined ? (\n <span\n className={styles.adornment}\n data-text={typeof suffix === 'string' || undefined}\n >\n {suffix}\n </span>\n ) : null}\n </Group>\n ) : (\n <Input\n placeholder={placeholder}\n className={cx(styles.control, controlClassName, inputClassName)}\n />\n )}\n <FieldDescription className={descriptionClassName}>{description}</FieldDescription>\n <FieldErrors errors={errors} className={errorsClassName} />\n </TextField>\n );\n}\n"],"mappings":";;;;;;;AAoCA,SAAgB,UAAU,EACtB,OACA,aACA,SAAS,CAAA,GACT,aACA,QACA,QACA,WACA,gBACA,sBACA,iBACA,kBACA,gBACA,YACA,YACA,GAAG,SACY;CACf,MAAM,UAAU,OAAO,SAAS;CAChC,MAAM,UAAU,WAAW,KAAA,KAAa,WAAW,KAAA;CACnD,OACI,qBAAC,WAAD;EACI,GAAI;EACQ;EACA;EACZ,WAAW;EACX,oBAAmB;EACnB,WAAW,GAAG,sBAAsBA,qBAAO,OAAO,SAAS;EAN/D,UAAA;GAQI,oBAAC,YAAD;IAAwB;IAAY,WAAW;IAC1C,UAAA;GACO,CAAA;GACX,UACG,qBAAC,OAAD;IACI,WAAW,GAAGA,qBAAO,SAAS,gBAAgB;IAC9C,gBAAc,WAAW,KAAA;IACzB,iBAAe,cAAc,KAAA;IAC7B,YAAY,MAAM;IAJtB,UAAA;KAMK,WAAW,KAAA,IACR,oBAAC,QAAD;MACI,WAAWA,qBAAO;MAClB,aAAW,OAAO,WAAW,YAAY,KAAA;MAExC,UAAA;KACC,CAAA,IACN;KACJ,oBAAC,OAAD;MAAoB;MAAa,WAAW,GAAGA,qBAAO,MAAM,cAAc;KAAE,CAAA;KAC3E,WAAW,KAAA,IACR,oBAAC,QAAD;MACI,WAAWA,qBAAO;MAClB,aAAW,OAAO,WAAW,YAAY,KAAA;MAExC,UAAA;KACC,CAAA,IACN;IACD;GAEP,CAAA,IAAA,oBAAC,OAAD;IACiB;IACb,WAAW,GAAGA,qBAAO,SAAS,kBAAkB,cAAc;GAAE,CAAA;GAGxE,oBAAC,kBAAD;IAAkB,WAAW;IAAuB,UAAA;GAA8B,CAAA;GAClF,oBAAC,aAAD;IAAqB;IAAQ,WAAW;GAAgB,CAAA;EACjD;;AAEnB"}
@@ -9,8 +9,9 @@ export declare const componentTokens: Readonly<{
9
9
  calendar: Readonly<Record<"panneau-calendar-cell-size" | "panneau-calendar-cell-radius" | "panneau-calendar-selected-color" | "panneau-calendar-selected-bg", string>>;
10
10
  card: Readonly<Record<"panneau-card-radius" | "panneau-card-gap" | "panneau-card-padding-y" | "panneau-card-padding-x" | "panneau-card-border-width" | "panneau-card-title-font-weight" | "panneau-card-bg" | "panneau-card-border-color" | "panneau-card-shadow" | "panneau-card-header-padding-y" | "panneau-card-title-font-size", string>>;
11
11
  checkbox: Readonly<Record<"panneau-checkbox-size" | "panneau-checkbox-radius" | "panneau-checkbox-bg" | "panneau-checkbox-border-color" | "panneau-checkbox-checked-color" | "panneau-checkbox-checked-bg", string>>;
12
+ 'command-palette': Readonly<Record<"panneau-command-palette-width" | "panneau-command-palette-radius" | "panneau-command-palette-bg" | "panneau-command-palette-offset-top" | "panneau-command-palette-list-max-height" | "panneau-command-palette-item-radius" | "panneau-command-palette-item-active-bg", string>>;
12
13
  container: Readonly<Record<"panneau-container-padding-x" | "panneau-container-width-sm" | "panneau-container-width-md" | "panneau-container-width-lg" | "panneau-container-width-xl", string>>;
13
- dialog: Readonly<Record<"panneau-dialog-width" | "panneau-dialog-radius" | "panneau-dialog-padding-x" | "panneau-dialog-title-font-weight" | "panneau-dialog-bg" | "panneau-dialog-shadow" | "panneau-dialog-title-font-size" | "panneau-dialog-width-sm" | "panneau-dialog-width-lg" | "panneau-dialog-backdrop", string>>;
14
+ dialog: Readonly<Record<"panneau-dialog-width" | "panneau-dialog-radius" | "panneau-dialog-padding-x" | "panneau-dialog-title-font-weight" | "panneau-dialog-bg" | "panneau-dialog-shadow" | "panneau-dialog-title-font-size" | "panneau-dialog-width-sm" | "panneau-dialog-width-lg" | "panneau-dialog-width-xl" | "panneau-dialog-backdrop", string>>;
14
15
  disclosure: Readonly<Record<"panneau-disclosure-gap" | "panneau-disclosure-title-font-weight" | "panneau-disclosure-title-font-size", string>>;
15
16
  divider: Readonly<Record<"panneau-divider-color" | "panneau-divider-width", string>>;
16
17
  field: Readonly<Record<"panneau-field-gap" | "panneau-field-label-font-size" | "panneau-field-label-font-weight", string>>;
@@ -18,11 +19,14 @@ export declare const componentTokens: Readonly<{
18
19
  heading: Readonly<Record<"panneau-heading-color" | "panneau-heading-font-family" | "panneau-heading-display-font-family" | "panneau-heading-1-font-size" | "panneau-heading-1-font-weight" | "panneau-heading-1-line-height" | "panneau-heading-1-letter-spacing" | "panneau-heading-2-font-size" | "panneau-heading-2-font-weight" | "panneau-heading-2-line-height" | "panneau-heading-2-letter-spacing" | "panneau-heading-3-font-size" | "panneau-heading-3-font-weight" | "panneau-heading-3-line-height" | "panneau-heading-3-letter-spacing" | "panneau-heading-4-font-size" | "panneau-heading-4-font-weight" | "panneau-heading-4-line-height" | "panneau-heading-4-letter-spacing" | "panneau-heading-display-1-font-size" | "panneau-heading-display-1-font-weight" | "panneau-heading-display-1-line-height" | "panneau-heading-display-1-letter-spacing" | "panneau-heading-display-2-font-size" | "panneau-heading-display-2-font-weight" | "panneau-heading-display-2-line-height" | "panneau-heading-display-2-letter-spacing", string>>;
19
20
  inline: Readonly<Record<"panneau-inline-gap", string>>;
20
21
  input: Readonly<Record<"panneau-input-radius" | "panneau-input-padding-x" | "panneau-input-border-width" | "panneau-input-bg" | "panneau-input-border-color" | "panneau-input-border-color-hover", string>>;
21
- 'list-box': Readonly<Record<"panneau-list-box-padding" | "panneau-list-box-item-padding-y" | "panneau-list-box-item-padding-x" | "panneau-list-box-item-radius" | "panneau-list-box-item-bg-hover", string>>;
22
+ 'list-box': Readonly<Record<"panneau-list-box-padding" | "panneau-list-box-item-radius" | "panneau-list-box-item-padding-y" | "panneau-list-box-item-padding-y-described" | "panneau-list-box-item-padding-x" | "panneau-list-box-item-bg-hover", string>>;
23
+ menu: Readonly<Record<"panneau-menu-header-font-size" | "panneau-menu-header-font-weight" | "panneau-menu-header-color" | "panneau-menu-header-text-transform" | "panneau-menu-header-letter-spacing" | "panneau-menu-footer-font-size" | "panneau-menu-footer-color" | "panneau-menu-media-size" | "panneau-menu-media-size-described" | "panneau-menu-media-radius" | "panneau-menu-item-bg-selected", string>>;
22
24
  'number-input': Readonly<Record<"panneau-number-input-stepper-width", string>>;
25
+ 'pill-trigger': Readonly<Record<"panneau-pill-trigger-color" | "panneau-pill-trigger-radius" | "panneau-pill-trigger-gap" | "panneau-pill-trigger-padding-x" | "panneau-pill-trigger-font-size" | "panneau-pill-trigger-font-weight" | "panneau-pill-trigger-padding-x-sm" | "panneau-pill-trigger-font-size-sm" | "panneau-pill-trigger-bg" | "panneau-pill-trigger-border-color" | "panneau-pill-trigger-media-size" | "panneau-pill-trigger-media-radius" | "panneau-pill-trigger-bg-hover" | "panneau-pill-trigger-media-size-sm", string>>;
23
26
  popover: Readonly<Record<"panneau-popover-radius" | "panneau-popover-padding" | "panneau-popover-bg" | "panneau-popover-border-color" | "panneau-popover-shadow", string>>;
24
27
  prose: Readonly<Record<"panneau-prose-gap" | "panneau-prose-border-color" | "panneau-prose-line-height" | "panneau-prose-heading-gap" | "panneau-prose-list-indent" | "panneau-prose-link-color" | "panneau-prose-code-font-size" | "panneau-prose-code-color" | "panneau-prose-code-bg" | "panneau-prose-code-radius" | "panneau-prose-quote-border-color" | "panneau-prose-quote-color", string>>;
25
- radio: Readonly<Record<"panneau-radio-size" | "panneau-radio-bg" | "panneau-radio-border-color" | "panneau-radio-checked-color" | "panneau-radio-checked-border-width", string>>;
28
+ radio: Readonly<Record<"panneau-radio-size" | "panneau-radio-bg" | "panneau-radio-border-color" | "panneau-radio-checked-color" | "panneau-radio-media-size" | "panneau-radio-media-radius" | "panneau-radio-checked-border-width" | "panneau-radio-card-gap" | "panneau-radio-card-padding" | "panneau-radio-card-bg" | "panneau-radio-card-border-color" | "panneau-radio-card-border-color-hover" | "panneau-radio-card-border-color-selected" | "panneau-radio-card-radius" | "panneau-radio-card-label-font-weight", string>>;
29
+ 'segmented-control': Readonly<Record<"panneau-segmented-control-radius" | "panneau-segmented-control-padding" | "panneau-segmented-control-bg" | "panneau-segmented-control-border-color" | "panneau-segmented-control-segment-padding-x" | "panneau-segmented-control-segment-font-weight" | "panneau-segmented-control-segment-color" | "panneau-segmented-control-segment-color-selected" | "panneau-segmented-control-segment-bg-selected" | "panneau-segmented-control-segment-shadow-selected", string>>;
26
30
  spinner: Readonly<Record<"panneau-spinner-border-width", string>>;
27
31
  stack: Readonly<Record<"panneau-stack-gap", string>>;
28
32
  switch: Readonly<Record<"panneau-switch-height" | "panneau-switch-width" | "panneau-switch-radius" | "panneau-switch-checked-bg" | "panneau-switch-track-bg" | "panneau-switch-thumb-size" | "panneau-switch-thumb-bg" | "panneau-switch-checked-thumb-bg", string>>;
@@ -1 +1 @@
1
- {"version":3,"file":"components.d.ts","sourceRoot":"","sources":["../../src/theme/components.ts"],"names":[],"mappings":"AA4BA;;;GAGG;AACH,eAAO,MAAM,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA4B1B,CAAC;AAEH,gFAAgF;AAChF,MAAM,MAAM,kBAAkB,GAAG;KAC5B,SAAS,IAAI,MAAM,OAAO,eAAe,GAAG,MAAM,CAAC,OAAO,eAAe,CAAC,CAAC,SAAS,CAAC;CACzF,CAAC,MAAM,OAAO,eAAe,CAAC,CAAC"}
1
+ {"version":3,"file":"components.d.ts","sourceRoot":"","sources":["../../src/theme/components.ts"],"names":[],"mappings":"AAgCA;;;GAGG;AACH,eAAO,MAAM,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAgC1B,CAAC;AAEH,gFAAgF;AAChF,MAAM,MAAM,kBAAkB,GAAG;KAC5B,SAAS,IAAI,MAAM,OAAO,eAAe,GAAG,MAAM,CAAC,OAAO,eAAe,CAAC,CAAC,SAAS,CAAC;CACzF,CAAC,MAAM,OAAO,eAAe,CAAC,CAAC"}
@@ -3,6 +3,7 @@ import { badgeTokens } from "../badge/tokens.js";
3
3
  import { buttonTokens } from "../button/tokens.js";
4
4
  import { cardTokens } from "../card/tokens.js";
5
5
  import { checkboxTokens } from "../checkbox/tokens.js";
6
+ import { commandPaletteTokens } from "../command-palette/tokens.js";
6
7
  import { containerTokens } from "../container/tokens.js";
7
8
  import { calendarTokens } from "../date-picker/calendarTokens.js";
8
9
  import { dialogTokens } from "../dialog/tokens.js";
@@ -13,10 +14,13 @@ import { fieldTokens } from "../field/tokens.js";
13
14
  import { gridTokens } from "../grid/tokens.js";
14
15
  import { headingTokens } from "../heading/tokens.js";
15
16
  import { inlineTokens } from "../inline/tokens.js";
17
+ import { menuTokens } from "../menu/tokens.js";
16
18
  import { numberInputTokens } from "../number-input/tokens.js";
19
+ import { pillTriggerTokens } from "../pill-trigger/tokens.js";
17
20
  import { popoverTokens } from "../popover/tokens.js";
18
21
  import { proseTokens } from "../prose/tokens.js";
19
22
  import { radioTokens } from "../radio-group/tokens.js";
23
+ import { segmentedControlTokens } from "../segmented-control/tokens.js";
20
24
  import { listBoxTokens } from "../select/listBoxTokens.js";
21
25
  import { spinnerTokens } from "../spinner/tokens.js";
22
26
  import { stackTokens } from "../stack/tokens.js";
@@ -37,6 +41,7 @@ var componentTokens = Object.freeze({
37
41
  calendar: calendarTokens.tokens,
38
42
  card: cardTokens.tokens,
39
43
  checkbox: checkboxTokens.tokens,
44
+ "command-palette": commandPaletteTokens.tokens,
40
45
  container: containerTokens.tokens,
41
46
  dialog: dialogTokens.tokens,
42
47
  disclosure: disclosureTokens.tokens,
@@ -47,10 +52,13 @@ var componentTokens = Object.freeze({
47
52
  inline: inlineTokens.tokens,
48
53
  input: inputTokens.tokens,
49
54
  "list-box": listBoxTokens.tokens,
55
+ menu: menuTokens.tokens,
50
56
  "number-input": numberInputTokens.tokens,
57
+ "pill-trigger": pillTriggerTokens.tokens,
51
58
  popover: popoverTokens.tokens,
52
59
  prose: proseTokens.tokens,
53
60
  radio: radioTokens.tokens,
61
+ "segmented-control": segmentedControlTokens.tokens,
54
62
  spinner: spinnerTokens.tokens,
55
63
  stack: stackTokens.tokens,
56
64
  switch: switchTokens.tokens,
@@ -1 +1 @@
1
- {"version":3,"file":"components.js","names":[],"sources":["../../src/theme/components.ts"],"sourcesContent":["import { alertTokens } from '../alert/tokens';\nimport { badgeTokens } from '../badge/tokens';\nimport { buttonTokens } from '../button/tokens';\nimport { cardTokens } from '../card/tokens';\nimport { checkboxTokens } from '../checkbox/tokens';\nimport { containerTokens } from '../container/tokens';\nimport { calendarTokens } from '../date-picker/calendarTokens';\nimport { dialogTokens } from '../dialog/tokens';\nimport { disclosureTokens } from '../disclosure/tokens';\nimport { dividerTokens } from '../divider/tokens';\nimport { inputTokens } from '../field/inputTokens';\nimport { fieldTokens } from '../field/tokens';\nimport { gridTokens } from '../grid/tokens';\nimport { headingTokens } from '../heading/tokens';\nimport { inlineTokens } from '../inline/tokens';\nimport { numberInputTokens } from '../number-input/tokens';\nimport { popoverTokens } from '../popover/tokens';\nimport { proseTokens } from '../prose/tokens';\nimport { radioTokens } from '../radio-group/tokens';\nimport { listBoxTokens } from '../select/listBoxTokens';\nimport { spinnerTokens } from '../spinner/tokens';\nimport { stackTokens } from '../stack/tokens';\nimport { switchTokens } from '../switch/tokens';\nimport { tabsTokens } from '../tabs/tokens';\nimport { textTokens } from '../text/tokens';\nimport { toastTokens } from '../toast/tokens';\nimport { tooltipTokens } from '../tooltip/tokens';\n\n/**\n * The component tokens of `@panneau/ui` and their defaults, by component: what a theme, a scope or\n * a project's CSS can set to restyle one component without touching the others (decision 0024).\n */\nexport const componentTokens = Object.freeze({\n alert: alertTokens.tokens,\n badge: badgeTokens.tokens,\n button: buttonTokens.tokens,\n calendar: calendarTokens.tokens,\n card: cardTokens.tokens,\n checkbox: checkboxTokens.tokens,\n container: containerTokens.tokens,\n dialog: dialogTokens.tokens,\n disclosure: disclosureTokens.tokens,\n divider: dividerTokens.tokens,\n field: fieldTokens.tokens,\n grid: gridTokens.tokens,\n heading: headingTokens.tokens,\n inline: inlineTokens.tokens,\n input: inputTokens.tokens,\n 'list-box': listBoxTokens.tokens,\n 'number-input': numberInputTokens.tokens,\n popover: popoverTokens.tokens,\n prose: proseTokens.tokens,\n radio: radioTokens.tokens,\n spinner: spinnerTokens.tokens,\n stack: stackTokens.tokens,\n switch: switchTokens.tokens,\n tabs: tabsTokens.tokens,\n text: textTokens.tokens,\n toast: toastTokens.tokens,\n tooltip: tooltipTokens.tokens,\n});\n\n/** The name of a component token of `@panneau/ui`, without the leading `--`. */\nexport type ComponentTokenName = {\n [Component in keyof typeof componentTokens]: keyof (typeof componentTokens)[Component];\n}[keyof typeof componentTokens];\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgCA,IAAa,kBAAkB,OAAO,OAAO;CACzC,OAAO,YAAY;CACnB,OAAO,YAAY;CACnB,QAAQ,aAAa;CACrB,UAAU,eAAe;CACzB,MAAM,WAAW;CACjB,UAAU,eAAe;CACzB,WAAW,gBAAgB;CAC3B,QAAQ,aAAa;CACrB,YAAY,iBAAiB;CAC7B,SAAS,cAAc;CACvB,OAAO,YAAY;CACnB,MAAM,WAAW;CACjB,SAAS,cAAc;CACvB,QAAQ,aAAa;CACrB,OAAO,YAAY;CACnB,YAAY,cAAc;CAC1B,gBAAgB,kBAAkB;CAClC,SAAS,cAAc;CACvB,OAAO,YAAY;CACnB,OAAO,YAAY;CACnB,SAAS,cAAc;CACvB,OAAO,YAAY;CACnB,QAAQ,aAAa;CACrB,MAAM,WAAW;CACjB,MAAM,WAAW;CACjB,OAAO,YAAY;CACnB,SAAS,cAAc;AAC3B,CAAC"}
1
+ {"version":3,"file":"components.js","names":[],"sources":["../../src/theme/components.ts"],"sourcesContent":["import { alertTokens } from '../alert/tokens';\nimport { badgeTokens } from '../badge/tokens';\nimport { buttonTokens } from '../button/tokens';\nimport { cardTokens } from '../card/tokens';\nimport { checkboxTokens } from '../checkbox/tokens';\nimport { commandPaletteTokens } from '../command-palette/tokens';\nimport { containerTokens } from '../container/tokens';\nimport { calendarTokens } from '../date-picker/calendarTokens';\nimport { dialogTokens } from '../dialog/tokens';\nimport { disclosureTokens } from '../disclosure/tokens';\nimport { dividerTokens } from '../divider/tokens';\nimport { inputTokens } from '../field/inputTokens';\nimport { fieldTokens } from '../field/tokens';\nimport { gridTokens } from '../grid/tokens';\nimport { headingTokens } from '../heading/tokens';\nimport { inlineTokens } from '../inline/tokens';\nimport { menuTokens } from '../menu/tokens';\nimport { numberInputTokens } from '../number-input/tokens';\nimport { pillTriggerTokens } from '../pill-trigger/tokens';\nimport { popoverTokens } from '../popover/tokens';\nimport { proseTokens } from '../prose/tokens';\nimport { radioTokens } from '../radio-group/tokens';\nimport { segmentedControlTokens } from '../segmented-control/tokens';\nimport { listBoxTokens } from '../select/listBoxTokens';\nimport { spinnerTokens } from '../spinner/tokens';\nimport { stackTokens } from '../stack/tokens';\nimport { switchTokens } from '../switch/tokens';\nimport { tabsTokens } from '../tabs/tokens';\nimport { textTokens } from '../text/tokens';\nimport { toastTokens } from '../toast/tokens';\nimport { tooltipTokens } from '../tooltip/tokens';\n\n/**\n * The component tokens of `@panneau/ui` and their defaults, by component: what a theme, a scope or\n * a project's CSS can set to restyle one component without touching the others (decision 0024).\n */\nexport const componentTokens = Object.freeze({\n alert: alertTokens.tokens,\n badge: badgeTokens.tokens,\n button: buttonTokens.tokens,\n calendar: calendarTokens.tokens,\n card: cardTokens.tokens,\n checkbox: checkboxTokens.tokens,\n 'command-palette': commandPaletteTokens.tokens,\n container: containerTokens.tokens,\n dialog: dialogTokens.tokens,\n disclosure: disclosureTokens.tokens,\n divider: dividerTokens.tokens,\n field: fieldTokens.tokens,\n grid: gridTokens.tokens,\n heading: headingTokens.tokens,\n inline: inlineTokens.tokens,\n input: inputTokens.tokens,\n 'list-box': listBoxTokens.tokens,\n menu: menuTokens.tokens,\n 'number-input': numberInputTokens.tokens,\n 'pill-trigger': pillTriggerTokens.tokens,\n popover: popoverTokens.tokens,\n prose: proseTokens.tokens,\n radio: radioTokens.tokens,\n 'segmented-control': segmentedControlTokens.tokens,\n spinner: spinnerTokens.tokens,\n stack: stackTokens.tokens,\n switch: switchTokens.tokens,\n tabs: tabsTokens.tokens,\n text: textTokens.tokens,\n toast: toastTokens.tokens,\n tooltip: tooltipTokens.tokens,\n});\n\n/** The name of a component token of `@panneau/ui`, without the leading `--`. */\nexport type ComponentTokenName = {\n [Component in keyof typeof componentTokens]: keyof (typeof componentTokens)[Component];\n}[keyof typeof componentTokens];\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoCA,IAAa,kBAAkB,OAAO,OAAO;CACzC,OAAO,YAAY;CACnB,OAAO,YAAY;CACnB,QAAQ,aAAa;CACrB,UAAU,eAAe;CACzB,MAAM,WAAW;CACjB,UAAU,eAAe;CACzB,mBAAmB,qBAAqB;CACxC,WAAW,gBAAgB;CAC3B,QAAQ,aAAa;CACrB,YAAY,iBAAiB;CAC7B,SAAS,cAAc;CACvB,OAAO,YAAY;CACnB,MAAM,WAAW;CACjB,SAAS,cAAc;CACvB,QAAQ,aAAa;CACrB,OAAO,YAAY;CACnB,YAAY,cAAc;CAC1B,MAAM,WAAW;CACjB,gBAAgB,kBAAkB;CAClC,gBAAgB,kBAAkB;CAClC,SAAS,cAAc;CACvB,OAAO,YAAY;CACnB,OAAO,YAAY;CACnB,qBAAqB,uBAAuB;CAC5C,SAAS,cAAc;CACvB,OAAO,YAAY;CACnB,QAAQ,aAAa;CACrB,MAAM,WAAW;CACjB,MAAM,WAAW;CACjB,OAAO,YAAY;CACnB,SAAS,cAAc;AAC3B,CAAC"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@panneau/ui",
3
- "version": "5.0.0-alpha.4",
3
+ "version": "5.0.0-alpha.6",
4
4
  "description": "Design tokens, themes and accessible primitives of Panneau, built on React Aria Components.",
5
5
  "type": "module",
6
6
  "license": "MIT",
@@ -57,10 +57,10 @@
57
57
  "react-intl": "^12.0.0"
58
58
  },
59
59
  "dependencies": {
60
- "@panneau/intl": "5.0.0-alpha.4",
60
+ "@panneau/intl": "5.0.0-alpha.6",
61
61
  "lucide-react": "^1.57.0"
62
62
  },
63
63
  "devDependencies": {
64
- "@panneau/protocol": "5.0.0-alpha.4"
64
+ "@panneau/protocol": "5.0.0-alpha.6"
65
65
  }
66
66
  }