frey-ui 1.0.10 → 1.0.11
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.
- package/README.md +25 -327
- package/dist/cjs/Accordion/accordion.module.css.cjs +9 -0
- package/dist/cjs/Accordion/accordion.module.css.cjs.map +1 -0
- package/dist/cjs/Accordion/index.cjs +99 -0
- package/dist/cjs/Accordion/index.cjs.map +1 -0
- package/dist/cjs/Alert/{alert.module.css.js → alert.module.css.cjs} +1 -1
- package/dist/cjs/Alert/alert.module.css.cjs.map +1 -0
- package/dist/cjs/Alert/{index.js → index.cjs} +3 -3
- package/dist/cjs/Alert/index.cjs.map +1 -0
- package/dist/cjs/Avatar/avatar.module.css.cjs +9 -0
- package/dist/cjs/Avatar/avatar.module.css.cjs.map +1 -0
- package/dist/cjs/Avatar/index.cjs +53 -0
- package/dist/cjs/Avatar/index.cjs.map +1 -0
- package/dist/cjs/Button/{button.module.css.js → button.module.css.cjs} +1 -1
- package/dist/cjs/Button/button.module.css.cjs.map +1 -0
- package/dist/cjs/Button/index.cjs +30 -0
- package/dist/cjs/Button/index.cjs.map +1 -0
- package/dist/cjs/Card/card.module.css.cjs +9 -0
- package/dist/cjs/Card/card.module.css.cjs.map +1 -0
- package/dist/cjs/Card/index.cjs +40 -0
- package/dist/cjs/Card/index.cjs.map +1 -0
- package/dist/cjs/Checkbox/{checkbox.module.css.js → checkbox.module.css.cjs} +1 -1
- package/dist/cjs/Checkbox/checkbox.module.css.cjs.map +1 -0
- package/dist/cjs/Checkbox/{index.js → index.cjs} +6 -8
- package/dist/cjs/Checkbox/index.cjs.map +1 -0
- package/dist/cjs/Chip/{chip.module.css.js → chip.module.css.cjs} +1 -1
- package/dist/cjs/Chip/chip.module.css.cjs.map +1 -0
- package/dist/cjs/Chip/{index.js → index.cjs} +5 -7
- package/dist/cjs/Chip/index.cjs.map +1 -0
- package/dist/cjs/Dialog/{dialog.module.css.js → dialog.module.css.cjs} +1 -1
- package/dist/cjs/Dialog/dialog.module.css.cjs.map +1 -0
- package/dist/cjs/Dialog/index.cjs +195 -0
- package/dist/cjs/Dialog/index.cjs.map +1 -0
- package/dist/cjs/DropdownMenu/{dropdownmenu.module.css.js → dropdownmenu.module.css.cjs} +1 -1
- package/dist/cjs/DropdownMenu/dropdownmenu.module.css.cjs.map +1 -0
- package/dist/cjs/DropdownMenu/index.cjs +153 -0
- package/dist/cjs/DropdownMenu/index.cjs.map +1 -0
- package/dist/cjs/Field/{field.module.css.js → field.module.css.cjs} +1 -1
- package/dist/cjs/Field/field.module.css.cjs.map +1 -0
- package/dist/cjs/Field/{index.js → index.cjs} +3 -3
- package/dist/cjs/Field/index.cjs.map +1 -0
- package/dist/cjs/Icons/{icons.module.css.js → icons.module.css.cjs} +1 -1
- package/dist/cjs/Icons/icons.module.css.cjs.map +1 -0
- package/dist/cjs/Icons/{index.js → index.cjs} +7 -7
- package/dist/cjs/Icons/index.cjs.map +1 -0
- package/dist/cjs/Popover/index.cjs +102 -0
- package/dist/cjs/Popover/index.cjs.map +1 -0
- package/dist/cjs/Popover/{popover.module.css.js → popover.module.css.cjs} +1 -1
- package/dist/cjs/Popover/popover.module.css.cjs.map +1 -0
- package/dist/cjs/Progress/index.cjs +29 -0
- package/dist/cjs/Progress/index.cjs.map +1 -0
- package/dist/cjs/Progress/{progress.module.css.js → progress.module.css.cjs} +1 -1
- package/dist/cjs/Progress/progress.module.css.cjs.map +1 -0
- package/dist/cjs/RadioGroup/{index.js → index.cjs} +9 -11
- package/dist/cjs/RadioGroup/index.cjs.map +1 -0
- package/dist/cjs/RadioGroup/{radiogroup.module.css.js → radiogroup.module.css.cjs} +1 -1
- package/dist/cjs/RadioGroup/radiogroup.module.css.cjs.map +1 -0
- package/dist/cjs/Select/index.cjs +28 -0
- package/dist/cjs/Select/index.cjs.map +1 -0
- package/dist/cjs/Select/{select.module.css.js → select.module.css.cjs} +1 -1
- package/dist/cjs/Select/select.module.css.cjs.map +1 -0
- package/dist/cjs/Skeleton/{index.js → index.cjs} +7 -3
- package/dist/cjs/Skeleton/index.cjs.map +1 -0
- package/dist/cjs/Skeleton/{skeleton.module.css.js → skeleton.module.css.cjs} +1 -1
- package/dist/cjs/Skeleton/skeleton.module.css.cjs.map +1 -0
- package/dist/cjs/Spinner/{index.js → index.cjs} +7 -4
- package/dist/cjs/Spinner/index.cjs.map +1 -0
- package/dist/cjs/Spinner/{spinner.module.css.js → spinner.module.css.cjs} +1 -1
- package/dist/cjs/Spinner/spinner.module.css.cjs.map +1 -0
- package/dist/cjs/Switch/{index.js → index.cjs} +7 -9
- package/dist/cjs/Switch/index.cjs.map +1 -0
- package/dist/cjs/Switch/{switch.module.css.js → switch.module.css.cjs} +1 -1
- package/dist/cjs/Switch/switch.module.css.cjs.map +1 -0
- package/dist/cjs/Tabs/index.cjs +87 -0
- package/dist/cjs/Tabs/index.cjs.map +1 -0
- package/dist/cjs/Tabs/tabs.module.css.cjs +9 -0
- package/dist/cjs/Tabs/tabs.module.css.cjs.map +1 -0
- package/dist/cjs/TextInput/{index.js → index.cjs} +6 -8
- package/dist/cjs/TextInput/index.cjs.map +1 -0
- package/dist/cjs/TextInput/{textinput.module.css.js → textinput.module.css.cjs} +1 -1
- package/dist/cjs/TextInput/textinput.module.css.cjs.map +1 -0
- package/dist/cjs/Textarea/index.cjs +28 -0
- package/dist/cjs/Textarea/index.cjs.map +1 -0
- package/dist/cjs/Textarea/{textarea.module.css.js → textarea.module.css.cjs} +1 -1
- package/dist/cjs/Textarea/textarea.module.css.cjs.map +1 -0
- package/dist/cjs/ThemeProvider/{index.js → index.cjs} +2 -2
- package/dist/cjs/ThemeProvider/index.cjs.map +1 -0
- package/dist/cjs/ThemeProvider/{themeprovider.module.css.js → themeprovider.module.css.cjs} +1 -1
- package/dist/cjs/ThemeProvider/themeprovider.module.css.cjs.map +1 -0
- package/dist/cjs/Toast/{index.js → index.cjs} +6 -8
- package/dist/cjs/Toast/index.cjs.map +1 -0
- package/dist/cjs/Toast/{toast.module.css.js → toast.module.css.cjs} +1 -1
- package/dist/cjs/Toast/toast.module.css.cjs.map +1 -0
- package/dist/cjs/Tooltip/index.cjs +102 -0
- package/dist/cjs/Tooltip/index.cjs.map +1 -0
- package/dist/cjs/Tooltip/{tooltip.module.css.js → tooltip.module.css.cjs} +1 -1
- package/dist/cjs/Tooltip/tooltip.module.css.cjs.map +1 -0
- package/dist/cjs/hooks/useControllableState.cjs +24 -0
- package/dist/cjs/hooks/useControllableState.cjs.map +1 -0
- package/dist/cjs/hooks/useDismiss.cjs +44 -0
- package/dist/cjs/hooks/useDismiss.cjs.map +1 -0
- package/dist/cjs/hooks/useFloatingPosition.cjs +68 -0
- package/dist/cjs/hooks/useFloatingPosition.cjs.map +1 -0
- package/dist/cjs/index.cjs +64 -0
- package/dist/cjs/index.cjs.map +1 -0
- package/dist/cjs/utils/clamp.cjs +9 -0
- package/dist/cjs/utils/clamp.cjs.map +1 -0
- package/dist/cjs/utils/mergeRefs.cjs +21 -0
- package/dist/cjs/utils/mergeRefs.cjs.map +1 -0
- package/dist/cjs/utils/slot.cjs +61 -0
- package/dist/cjs/utils/slot.cjs.map +1 -0
- package/dist/esm/Accordion/accordion.module.css.mjs +5 -0
- package/dist/esm/Accordion/accordion.module.css.mjs.map +1 -0
- package/dist/esm/Accordion/index.mjs +94 -0
- package/dist/esm/Accordion/index.mjs.map +1 -0
- package/dist/esm/Alert/{alert.module.css.js → alert.module.css.mjs} +1 -1
- package/dist/esm/Alert/alert.module.css.mjs.map +1 -0
- package/dist/esm/Alert/{index.js → index.mjs} +3 -3
- package/dist/esm/Alert/index.mjs.map +1 -0
- package/dist/esm/Avatar/avatar.module.css.mjs +5 -0
- package/dist/esm/Avatar/avatar.module.css.mjs.map +1 -0
- package/dist/esm/Avatar/index.mjs +49 -0
- package/dist/esm/Avatar/index.mjs.map +1 -0
- package/dist/esm/Button/{button.module.css.js → button.module.css.mjs} +1 -1
- package/dist/esm/Button/button.module.css.mjs.map +1 -0
- package/dist/esm/Button/index.mjs +26 -0
- package/dist/esm/Button/index.mjs.map +1 -0
- package/dist/esm/Card/card.module.css.mjs +5 -0
- package/dist/esm/Card/card.module.css.mjs.map +1 -0
- package/dist/esm/Card/index.mjs +35 -0
- package/dist/esm/Card/index.mjs.map +1 -0
- package/dist/esm/Checkbox/{checkbox.module.css.js → checkbox.module.css.mjs} +1 -1
- package/dist/esm/Checkbox/checkbox.module.css.mjs.map +1 -0
- package/dist/esm/Checkbox/{index.js → index.mjs} +6 -8
- package/dist/esm/Checkbox/index.mjs.map +1 -0
- package/dist/esm/Chip/{chip.module.css.js → chip.module.css.mjs} +1 -1
- package/dist/esm/Chip/chip.module.css.mjs.map +1 -0
- package/dist/esm/Chip/{index.js → index.mjs} +5 -7
- package/dist/esm/Chip/index.mjs.map +1 -0
- package/dist/esm/Dialog/{dialog.module.css.js → dialog.module.css.mjs} +1 -1
- package/dist/esm/Dialog/dialog.module.css.mjs.map +1 -0
- package/dist/esm/Dialog/index.mjs +190 -0
- package/dist/esm/Dialog/index.mjs.map +1 -0
- package/dist/esm/DropdownMenu/{dropdownmenu.module.css.js → dropdownmenu.module.css.mjs} +1 -1
- package/dist/esm/DropdownMenu/dropdownmenu.module.css.mjs.map +1 -0
- package/dist/esm/DropdownMenu/index.mjs +148 -0
- package/dist/esm/DropdownMenu/index.mjs.map +1 -0
- package/dist/esm/Field/{field.module.css.js → field.module.css.mjs} +1 -1
- package/dist/esm/Field/field.module.css.mjs.map +1 -0
- package/dist/esm/Field/{index.js → index.mjs} +3 -3
- package/dist/esm/Field/index.mjs.map +1 -0
- package/dist/esm/Icons/{icons.module.css.js → icons.module.css.mjs} +1 -1
- package/dist/esm/Icons/icons.module.css.mjs.map +1 -0
- package/dist/esm/Icons/{index.js → index.mjs} +8 -8
- package/dist/esm/Icons/index.mjs.map +1 -0
- package/dist/esm/Popover/index.mjs +97 -0
- package/dist/esm/Popover/index.mjs.map +1 -0
- package/dist/esm/Popover/{popover.module.css.js → popover.module.css.mjs} +1 -1
- package/dist/esm/Popover/popover.module.css.mjs.map +1 -0
- package/dist/esm/Progress/index.mjs +25 -0
- package/dist/esm/Progress/index.mjs.map +1 -0
- package/dist/esm/Progress/{progress.module.css.js → progress.module.css.mjs} +1 -1
- package/dist/esm/Progress/progress.module.css.mjs.map +1 -0
- package/dist/esm/RadioGroup/{index.js → index.mjs} +9 -11
- package/dist/esm/RadioGroup/index.mjs.map +1 -0
- package/dist/esm/RadioGroup/{radiogroup.module.css.js → radiogroup.module.css.mjs} +1 -1
- package/dist/esm/RadioGroup/radiogroup.module.css.mjs.map +1 -0
- package/dist/esm/Select/index.mjs +24 -0
- package/dist/esm/Select/index.mjs.map +1 -0
- package/dist/esm/Select/{select.module.css.js → select.module.css.mjs} +1 -1
- package/dist/esm/Select/select.module.css.mjs.map +1 -0
- package/dist/esm/Skeleton/{index.js → index.mjs} +7 -3
- package/dist/esm/Skeleton/index.mjs.map +1 -0
- package/dist/esm/Skeleton/{skeleton.module.css.js → skeleton.module.css.mjs} +1 -1
- package/dist/esm/Skeleton/skeleton.module.css.mjs.map +1 -0
- package/dist/esm/Spinner/{index.js → index.mjs} +7 -4
- package/dist/esm/Spinner/index.mjs.map +1 -0
- package/dist/esm/Spinner/{spinner.module.css.js → spinner.module.css.mjs} +1 -1
- package/dist/esm/Spinner/spinner.module.css.mjs.map +1 -0
- package/dist/esm/Switch/index.mjs +34 -0
- package/dist/esm/Switch/index.mjs.map +1 -0
- package/dist/esm/Switch/{switch.module.css.js → switch.module.css.mjs} +1 -1
- package/dist/esm/Switch/switch.module.css.mjs.map +1 -0
- package/dist/esm/Tabs/index.mjs +82 -0
- package/dist/esm/Tabs/index.mjs.map +1 -0
- package/dist/esm/Tabs/tabs.module.css.mjs +5 -0
- package/dist/esm/Tabs/tabs.module.css.mjs.map +1 -0
- package/dist/esm/TextInput/index.mjs +27 -0
- package/dist/esm/TextInput/index.mjs.map +1 -0
- package/dist/esm/TextInput/{textinput.module.css.js → textinput.module.css.mjs} +1 -1
- package/dist/esm/TextInput/textinput.module.css.mjs.map +1 -0
- package/dist/esm/Textarea/index.mjs +24 -0
- package/dist/esm/Textarea/index.mjs.map +1 -0
- package/dist/esm/Textarea/{textarea.module.css.js → textarea.module.css.mjs} +1 -1
- package/dist/esm/Textarea/textarea.module.css.mjs.map +1 -0
- package/dist/esm/ThemeProvider/{index.js → index.mjs} +2 -2
- package/dist/esm/ThemeProvider/index.mjs.map +1 -0
- package/dist/esm/ThemeProvider/{themeprovider.module.css.js → themeprovider.module.css.mjs} +1 -1
- package/dist/esm/ThemeProvider/themeprovider.module.css.mjs.map +1 -0
- package/dist/esm/Toast/{index.js → index.mjs} +6 -8
- package/dist/esm/Toast/index.mjs.map +1 -0
- package/dist/esm/Toast/{toast.module.css.js → toast.module.css.mjs} +1 -1
- package/dist/esm/Toast/toast.module.css.mjs.map +1 -0
- package/dist/esm/Tooltip/index.mjs +98 -0
- package/dist/esm/Tooltip/index.mjs.map +1 -0
- package/dist/esm/Tooltip/{tooltip.module.css.js → tooltip.module.css.mjs} +1 -1
- package/dist/esm/Tooltip/tooltip.module.css.mjs.map +1 -0
- package/dist/esm/hooks/useControllableState.mjs +22 -0
- package/dist/esm/hooks/useControllableState.mjs.map +1 -0
- package/dist/esm/hooks/useDismiss.mjs +42 -0
- package/dist/esm/hooks/useDismiss.mjs.map +1 -0
- package/dist/esm/hooks/useFloatingPosition.mjs +66 -0
- package/dist/esm/hooks/useFloatingPosition.mjs.map +1 -0
- package/dist/esm/index.mjs +26 -0
- package/dist/esm/index.mjs.map +1 -0
- package/dist/esm/utils/clamp.mjs +7 -0
- package/dist/esm/utils/clamp.mjs.map +1 -0
- package/dist/esm/utils/mergeRefs.mjs +19 -0
- package/dist/esm/utils/mergeRefs.mjs.map +1 -0
- package/dist/esm/utils/slot.mjs +58 -0
- package/dist/esm/utils/slot.mjs.map +1 -0
- package/dist/index.d.ts +230 -67
- package/dist/styles.css +2 -1
- package/dist/styles.css.map +1 -1
- package/dist/types/src/Accordion/index.d.ts +29 -0
- package/dist/types/src/Accordion/index.d.ts.map +1 -0
- package/dist/types/src/Alert/index.d.ts +3 -1
- package/dist/types/src/Alert/index.d.ts.map +1 -0
- package/dist/types/src/Avatar/index.d.ts +14 -0
- package/dist/types/src/Avatar/index.d.ts.map +1 -0
- package/dist/types/src/Button/index.d.ts +4 -4
- package/dist/types/src/Button/index.d.ts.map +1 -0
- package/dist/types/src/Card/index.d.ts +25 -0
- package/dist/types/src/Card/index.d.ts.map +1 -0
- package/dist/types/src/Checkbox/index.d.ts +3 -1
- package/dist/types/src/Checkbox/index.d.ts.map +1 -0
- package/dist/types/src/Chip/index.d.ts +5 -3
- package/dist/types/src/Chip/index.d.ts.map +1 -0
- package/dist/types/src/Dialog/index.d.ts +51 -10
- package/dist/types/src/Dialog/index.d.ts.map +1 -0
- package/dist/types/src/DropdownMenu/index.d.ts +29 -15
- package/dist/types/src/DropdownMenu/index.d.ts.map +1 -0
- package/dist/types/src/Field/index.d.ts +2 -1
- package/dist/types/src/Field/index.d.ts.map +1 -0
- package/dist/types/src/Icons/index.d.ts +11 -9
- package/dist/types/src/Icons/index.d.ts.map +1 -0
- package/dist/types/src/Popover/index.d.ts +21 -8
- package/dist/types/src/Popover/index.d.ts.map +1 -0
- package/dist/types/src/Progress/index.d.ts +3 -1
- package/dist/types/src/Progress/index.d.ts.map +1 -0
- package/dist/types/src/RadioGroup/index.d.ts +3 -1
- package/dist/types/src/RadioGroup/index.d.ts.map +1 -0
- package/dist/types/src/Select/index.d.ts +3 -1
- package/dist/types/src/Select/index.d.ts.map +1 -0
- package/dist/types/src/Skeleton/index.d.ts +3 -1
- package/dist/types/src/Skeleton/index.d.ts.map +1 -0
- package/dist/types/src/Spinner/index.d.ts +3 -1
- package/dist/types/src/Spinner/index.d.ts.map +1 -0
- package/dist/types/src/Switch/index.d.ts +3 -1
- package/dist/types/src/Switch/index.d.ts.map +1 -0
- package/dist/types/src/Tabs/index.d.ts +29 -0
- package/dist/types/src/Tabs/index.d.ts.map +1 -0
- package/dist/types/src/TextInput/index.d.ts +3 -1
- package/dist/types/src/TextInput/index.d.ts.map +1 -0
- package/dist/types/src/Textarea/index.d.ts +3 -1
- package/dist/types/src/Textarea/index.d.ts.map +1 -0
- package/dist/types/src/ThemeProvider/index.d.ts +2 -1
- package/dist/types/src/ThemeProvider/index.d.ts.map +1 -0
- package/dist/types/src/Toast/index.d.ts +2 -1
- package/dist/types/src/Toast/index.d.ts.map +1 -0
- package/dist/types/src/Tooltip/index.d.ts +4 -2
- package/dist/types/src/Tooltip/index.d.ts.map +1 -0
- package/dist/types/src/hooks/useControllableState.d.ts +6 -0
- package/dist/types/src/hooks/useControllableState.d.ts.map +1 -0
- package/dist/types/src/hooks/useDismiss.d.ts +18 -0
- package/dist/types/src/hooks/useDismiss.d.ts.map +1 -0
- package/dist/types/src/hooks/useFloatingPosition.d.ts +26 -0
- package/dist/types/src/hooks/useFloatingPosition.d.ts.map +1 -0
- package/dist/types/src/index.d.ts +12 -3
- package/dist/types/src/index.d.ts.map +1 -0
- package/dist/types/src/types/polymorphic.d.ts +6 -0
- package/dist/types/src/types/polymorphic.d.ts.map +1 -0
- package/dist/types/src/utils/clamp.d.ts +2 -0
- package/dist/types/src/utils/clamp.d.ts.map +1 -0
- package/dist/types/src/utils/mergeRefs.d.ts +3 -0
- package/dist/types/src/utils/mergeRefs.d.ts.map +1 -0
- package/dist/types/src/utils/slot.d.ts +12 -0
- package/dist/types/src/utils/slot.d.ts.map +1 -0
- package/package.json +131 -15
- package/dist/cjs/Alert/alert.module.css.js.map +0 -1
- package/dist/cjs/Alert/index.js.map +0 -1
- package/dist/cjs/Button/button.module.css.js.map +0 -1
- package/dist/cjs/Button/index.js +0 -32
- package/dist/cjs/Button/index.js.map +0 -1
- package/dist/cjs/Checkbox/checkbox.module.css.js.map +0 -1
- package/dist/cjs/Checkbox/index.js.map +0 -1
- package/dist/cjs/Chip/chip.module.css.js.map +0 -1
- package/dist/cjs/Chip/index.js.map +0 -1
- package/dist/cjs/Dialog/dialog.module.css.js.map +0 -1
- package/dist/cjs/Dialog/index.js +0 -130
- package/dist/cjs/Dialog/index.js.map +0 -1
- package/dist/cjs/DropdownMenu/dropdownmenu.module.css.js.map +0 -1
- package/dist/cjs/DropdownMenu/index.js +0 -220
- package/dist/cjs/DropdownMenu/index.js.map +0 -1
- package/dist/cjs/Field/field.module.css.js.map +0 -1
- package/dist/cjs/Field/index.js.map +0 -1
- package/dist/cjs/Icons/icons.module.css.js.map +0 -1
- package/dist/cjs/Icons/index.js.map +0 -1
- package/dist/cjs/Popover/index.js +0 -145
- package/dist/cjs/Popover/index.js.map +0 -1
- package/dist/cjs/Popover/popover.module.css.js.map +0 -1
- package/dist/cjs/Progress/index.js +0 -31
- package/dist/cjs/Progress/index.js.map +0 -1
- package/dist/cjs/Progress/progress.module.css.js.map +0 -1
- package/dist/cjs/RadioGroup/index.js.map +0 -1
- package/dist/cjs/RadioGroup/radiogroup.module.css.js.map +0 -1
- package/dist/cjs/Select/index.js +0 -31
- package/dist/cjs/Select/index.js.map +0 -1
- package/dist/cjs/Select/select.module.css.js.map +0 -1
- package/dist/cjs/Skeleton/index.js.map +0 -1
- package/dist/cjs/Skeleton/skeleton.module.css.js.map +0 -1
- package/dist/cjs/Spinner/index.js.map +0 -1
- package/dist/cjs/Spinner/spinner.module.css.js.map +0 -1
- package/dist/cjs/Switch/index.js.map +0 -1
- package/dist/cjs/Switch/switch.module.css.js.map +0 -1
- package/dist/cjs/TextInput/index.js.map +0 -1
- package/dist/cjs/TextInput/textinput.module.css.js.map +0 -1
- package/dist/cjs/Textarea/index.js +0 -31
- package/dist/cjs/Textarea/index.js.map +0 -1
- package/dist/cjs/Textarea/textarea.module.css.js.map +0 -1
- package/dist/cjs/ThemeProvider/index.js.map +0 -1
- package/dist/cjs/ThemeProvider/themeprovider.module.css.js.map +0 -1
- package/dist/cjs/Toast/index.js.map +0 -1
- package/dist/cjs/Toast/toast.module.css.js.map +0 -1
- package/dist/cjs/Tooltip/index.js +0 -165
- package/dist/cjs/Tooltip/index.js.map +0 -1
- package/dist/cjs/Tooltip/tooltip.module.css.js.map +0 -1
- package/dist/cjs/index.js +0 -56
- package/dist/cjs/index.js.map +0 -1
- package/dist/esm/Alert/alert.module.css.js.map +0 -1
- package/dist/esm/Alert/index.js.map +0 -1
- package/dist/esm/Button/button.module.css.js.map +0 -1
- package/dist/esm/Button/index.js +0 -28
- package/dist/esm/Button/index.js.map +0 -1
- package/dist/esm/Checkbox/checkbox.module.css.js.map +0 -1
- package/dist/esm/Checkbox/index.js.map +0 -1
- package/dist/esm/Chip/chip.module.css.js.map +0 -1
- package/dist/esm/Chip/index.js.map +0 -1
- package/dist/esm/Dialog/dialog.module.css.js.map +0 -1
- package/dist/esm/Dialog/index.js +0 -126
- package/dist/esm/Dialog/index.js.map +0 -1
- package/dist/esm/DropdownMenu/dropdownmenu.module.css.js.map +0 -1
- package/dist/esm/DropdownMenu/index.js +0 -216
- package/dist/esm/DropdownMenu/index.js.map +0 -1
- package/dist/esm/Field/field.module.css.js.map +0 -1
- package/dist/esm/Field/index.js.map +0 -1
- package/dist/esm/Icons/icons.module.css.js.map +0 -1
- package/dist/esm/Icons/index.js.map +0 -1
- package/dist/esm/Popover/index.js +0 -141
- package/dist/esm/Popover/index.js.map +0 -1
- package/dist/esm/Popover/popover.module.css.js.map +0 -1
- package/dist/esm/Progress/index.js +0 -27
- package/dist/esm/Progress/index.js.map +0 -1
- package/dist/esm/Progress/progress.module.css.js.map +0 -1
- package/dist/esm/RadioGroup/index.js.map +0 -1
- package/dist/esm/RadioGroup/radiogroup.module.css.js.map +0 -1
- package/dist/esm/Select/index.js +0 -27
- package/dist/esm/Select/index.js.map +0 -1
- package/dist/esm/Select/select.module.css.js.map +0 -1
- package/dist/esm/Skeleton/index.js.map +0 -1
- package/dist/esm/Skeleton/skeleton.module.css.js.map +0 -1
- package/dist/esm/Spinner/index.js.map +0 -1
- package/dist/esm/Spinner/spinner.module.css.js.map +0 -1
- package/dist/esm/Switch/index.js +0 -36
- package/dist/esm/Switch/index.js.map +0 -1
- package/dist/esm/Switch/switch.module.css.js.map +0 -1
- package/dist/esm/TextInput/index.js +0 -29
- package/dist/esm/TextInput/index.js.map +0 -1
- package/dist/esm/TextInput/textinput.module.css.js.map +0 -1
- package/dist/esm/Textarea/index.js +0 -27
- package/dist/esm/Textarea/index.js.map +0 -1
- package/dist/esm/Textarea/textarea.module.css.js.map +0 -1
- package/dist/esm/ThemeProvider/index.js.map +0 -1
- package/dist/esm/ThemeProvider/themeprovider.module.css.js.map +0 -1
- package/dist/esm/Toast/index.js.map +0 -1
- package/dist/esm/Toast/toast.module.css.js.map +0 -1
- package/dist/esm/Tooltip/index.js +0 -161
- package/dist/esm/Tooltip/index.js.map +0 -1
- package/dist/esm/Tooltip/tooltip.module.css.js.map +0 -1
- package/dist/esm/index.js +0 -22
- package/dist/esm/index.js.map +0 -1
- package/dist/tsconfig.lib.tsbuildinfo +0 -1
package/README.md
CHANGED
|
@@ -4,7 +4,7 @@ A strict, accessible design system library for internal applications.
|
|
|
4
4
|
|
|
5
5
|
## Browser Support
|
|
6
6
|
|
|
7
|
-
Frey UI targets **ES2016+** and supports
|
|
7
|
+
Frey UI targets **ES2016+** and supports modern evergreen browsers:
|
|
8
8
|
|
|
9
9
|
- Chrome / Edge 80+
|
|
10
10
|
- Firefox 78+
|
|
@@ -14,13 +14,12 @@ Frey UI targets **ES2016+** and supports all modern evergreen browsers:
|
|
|
14
14
|
|
|
15
15
|
Frey UI is built with **WCAG 2.1 AA** compliance as a goal:
|
|
16
16
|
|
|
17
|
-
-
|
|
18
|
-
- Non-native interactive elements receive
|
|
19
|
-
-
|
|
20
|
-
- Focus
|
|
21
|
-
- Disabled states are functional, not just visual.
|
|
17
|
+
- Interactive components use semantic HTML (`button`, `input`, `label`)
|
|
18
|
+
- Non-native interactive elements receive keyboard/focus affordances automatically
|
|
19
|
+
- Form controls support accessible labels, helper text, and error messaging
|
|
20
|
+
- Focus-visible styles are provided across interactive components
|
|
22
21
|
|
|
23
|
-
Automated
|
|
22
|
+
Automated checks run through [`jest-axe`](https://github.com/nickcolley/jest-axe) in unit tests and [`@storybook/addon-a11y`](https://storybook.js.org/addons/@storybook/addon-a11y) in Storybook.
|
|
24
23
|
|
|
25
24
|
## Installation
|
|
26
25
|
|
|
@@ -32,344 +31,43 @@ npm install frey-ui
|
|
|
32
31
|
|
|
33
32
|
## Setup
|
|
34
33
|
|
|
35
|
-
Import the stylesheet
|
|
36
|
-
This file includes all component styles **and** the default theme variables — it is required.
|
|
34
|
+
Import the stylesheet once in your app root (for example `App.tsx` or `layout.tsx`):
|
|
37
35
|
|
|
38
36
|
```tsx
|
|
39
37
|
import 'frey-ui/style.css';
|
|
40
38
|
```
|
|
41
39
|
|
|
42
|
-
##
|
|
40
|
+
## Public Subpath Imports
|
|
41
|
+
|
|
42
|
+
Frey UI supports component-level JavaScript subpath imports only.
|
|
43
|
+
|
|
44
|
+
```tsx
|
|
45
|
+
import Button from 'frey-ui/Button';
|
|
46
|
+
import Tooltip from 'frey-ui/Tooltip';
|
|
47
|
+
```
|
|
48
|
+
|
|
49
|
+
Non-component subpaths such as `frey-ui/hooks/*` and `frey-ui/utils/*` are internal and not part of the public API contract.
|
|
50
|
+
|
|
51
|
+
## Basic Usage
|
|
43
52
|
|
|
44
53
|
```tsx
|
|
45
|
-
import {
|
|
54
|
+
import { Button, ThemeProvider } from 'frey-ui';
|
|
46
55
|
|
|
47
56
|
function App() {
|
|
48
57
|
return (
|
|
49
58
|
<ThemeProvider theme='light'>
|
|
50
|
-
<
|
|
51
|
-
<Switch label='Enable Dark Mode' />
|
|
59
|
+
<Button>Save changes</Button>
|
|
52
60
|
</ThemeProvider>
|
|
53
61
|
);
|
|
54
62
|
}
|
|
55
63
|
```
|
|
56
64
|
|
|
57
|
-
##
|
|
58
|
-
|
|
59
|
-
Frey UI currently exports:
|
|
60
|
-
|
|
61
|
-
- `Alert`
|
|
62
|
-
- `Button`
|
|
63
|
-
- `Checkbox`
|
|
64
|
-
- `Chip`
|
|
65
|
-
- `Dialog`
|
|
66
|
-
- `DropdownMenu`
|
|
67
|
-
- `Field`
|
|
68
|
-
- `Icons` (`CloseIcon`, `ChevronDownIcon`, `CheckIcon`, `MinusIcon`, `CircleXIcon`, `CircleCheckIcon`, `TriangleAlertIcon`, `CircleInfoIcon`)
|
|
69
|
-
- `Popover`
|
|
70
|
-
- `RadioGroup`
|
|
71
|
-
- `Progress`
|
|
72
|
-
- `Select`
|
|
73
|
-
- `Skeleton`
|
|
74
|
-
- `Spinner`
|
|
75
|
-
- `Switch`
|
|
76
|
-
- `Textarea`
|
|
77
|
-
- `TextInput`
|
|
78
|
-
- `ToastProvider` + `useToast`
|
|
79
|
-
- `Tooltip`
|
|
80
|
-
- `ThemeProvider`
|
|
81
|
-
|
|
82
|
-
### `Field`
|
|
83
|
-
|
|
84
|
-
Shared form field wrapper for labels, helper text, and error messaging.
|
|
85
|
-
|
|
86
|
-
- `label` (`string`, required): field label text.
|
|
87
|
-
- `hideLabel` (`boolean`, default `false`): visually hide label while keeping it accessible.
|
|
88
|
-
- `error` (`string`): error text rendered with `role='alert'`.
|
|
89
|
-
- `helperText` (`string`): helper text shown below control content.
|
|
90
|
-
- `required` (`boolean`, default `false`): shows required indicator.
|
|
91
|
-
- `disabled` (`boolean`, default `false`): applies disabled label styling.
|
|
92
|
-
- `children` (`(props: FieldRenderProps) => ReactNode`, required): render function with generated ids + validation state.
|
|
93
|
-
- `className` (`string`): additional CSS class.
|
|
94
|
-
- `style` (`CSSProperties`): inline style / CSS variable overrides.
|
|
95
|
-
|
|
96
|
-
### `Dialog`
|
|
97
|
-
|
|
98
|
-
Accessible modal dialog primitive for confirmation and settings flows.
|
|
99
|
-
|
|
100
|
-
Recommended usage: pair it with a trigger button and controlled `open` state.
|
|
101
|
-
|
|
102
|
-
- `open` (`boolean`, required): controls visibility.
|
|
103
|
-
- `title` (`string`, required): dialog heading used as accessible name.
|
|
104
|
-
- `children` (`ReactNode`): body content.
|
|
105
|
-
- `description` (`string`): optional secondary description text.
|
|
106
|
-
- `onOpenChange` (`(open: boolean) => void`): state change callback for close actions.
|
|
107
|
-
- `closeOnEscape` (`boolean`, default `true`): close when Escape is pressed.
|
|
108
|
-
- `closeOnOverlayClick` (`boolean`, default `true`): close when backdrop is clicked.
|
|
109
|
-
- `closeLabel` (`string`, default `'Close dialog'`): accessible label for close button.
|
|
110
|
-
- `className` / `style`: overlay/dialog root customization.
|
|
111
|
-
- `contentClassName` / `contentStyle`: dialog panel customization.
|
|
112
|
-
|
|
113
|
-
### `DropdownMenu`
|
|
114
|
-
|
|
115
|
-
Trigger-based menu for compact actions.
|
|
116
|
-
|
|
117
|
-
- `trigger` (`ReactElement`, required): trigger control.
|
|
118
|
-
- `items` (`ReadonlyArray<DropdownMenuItem>`, required): menu options.
|
|
119
|
-
- `onSelect` (`(value: string) => void`): item selection callback.
|
|
120
|
-
- `open` / `defaultOpen` / `onOpenChange`: controlled/uncontrolled state.
|
|
121
|
-
- `placement` (`'top' | 'right' | 'bottom' | 'left'`, default `'bottom'`): menu placement.
|
|
122
|
-
- `closeOnEscape` (`boolean`, default `true`): close with Escape key.
|
|
123
|
-
- `closeOnOutsideClick` (`boolean`, default `true`): outside click dismiss.
|
|
124
|
-
|
|
125
|
-
### `Icons`
|
|
126
|
-
|
|
127
|
-
Shared SVG icon primitives used by Frey UI components.
|
|
128
|
-
|
|
129
|
-
- `CloseIcon`, `ChevronDownIcon`, `CheckIcon`, `MinusIcon`
|
|
130
|
-
- `CircleXIcon`, `CircleCheckIcon`, `TriangleAlertIcon`, `CircleInfoIcon`
|
|
131
|
-
|
|
132
|
-
Both icons support:
|
|
133
|
-
|
|
134
|
-
- `size` (`'xs' | 'sm' | 'md' | 'lg' | 'xl' | number`, default `'md'`): icon size token or numeric override.
|
|
135
|
-
- `strokeWidth` (`'thin' | 'regular' | 'bold' | number`, default `'regular'`): stroke token or numeric override.
|
|
136
|
-
- `title` (`string`): accessible name when you want semantic/icon-only meaning.
|
|
137
|
-
- `className` / `style`: visual customization.
|
|
138
|
-
|
|
139
|
-
### `Popover`
|
|
140
|
-
|
|
141
|
-
Non-modal floating surface anchored to a trigger.
|
|
142
|
-
|
|
143
|
-
- `trigger` (`ReactElement`, required): trigger control.
|
|
144
|
-
- `children` (`ReactNode`, required): popover content.
|
|
145
|
-
- `open` / `defaultOpen` / `onOpenChange`: controlled/uncontrolled state.
|
|
146
|
-
- `placement` (`'top' | 'right' | 'bottom' | 'left'`, default `'bottom'`): popover placement.
|
|
147
|
-
- `closeOnEscape` (`boolean`, default `true`) and `closeOnOutsideClick` (`boolean`, default `true`).
|
|
148
|
-
|
|
149
|
-
### `Progress`
|
|
150
|
-
|
|
151
|
-
Progress indicator for determinate or indeterminate loading.
|
|
152
|
-
|
|
153
|
-
- `value` (`number`, default `0`) and `max` (`number`, default `100`).
|
|
154
|
-
- `indeterminate` (`boolean`, default `false`): animated loading state.
|
|
155
|
-
- `label` (`string`): accessible and visible label.
|
|
156
|
-
- `showValue` (`boolean`, default `false`): show percentage text.
|
|
157
|
-
- `size` (`'sm' | 'md' | 'lg'`, default `'md'`).
|
|
158
|
-
|
|
159
|
-
### `Spinner`
|
|
160
|
-
|
|
161
|
-
Compact busy indicator for short background operations.
|
|
162
|
-
|
|
163
|
-
- `size` (`'sm' | 'md' | 'lg' | number`, default `'md'`).
|
|
164
|
-
- `label` (`string`, default `'Loading'`): status label for assistive tech.
|
|
165
|
-
- `className` / `style`: visual overrides.
|
|
166
|
-
|
|
167
|
-
### `ToastProvider` + `useToast`
|
|
168
|
-
|
|
169
|
-
Imperative notification system for transient messages.
|
|
170
|
-
|
|
171
|
-
- Wrap app sections with `ToastProvider`.
|
|
172
|
-
- Use `useToast()` to access:
|
|
173
|
-
- `toast(options)`
|
|
174
|
-
- `dismiss(id)`
|
|
175
|
-
- `dismissAll()`
|
|
176
|
-
|
|
177
|
-
`ToastProvider` props:
|
|
178
|
-
|
|
179
|
-
- `placement` (`'top-right' | 'top-left' | 'bottom-right' | 'bottom-left'`, default `'top-right'`)
|
|
180
|
-
- `limit` (`number`, default `4`)
|
|
181
|
-
|
|
182
|
-
`toast(options)` supports:
|
|
183
|
-
|
|
184
|
-
- `title`, `description` (required), `variant`, `duration`, and optional action button.
|
|
185
|
-
|
|
186
|
-
### `Tooltip`
|
|
187
|
-
|
|
188
|
-
Accessible hint text on hover/focus.
|
|
189
|
-
|
|
190
|
-
- `children` (`ReactElement`, required): trigger element.
|
|
191
|
-
- `content` (`ReactNode`, required): tooltip text/content.
|
|
192
|
-
- `open` / `defaultOpen` / `onOpenChange`: controlled/uncontrolled state.
|
|
193
|
-
- `placement` (`'top' | 'right' | 'bottom' | 'left'`, default `'top'`).
|
|
194
|
-
- `delay` (`number`, default `120` ms): show delay on hover/focus.
|
|
195
|
-
|
|
196
|
-
### `RadioGroup`
|
|
197
|
-
|
|
198
|
-
Accessible grouped radios with controlled and uncontrolled support.
|
|
199
|
-
|
|
200
|
-
- `label` (`string`, required): group label text.
|
|
201
|
-
- `options` (`ReadonlyArray<RadioOption>`, required): radio options.
|
|
202
|
-
- `value` (`string`): controlled selected value.
|
|
203
|
-
- `defaultValue` (`string`): initial value for uncontrolled usage.
|
|
204
|
-
- `onChange` (`ChangeEventHandler<HTMLInputElement>`): native change handler.
|
|
205
|
-
- `orientation` (`'vertical' | 'horizontal'`, default `'vertical'`): options layout direction.
|
|
206
|
-
- `error` (`string`): error text for validation state.
|
|
207
|
-
- `helperText` (`string`): helper text below group.
|
|
208
|
-
- `disabled` (`boolean`, default `false`): disables all options.
|
|
209
|
-
|
|
210
|
-
### `Select`
|
|
211
|
-
|
|
212
|
-
Accessible native `<select>` with helper/error messages and size variants.
|
|
213
|
-
|
|
214
|
-
- `label` (`string`, required): accessible label text.
|
|
215
|
-
- `placeholder` (`string`): placeholder option for single-select usage.
|
|
216
|
-
- `size` (`'sm' | 'md' | 'lg'`, default `'md'`): visual size variant.
|
|
217
|
-
- `error` (`string`): error text and invalid state.
|
|
218
|
-
- `helperText` (`string`): helper text below control.
|
|
219
|
-
- `children` (`ReactNode`): `<option>` / `<optgroup>` content.
|
|
220
|
-
- `disabled` (`boolean`, default `false`): disables the control.
|
|
221
|
-
|
|
222
|
-
### `Textarea`
|
|
223
|
-
|
|
224
|
-
Accessible multiline text input with helper/error messaging.
|
|
225
|
-
|
|
226
|
-
- `label` (`string`, required): accessible label text.
|
|
227
|
-
- `resize` (`'none' | 'vertical' | 'horizontal' | 'both'`, default `'vertical'`): resize behavior.
|
|
228
|
-
- `error` (`string`): error text and invalid state.
|
|
229
|
-
- `helperText` (`string`): helper text below control.
|
|
230
|
-
- `disabled` (`boolean`, default `false`): disables the textarea.
|
|
231
|
-
- `className` (`string`): additional CSS class.
|
|
232
|
-
- `style` (`CSSProperties`): inline style / CSS variable overrides.
|
|
233
|
-
|
|
234
|
-
### `Alert`
|
|
235
|
-
|
|
236
|
-
Inline status and feedback messaging.
|
|
237
|
-
|
|
238
|
-
| Prop | Type | Default | Description |
|
|
239
|
-
| ----------- | ---------------------------------------------- | -------- | ------------------------------------------------ |
|
|
240
|
-
| `variant` | `'error' \| 'success' \| 'warning' \| 'info'` | `'info'` | Visual style and live-region semantics. |
|
|
241
|
-
| `title` | `string` | — | Optional short heading rendered above the body. |
|
|
242
|
-
| `children` | `ReactNode` | — | **Required.** Main alert message content. |
|
|
243
|
-
| `className` | `string` | — | Additional CSS class. |
|
|
244
|
-
| `style` | `CSSProperties` | — | Inline styles / CSS variable overrides. |
|
|
245
|
-
|
|
246
|
-
### `Button`
|
|
247
|
-
|
|
248
|
-
Polymorphic action control with loading and disabled states.
|
|
249
|
-
|
|
250
|
-
| Prop | Type | Default | Description |
|
|
251
|
-
| ----------- | ------------------------------------------------------ | ----------- | --------------------------------------------------------------------------------------- |
|
|
252
|
-
| `as` | `'button' \| 'a'` | `'button'` | HTML element to render. |
|
|
253
|
-
| `variant` | `'primary' \| 'secondary' \| 'ghost' \| 'destructive'` | `'primary'` | Visual style variant. |
|
|
254
|
-
| `size` | `'sm' \| 'md' \| 'lg'` | `'md'` | Size variant. |
|
|
255
|
-
| `loading` | `boolean` | `false` | Shows spinner and marks element as busy. |
|
|
256
|
-
| `disabled` | `boolean` | `false` | Disables native buttons; for anchors sets `aria-disabled`. |
|
|
257
|
-
| `className` | `string` | — | Additional CSS class. |
|
|
258
|
-
| `style` | `CSSProperties` | — | Inline styles / CSS variable overrides. |
|
|
259
|
-
| `ref` | `Ref<HTMLButtonElement \| HTMLAnchorElement>` | — | Forwarded ref to the underlying element. |
|
|
260
|
-
|
|
261
|
-
Component-specific native attributes are supported based on `as` (`button` or `a`).
|
|
262
|
-
|
|
263
|
-
### `Checkbox`
|
|
264
|
-
|
|
265
|
-
Accessible checkbox with optional indeterminate state.
|
|
266
|
-
|
|
267
|
-
| Prop | Type | Default | Description |
|
|
268
|
-
| --------------- | -------------------------------------- | ------- | --------------------------------------------------------------- |
|
|
269
|
-
| `label` | `string` | — | **Required.** Accessible label text. |
|
|
270
|
-
| `hideLabel` | `boolean` | `false` | Visually hide the label (remains accessible to screen readers). |
|
|
271
|
-
| `size` | `'sm' \| 'md' \| 'lg'` | `'md'` | Size variant. |
|
|
272
|
-
| `indeterminate` | `boolean` | `false` | Shows mixed state and sets `aria-checked="mixed"`. |
|
|
273
|
-
| `disabled` | `boolean` | `false` | Disables the checkbox. |
|
|
274
|
-
| `className` | `string` | — | Additional CSS class. |
|
|
275
|
-
| `style` | `CSSProperties` | — | Inline styles / CSS variable overrides. |
|
|
276
|
-
| `ref` | `Ref<HTMLInputElement>` | — | Forwarded ref to the native input. |
|
|
277
|
-
|
|
278
|
-
All standard `<input>` attributes (except `type`, `size`) are also supported and spread onto the underlying element.
|
|
279
|
-
|
|
280
|
-
### `Chip`
|
|
281
|
-
|
|
282
|
-
A polymorphic label / action component.
|
|
283
|
-
|
|
284
|
-
| Prop | Type | Default | Description |
|
|
285
|
-
| ----------- | ------------------------------------ | --------------------------------------------------- | ------------------------------------------------------------------------ |
|
|
286
|
-
| `label` | `string` | — | **Required.** Text content of the chip. |
|
|
287
|
-
| `variant` | `'default' \| 'outlined'` | `'default'` | Visual style variant. |
|
|
288
|
-
| `as` | `'button' \| 'div' \| 'span' \| 'a'` | `'span'` (or `'button'` when `onClick` is provided) | HTML element to render. |
|
|
289
|
-
| `onClick` | `MouseEventHandler` | — | Click handler. When provided, the chip renders as a `button` by default. |
|
|
290
|
-
| `className` | `string` | — | Additional CSS class. |
|
|
291
|
-
| `style` | `CSSProperties` | — | Inline styles / CSS variable overrides. |
|
|
292
|
-
| `ref` | `Ref` | — | Forwarded ref to the underlying element. |
|
|
293
|
-
|
|
294
|
-
Non-native interactive chips (`as="div"` with `onClick`) automatically receive `role="button"`, `tabIndex={0}`, and keyboard support (Enter / Space).
|
|
295
|
-
|
|
296
|
-
### `Skeleton`
|
|
297
|
-
|
|
298
|
-
Loading placeholder for pending UI states.
|
|
299
|
-
|
|
300
|
-
| Prop | Type | Default | Description |
|
|
301
|
-
| ----------- | ------------------------------- | ------------- | ------------------------------------------------------- |
|
|
302
|
-
| `width` | `string \| number` | — | Placeholder width (for circles, can infer from height). |
|
|
303
|
-
| `height` | `string \| number` | — | Placeholder height (for circles, can infer from width). |
|
|
304
|
-
| `shape` | `'rectangle' \| 'circle'` | `'rectangle'` | Skeleton shape. |
|
|
305
|
-
| `className` | `string` | — | Additional CSS class. |
|
|
306
|
-
| `style` | `CSSProperties` | — | Inline styles / CSS variable overrides. |
|
|
307
|
-
|
|
308
|
-
### `Switch`
|
|
309
|
-
|
|
310
|
-
An accessible toggle switch built on a native `<input type="checkbox" role="switch">`.
|
|
311
|
-
|
|
312
|
-
| Prop | Type | Default | Description |
|
|
313
|
-
| ---------------- | -------------------------------------- | ------- | --------------------------------------------------------------- |
|
|
314
|
-
| `label` | `string` | — | **Required.** Accessible label text. |
|
|
315
|
-
| `hideLabel` | `boolean` | `false` | Visually hide the label (remains accessible to screen readers). |
|
|
316
|
-
| `size` | `'sm' \| 'md' \| 'lg'` | `'md'` | Size variant. |
|
|
317
|
-
| `checked` | `boolean` | — | Controlled checked state. |
|
|
318
|
-
| `defaultChecked` | `boolean` | — | Initial checked state (uncontrolled). |
|
|
319
|
-
| `disabled` | `boolean` | `false` | Disables the switch. |
|
|
320
|
-
| `onChange` | `ChangeEventHandler<HTMLInputElement>` | — | Change handler. |
|
|
321
|
-
| `className` | `string` | — | Additional CSS class. |
|
|
322
|
-
| `style` | `CSSProperties` | — | Inline styles / CSS variable overrides. |
|
|
323
|
-
| `ref` | `Ref<HTMLInputElement>` | — | Forwarded ref to the native input. |
|
|
324
|
-
|
|
325
|
-
All standard `<input>` attributes (except `type`, `size`) are also supported and spread onto the underlying element.
|
|
326
|
-
|
|
327
|
-
### `TextInput`
|
|
328
|
-
|
|
329
|
-
Accessible text field with helper and error messaging.
|
|
330
|
-
|
|
331
|
-
| Prop | Type | Default | Description |
|
|
332
|
-
| ------------ | ----------------------------------------------------------------------- | -------- | --------------------------------------------------------------- |
|
|
333
|
-
| `label` | `string` | — | **Required.** Accessible label text. |
|
|
334
|
-
| `hideLabel` | `boolean` | `false` | Visually hide the label (remains accessible to screen readers). |
|
|
335
|
-
| `type` | `'text' \| 'email' \| 'password' \| 'search' \| 'tel' \| 'url'` | `'text'` | Input type. |
|
|
336
|
-
| `error` | `string` | — | Error message text; sets `aria-invalid` and `role="alert"`. |
|
|
337
|
-
| `helperText` | `string` | — | Helper text shown below the input. |
|
|
338
|
-
| `disabled` | `boolean` | `false` | Disables the input. |
|
|
339
|
-
| `className` | `string` | — | Additional CSS class. |
|
|
340
|
-
| `style` | `CSSProperties` | — | Inline styles / CSS variable overrides. |
|
|
341
|
-
| `ref` | `Ref<HTMLInputElement>` | — | Forwarded ref to the native input. |
|
|
342
|
-
|
|
343
|
-
All standard `<input>` attributes (except `type`) are also supported and spread onto the underlying element.
|
|
344
|
-
|
|
345
|
-
### `ThemeProvider`
|
|
346
|
-
|
|
347
|
-
Wraps children with theme CSS variables and controls semantic token mapping.
|
|
348
|
-
|
|
349
|
-
| Prop | Type | Default | Description |
|
|
350
|
-
| -------------- | ------------------------------ | --------- | ----------------------------------------------------- |
|
|
351
|
-
| `children` | `ReactNode` | — | **Required.** Child content. |
|
|
352
|
-
| `theme` | `'light' \| 'dark' \| 'system'`| `'light'` | Active theme. `'system'` follows OS preferences. |
|
|
353
|
-
| `highContrast` | `boolean` | `false` | Enables high-contrast mode for better accessibility. |
|
|
354
|
-
| `id` | `string` | — | Container id. |
|
|
355
|
-
| `className` | `string` | — | Additional CSS class. |
|
|
356
|
-
| `style` | `CSSProperties` | — | Inline styles. |
|
|
357
|
-
|
|
358
|
-
## Theming
|
|
359
|
-
|
|
360
|
-
Override component visuals with CSS custom properties on any ancestor:
|
|
361
|
-
|
|
362
|
-
```css
|
|
363
|
-
.my-switch {
|
|
364
|
-
--switch-track-active: #22c55e;
|
|
365
|
-
--switch-track-inactive: #94a3b8;
|
|
366
|
-
--switch-focus-ring: #22c55e;
|
|
367
|
-
}
|
|
368
|
-
```
|
|
65
|
+
## Component API Docs
|
|
369
66
|
|
|
370
|
-
|
|
67
|
+
Storybook is the source of truth for component API docs and usage examples.
|
|
371
68
|
|
|
372
|
-
|
|
69
|
+
- Hosted docs: [BlizzardBlast.github.io/frey-ui](https://BlizzardBlast.github.io/frey-ui)
|
|
70
|
+
- Local docs:
|
|
373
71
|
|
|
374
72
|
```bash
|
|
375
73
|
pnpm install
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
'use strict';
|
|
3
|
+
|
|
4
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
5
|
+
|
|
6
|
+
var styles = {"accordion":"accordion-module_accordion__AORof","accordion_item":"accordion-module_accordion_item__45nmM","accordion_header":"accordion-module_accordion_header__zEieN","accordion_trigger":"accordion-module_accordion_trigger__6Mbf8","accordion_chevron":"accordion-module_accordion_chevron__rMna-","accordion_chevron_open":"accordion-module_accordion_chevron_open__wQtp8","accordion_content_wrapper":"accordion-module_accordion_content_wrapper__QpRcb","accordion_content_wrapper_open":"accordion-module_accordion_content_wrapper_open__FWN9R","accordion_content":"accordion-module_accordion_content__1WN6n"};
|
|
7
|
+
|
|
8
|
+
exports.default = styles;
|
|
9
|
+
//# sourceMappingURL=accordion.module.css.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"accordion.module.css.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;"}
|
|
@@ -0,0 +1,99 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
'use strict';
|
|
3
|
+
|
|
4
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
5
|
+
|
|
6
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
7
|
+
var clsx = require('clsx');
|
|
8
|
+
var React = require('react');
|
|
9
|
+
var index = require('../Icons/index.cjs');
|
|
10
|
+
var accordion_module = require('./accordion.module.css.cjs');
|
|
11
|
+
|
|
12
|
+
const AccordionContext = React.createContext(null);
|
|
13
|
+
function useAccordionContext() {
|
|
14
|
+
const context = React.useContext(AccordionContext);
|
|
15
|
+
if (!context) {
|
|
16
|
+
throw new Error('Accordion components must be wrapped in <Accordion>');
|
|
17
|
+
}
|
|
18
|
+
return context;
|
|
19
|
+
}
|
|
20
|
+
const AccordionItemContext = React.createContext(null);
|
|
21
|
+
function useAccordionItemContext() {
|
|
22
|
+
const context = React.useContext(AccordionItemContext);
|
|
23
|
+
if (!context) {
|
|
24
|
+
throw new Error('Accordion.Item parts must be wrapped in <Accordion.Item>');
|
|
25
|
+
}
|
|
26
|
+
return context;
|
|
27
|
+
}
|
|
28
|
+
const AccordionRoot = React.forwardRef(function Accordion({ type = 'single', value, defaultValue, onValueChange, className, ...props }, ref) {
|
|
29
|
+
const defaultVal = defaultValue ?? (type === 'multiple' ? [] : '');
|
|
30
|
+
const isControlled = value !== undefined;
|
|
31
|
+
const [uncontrolledValue, setUncontrolledValue] = React.useState(defaultVal);
|
|
32
|
+
const currentValue = isControlled ? value : uncontrolledValue;
|
|
33
|
+
const idPrefix = React.useId();
|
|
34
|
+
const handleValueChange = React.useCallback((nextValue) => {
|
|
35
|
+
let resolvedValue = nextValue;
|
|
36
|
+
if (type === 'single') {
|
|
37
|
+
const valueAsStr = typeof currentValue === 'string' ? currentValue : '';
|
|
38
|
+
resolvedValue = valueAsStr === nextValue ? '' : nextValue;
|
|
39
|
+
if (!isControlled) {
|
|
40
|
+
setUncontrolledValue(resolvedValue);
|
|
41
|
+
}
|
|
42
|
+
}
|
|
43
|
+
else {
|
|
44
|
+
const valueAsArray = Array.isArray(currentValue) ? currentValue : [];
|
|
45
|
+
const isSelected = valueAsArray.includes(nextValue);
|
|
46
|
+
const nextArrayValue = isSelected
|
|
47
|
+
? valueAsArray.filter((v) => v !== nextValue)
|
|
48
|
+
: [...valueAsArray, nextValue];
|
|
49
|
+
if (!isControlled) {
|
|
50
|
+
setUncontrolledValue(nextArrayValue);
|
|
51
|
+
}
|
|
52
|
+
resolvedValue = nextArrayValue;
|
|
53
|
+
}
|
|
54
|
+
onValueChange?.(resolvedValue);
|
|
55
|
+
}, [type, currentValue, isControlled, onValueChange]);
|
|
56
|
+
const contextValue = React.useMemo(() => ({
|
|
57
|
+
type,
|
|
58
|
+
value: currentValue,
|
|
59
|
+
onValueChange: handleValueChange,
|
|
60
|
+
idPrefix
|
|
61
|
+
}), [type, currentValue, handleValueChange, idPrefix]);
|
|
62
|
+
return (jsxRuntime.jsx(AccordionContext.Provider, { value: contextValue, children: jsxRuntime.jsx("div", { ref: ref, className: clsx(accordion_module.default.accordion, className), ...props }) }));
|
|
63
|
+
});
|
|
64
|
+
AccordionRoot.displayName = 'Accordion';
|
|
65
|
+
const AccordionItem = React.forwardRef(function AccordionItem({ value, className, ...props }, ref) {
|
|
66
|
+
const { value: accordionValue } = useAccordionContext();
|
|
67
|
+
// Check if this particular item is open based on context's active value
|
|
68
|
+
const isOpen = Array.isArray(accordionValue)
|
|
69
|
+
? accordionValue.includes(value)
|
|
70
|
+
: accordionValue === value;
|
|
71
|
+
const contextValue = React.useMemo(() => ({ value, isOpen }), [value, isOpen]);
|
|
72
|
+
return (jsxRuntime.jsx(AccordionItemContext.Provider, { value: contextValue, children: jsxRuntime.jsx("div", { ref: ref, className: clsx(accordion_module.default.accordion_item, className), ...props }) }));
|
|
73
|
+
});
|
|
74
|
+
AccordionItem.displayName = 'Accordion.Item';
|
|
75
|
+
const AccordionTrigger = React.forwardRef(function AccordionTrigger({ className, children, ...props }, ref) {
|
|
76
|
+
const { onValueChange, idPrefix } = useAccordionContext();
|
|
77
|
+
const { value, isOpen } = useAccordionItemContext();
|
|
78
|
+
return (jsxRuntime.jsx("div", { className: accordion_module.default.accordion_header, children: jsxRuntime.jsxs("button", { ref: ref, type: 'button', id: `${idPrefix}-trigger-${value}`, "aria-controls": `${idPrefix}-content-${value}`, "aria-expanded": isOpen, onClick: () => onValueChange(value), className: clsx(accordion_module.default.accordion_trigger, className), ...props, children: [children, jsxRuntime.jsx(index.ChevronDownIcon, { className: clsx(accordion_module.default.accordion_chevron, {
|
|
79
|
+
[accordion_module.default.accordion_chevron_open]: isOpen
|
|
80
|
+
}), size: 16 })] }) }));
|
|
81
|
+
});
|
|
82
|
+
AccordionTrigger.displayName = 'Accordion.Trigger';
|
|
83
|
+
const AccordionContent = React.forwardRef(function AccordionContent({ className, children, ...props }, ref) {
|
|
84
|
+
const { idPrefix } = useAccordionContext();
|
|
85
|
+
const { value, isOpen } = useAccordionItemContext();
|
|
86
|
+
return (jsxRuntime.jsx("section", { ref: ref, id: `${idPrefix}-content-${value}`, "aria-labelledby": `${idPrefix}-trigger-${value}`, className: clsx(accordion_module.default.accordion_content_wrapper, {
|
|
87
|
+
[accordion_module.default.accordion_content_wrapper_open]: isOpen
|
|
88
|
+
}), ...props, children: jsxRuntime.jsx("div", { className: clsx(accordion_module.default.accordion_content, className), children: children }) }));
|
|
89
|
+
});
|
|
90
|
+
AccordionContent.displayName = 'Accordion.Content';
|
|
91
|
+
const Accordion = Object.assign(AccordionRoot, {
|
|
92
|
+
Item: AccordionItem,
|
|
93
|
+
Trigger: AccordionTrigger,
|
|
94
|
+
Content: AccordionContent
|
|
95
|
+
});
|
|
96
|
+
|
|
97
|
+
exports.Accordion = Accordion;
|
|
98
|
+
exports.default = Accordion;
|
|
99
|
+
//# sourceMappingURL=index.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.cjs","sources":["../../../src/Accordion/index.tsx"],"sourcesContent":[null],"names":["createContext","useContext","useState","useId","_jsx","styles","_jsxs","ChevronDownIcon"],"mappings":"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"}
|
|
@@ -6,4 +6,4 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
6
6
|
var styles = {"alert":"alert-module_alert__j-fLL","alert-error":"alert-module_alert-error__U8yC8","alert-success":"alert-module_alert-success__FYP1Q","alert-warning":"alert-module_alert-warning__tuLWQ","alert-info":"alert-module_alert-info__d2xVj","alert-icon":"alert-module_alert-icon__j-8MC","alert_icon_svg":"alert-module_alert_icon_svg__EBN75","alert-content":"alert-module_alert-content__PUQPc","alert-title":"alert-module_alert-title__3yZS1","alert-message":"alert-module_alert-message__0AJ04"};
|
|
7
7
|
|
|
8
8
|
exports.default = styles;
|
|
9
|
-
//# sourceMappingURL=alert.module.css.
|
|
9
|
+
//# sourceMappingURL=alert.module.css.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"alert.module.css.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;"}
|
|
@@ -6,8 +6,8 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
6
6
|
var jsxRuntime = require('react/jsx-runtime');
|
|
7
7
|
var clsx = require('clsx');
|
|
8
8
|
var React = require('react');
|
|
9
|
-
var index = require('../Icons/index.
|
|
10
|
-
var alert_module = require('./alert.module.css.
|
|
9
|
+
var index = require('../Icons/index.cjs');
|
|
10
|
+
var alert_module = require('./alert.module.css.cjs');
|
|
11
11
|
|
|
12
12
|
const VariantClassMap = {
|
|
13
13
|
error: alert_module.default['alert-error'],
|
|
@@ -33,4 +33,4 @@ const Alert = React.forwardRef(function Alert({ variant = 'info', title, childre
|
|
|
33
33
|
Alert.displayName = 'Alert';
|
|
34
34
|
|
|
35
35
|
exports.default = Alert;
|
|
36
|
-
//# sourceMappingURL=index.
|
|
36
|
+
//# sourceMappingURL=index.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.cjs","sources":["../../../src/Alert/index.tsx"],"sourcesContent":[null],"names":["styles","_jsx","CircleXIcon","CircleCheckIcon","TriangleAlertIcon","CircleInfoIcon","_jsxs"],"mappings":";;;;;;;;;;;AAwBA,MAAM,eAAe,GAAiC;AACpD,IAAA,KAAK,EAAEA,oBAAM,CAAC,aAAa,CAAC;AAC5B,IAAA,OAAO,EAAEA,oBAAM,CAAC,eAAe,CAAC;AAChC,IAAA,OAAO,EAAEA,oBAAM,CAAC,eAAe,CAAC;AAChC,IAAA,IAAI,EAAEA,oBAAM,CAAC,YAAY;CAC1B;AAED,MAAM,cAAc,GAA6C;AAC/D,IAAA,KAAK,EAAE,OAAO;AACd,IAAA,OAAO,EAAE,OAAO;AAChB,IAAA,OAAO,EAAE,QAAQ;AACjB,IAAA,IAAI,EAAE;CACP;AAED,MAAM,KAAK,GAA0C;AACnD,IAAA,KAAK,GACHC,cAAA,CAACC,iBAAW,EAAA,EACV,IAAI,EAAC,IAAI,EACT,WAAW,EAAC,MAAM,EAClB,SAAS,EAAEF,oBAAM,CAAC,cAAc,GAChC,CACH;AACD,IAAA,OAAO,GACLC,cAAA,CAACE,qBAAe,EAAA,EACd,IAAI,EAAC,IAAI,EACT,WAAW,EAAC,MAAM,EAClB,SAAS,EAAEH,oBAAM,CAAC,cAAc,GAChC,CACH;AACD,IAAA,OAAO,GACLC,cAAA,CAACG,uBAAiB,EAAA,EAChB,IAAI,EAAC,IAAI,EACT,WAAW,EAAC,MAAM,EAClB,SAAS,EAAEJ,oBAAM,CAAC,cAAc,GAChC,CACH;AACD,IAAA,IAAI,GACFC,cAAA,CAACI,oBAAc,EAAA,EACb,IAAI,EAAC,IAAI,EACT,WAAW,EAAC,MAAM,EAClB,SAAS,EAAEL,oBAAM,CAAC,cAAc,GAChC;CAEL;AAED,MAAM,KAAK,GAAmB,KAAK,CAAC,UAAU,CAG5C,SAAS,KAAK,CAAC,EAAE,OAAO,GAAG,MAAM,EAAE,KAAK,EAAE,QAAQ,EAAE,SAAS,EAAE,KAAK,EAAE,EAAE,GAAG,EAAA;AAC3E,IAAA,QACEM,eAAA,CAAA,KAAA,EAAA,EACE,GAAG,EAAE,GAAG,EACR,IAAI,EAAE,cAAc,CAAC,OAAO,CAAC,EAC7B,SAAS,EAAE,IAAI,CAACN,oBAAM,CAAC,KAAK,EAAE,eAAe,CAAC,OAAO,CAAC,EAAE,SAAS,CAAC,EAClE,KAAK,EAAE,KAAK,EAAA,QAAA,EAAA,CAEZC,cAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAED,oBAAM,CAAC,YAAY,CAAC,EAAA,QAAA,EAAG,KAAK,CAAC,OAAO,CAAC,EAAA,CAAQ,EAC9DM,yBAAK,SAAS,EAAEN,oBAAM,CAAC,eAAe,CAAC,EAAA,QAAA,EAAA,CACpC,KAAK,IAAIC,cAAA,CAAA,GAAA,EAAA,EAAG,SAAS,EAAED,oBAAM,CAAC,aAAa,CAAC,EAAA,QAAA,EAAG,KAAK,GAAK,EAC1DC,cAAA,CAAA,GAAA,EAAA,EAAG,SAAS,EAAED,oBAAM,CAAC,eAAe,CAAC,EAAA,QAAA,EAAG,QAAQ,GAAK,CAAA,EAAA,CACjD,CAAA,EAAA,CACF;AAEV,CAAC;AAED,KAAK,CAAC,WAAW,GAAG,OAAO;;;;"}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
'use strict';
|
|
3
|
+
|
|
4
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
5
|
+
|
|
6
|
+
var styles = {"avatar":"avatar-module_avatar__I5DCB","avatar_sm":"avatar-module_avatar_sm__pJcLU","avatar_md":"avatar-module_avatar_md__IZwdq","avatar_lg":"avatar-module_avatar_lg__2v383","avatar_image":"avatar-module_avatar_image__a-ctN","avatar_fallback":"avatar-module_avatar_fallback__QlF5F","avatar_status_indicator":"avatar-module_avatar_status_indicator__v2V8V","avatar_status_online":"avatar-module_avatar_status_online__1IxYF","avatar_status_idle":"avatar-module_avatar_status_idle__VbZ3q","avatar_status_dnd":"avatar-module_avatar_status_dnd__0fZbP","avatar_status_offline":"avatar-module_avatar_status_offline__A4iJp"};
|
|
7
|
+
|
|
8
|
+
exports.default = styles;
|
|
9
|
+
//# sourceMappingURL=avatar.module.css.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"avatar.module.css.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;"}
|
|
@@ -0,0 +1,53 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
'use strict';
|
|
3
|
+
|
|
4
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
5
|
+
|
|
6
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
7
|
+
var clsx = require('clsx');
|
|
8
|
+
var React = require('react');
|
|
9
|
+
var avatar_module = require('./avatar.module.css.cjs');
|
|
10
|
+
|
|
11
|
+
const SizeClassMap = {
|
|
12
|
+
sm: avatar_module.default.avatar_sm,
|
|
13
|
+
md: avatar_module.default.avatar_md,
|
|
14
|
+
lg: avatar_module.default.avatar_lg
|
|
15
|
+
};
|
|
16
|
+
const StatusClassMap = {
|
|
17
|
+
online: avatar_module.default.avatar_status_online,
|
|
18
|
+
offline: avatar_module.default.avatar_status_offline,
|
|
19
|
+
idle: avatar_module.default.avatar_status_idle,
|
|
20
|
+
dnd: avatar_module.default.avatar_status_dnd
|
|
21
|
+
};
|
|
22
|
+
const useImageLoadingStatus = (src) => {
|
|
23
|
+
const [loadingStatus, setLoadingStatus] = React.useState('idle');
|
|
24
|
+
React.useEffect(() => {
|
|
25
|
+
if (!src) {
|
|
26
|
+
setLoadingStatus('error');
|
|
27
|
+
return;
|
|
28
|
+
}
|
|
29
|
+
let isMounted = true;
|
|
30
|
+
const image = new globalThis.Image();
|
|
31
|
+
const updateStatus = (status) => {
|
|
32
|
+
if (!isMounted)
|
|
33
|
+
return;
|
|
34
|
+
setLoadingStatus(status);
|
|
35
|
+
};
|
|
36
|
+
setLoadingStatus('loading');
|
|
37
|
+
image.onload = () => updateStatus('loaded');
|
|
38
|
+
image.onerror = () => updateStatus('error');
|
|
39
|
+
image.src = src;
|
|
40
|
+
return () => {
|
|
41
|
+
isMounted = false;
|
|
42
|
+
};
|
|
43
|
+
}, [src]);
|
|
44
|
+
return loadingStatus;
|
|
45
|
+
};
|
|
46
|
+
const Avatar = React.forwardRef(function Avatar({ src, alt, fallback, size = 'md', status, className, ...props }, ref) {
|
|
47
|
+
const imageLoadingStatus = useImageLoadingStatus(src);
|
|
48
|
+
return (jsxRuntime.jsxs("span", { ref: ref, className: clsx(avatar_module.default.avatar, SizeClassMap[size], className), ...props, children: [imageLoadingStatus === 'loaded' && src ? (jsxRuntime.jsx("img", { src: src, alt: alt, className: avatar_module.default.avatar_image })) : (jsxRuntime.jsx("span", { className: avatar_module.default.avatar_fallback, children: fallback })), status && (jsxRuntime.jsx("span", { className: clsx(avatar_module.default.avatar_status_indicator, StatusClassMap[status]), title: status }))] }));
|
|
49
|
+
});
|
|
50
|
+
Avatar.displayName = 'Avatar';
|
|
51
|
+
|
|
52
|
+
exports.default = Avatar;
|
|
53
|
+
//# sourceMappingURL=index.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.cjs","sources":["../../../src/Avatar/index.tsx"],"sourcesContent":[null],"names":["styles","useState","useEffect","_jsxs","_jsx"],"mappings":";;;;;;;;;;AAmBA,MAAM,YAAY,GAA+B;IAC/C,EAAE,EAAEA,qBAAM,CAAC,SAAS;IACpB,EAAE,EAAEA,qBAAM,CAAC,SAAS;IACpB,EAAE,EAAEA,qBAAM,CAAC;CACZ;AAED,MAAM,cAAc,GAAiC;IACnD,MAAM,EAAEA,qBAAM,CAAC,oBAAoB;IACnC,OAAO,EAAEA,qBAAM,CAAC,qBAAqB;IACrC,IAAI,EAAEA,qBAAM,CAAC,kBAAkB;IAC/B,GAAG,EAAEA,qBAAM,CAAC;CACb;AAED,MAAM,qBAAqB,GAAG,CAAC,GAAY,KAAI;IAC7C,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAGC,cAAQ,CAEhD,MAAM,CAAC;IAETC,eAAS,CAAC,MAAK;QACb,IAAI,CAAC,GAAG,EAAE;YACR,gBAAgB,CAAC,OAAO,CAAC;YACzB;QACF;QAEA,IAAI,SAAS,GAAG,IAAI;AACpB,QAAA,MAAM,KAAK,GAAG,IAAI,UAAU,CAAC,KAAK,EAAE;AAEpC,QAAA,MAAM,YAAY,GAAG,CAAC,MAA0B,KAAI;AAClD,YAAA,IAAI,CAAC,SAAS;gBAAE;YAChB,gBAAgB,CAAC,MAAM,CAAC;AAC1B,QAAA,CAAC;QAED,gBAAgB,CAAC,SAAS,CAAC;QAC3B,KAAK,CAAC,MAAM,GAAG,MAAM,YAAY,CAAC,QAAQ,CAAC;QAC3C,KAAK,CAAC,OAAO,GAAG,MAAM,YAAY,CAAC,OAAO,CAAC;AAC3C,QAAA,KAAK,CAAC,GAAG,GAAG,GAAG;AAEf,QAAA,OAAO,MAAK;YACV,SAAS,GAAG,KAAK;AACnB,QAAA,CAAC;AACH,IAAA,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC;AAET,IAAA,OAAO,aAAa;AACtB,CAAC;AAED,MAAM,MAAM,GAAoB,KAAK,CAAC,UAAU,CAG9C,SAAS,MAAM,CACf,EAAE,GAAG,EAAE,GAAG,EAAE,QAAQ,EAAE,IAAI,GAAG,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAChE,GAAG,EAAA;AAEH,IAAA,MAAM,kBAAkB,GAAG,qBAAqB,CAAC,GAAG,CAAC;AAErD,IAAA,QACEC,eAAA,CAAA,MAAA,EAAA,EACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAI,CAACH,qBAAM,CAAC,MAAM,EAAE,YAAY,CAAC,IAAI,CAAC,EAAE,SAAS,CAAC,EAAA,GACzD,KAAK,aAER,kBAAkB,KAAK,QAAQ,IAAI,GAAG,IACrCI,cAAA,CAAA,KAAA,EAAA,EAAK,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,SAAS,EAAEJ,qBAAM,CAAC,YAAY,EAAA,CAAI,KAE3DI,cAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAEJ,qBAAM,CAAC,eAAe,EAAA,QAAA,EAAG,QAAQ,GAAQ,CAC3D,EAEA,MAAM,KACLI,yBACE,SAAS,EAAE,IAAI,CACbJ,qBAAM,CAAC,uBAAuB,EAC9B,cAAc,CAAC,MAAM,CAAC,CACvB,EACD,KAAK,EAAE,MAAM,GACb,CACH,CAAA,EAAA,CACI;AAEX,CAAC;AAED,MAAM,CAAC,WAAW,GAAG,QAAQ;;;;"}
|
|
@@ -6,4 +6,4 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
6
6
|
var styles = {"button":"button-module_button__umKM2","button-sm":"button-module_button-sm__TiGU6","button-md":"button-module_button-md__J7V5e","button-lg":"button-module_button-lg__-SzwA","button-primary":"button-module_button-primary__v1Ube","button-secondary":"button-module_button-secondary__sWT9h","button-ghost":"button-module_button-ghost__s0pgs","button-destructive":"button-module_button-destructive__zxYP7","button-loading":"button-module_button-loading__-ye2x","spinner":"button-module_spinner__1Wrqa"};
|
|
7
7
|
|
|
8
8
|
exports.default = styles;
|
|
9
|
-
//# sourceMappingURL=button.module.css.
|
|
9
|
+
//# sourceMappingURL=button.module.css.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"button.module.css.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;"}
|