@salt-ds/core 1.8.2 → 1.9.1
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/dist-cjs/accordion/Accordion.js +1 -1
- package/dist-cjs/accordion/AccordionContext.js +1 -1
- package/dist-cjs/accordion/AccordionGroup.js +1 -1
- package/dist-cjs/accordion/AccordionGroup.js.map +1 -1
- package/dist-cjs/accordion/AccordionHeader.js +1 -1
- package/dist-cjs/accordion/AccordionHeader.js.map +1 -1
- package/dist-cjs/accordion/AccordionPanel.js +1 -1
- package/dist-cjs/accordion/AccordionPanel.js.map +1 -1
- package/dist-cjs/aria-announcer/useAriaAnnouncer.js +1 -1
- package/dist-cjs/avatar/Avatar.js +1 -1
- package/dist-cjs/avatar/useAvatarImage.js +1 -1
- package/dist-cjs/banner/Banner.js +1 -1
- package/dist-cjs/banner/BannerActions.js +17 -15
- package/dist-cjs/banner/BannerActions.js.map +1 -1
- package/dist-cjs/banner/BannerContent.js +17 -15
- package/dist-cjs/banner/BannerContent.js.map +1 -1
- package/dist-cjs/border-item/BorderItem.js +1 -1
- package/dist-cjs/border-item/BorderItem.js.map +1 -1
- package/dist-cjs/border-layout/BorderLayout.js +1 -1
- package/dist-cjs/button/Button.css.js +1 -1
- package/dist-cjs/button/Button.js +1 -1
- package/dist-cjs/button/Button.js.map +1 -1
- package/dist-cjs/card/Card.js +1 -1
- package/dist-cjs/card/InteractableCard.js +1 -1
- package/dist-cjs/checkbox/Checkbox.js +1 -1
- package/dist-cjs/checkbox/CheckboxGroup.js +1 -1
- package/dist-cjs/checkbox/CheckboxIcon.js +1 -1
- package/dist-cjs/flex-item/FlexItem.js +1 -1
- package/dist-cjs/flex-item/FlexItem.js.map +1 -1
- package/dist-cjs/flex-layout/FlexLayout.js +1 -1
- package/dist-cjs/flex-layout/FlexLayout.js.map +1 -1
- package/dist-cjs/form-field/FormField.css.js +1 -1
- package/dist-cjs/form-field/FormField.js +1 -1
- package/dist-cjs/form-field/FormFieldHelperText.js +1 -1
- package/dist-cjs/form-field/FormFieldLabel.js +1 -1
- package/dist-cjs/form-field-context/FormFieldContext.js +1 -1
- package/dist-cjs/grid-item/GridItem.js +1 -1
- package/dist-cjs/grid-item/GridItem.js.map +1 -1
- package/dist-cjs/grid-layout/GridLayout.js +1 -1
- package/dist-cjs/index.js +5 -1
- package/dist-cjs/index.js.map +1 -1
- package/dist-cjs/input/Input.js +1 -1
- package/dist-cjs/link/Link.js +1 -1
- package/dist-cjs/multiline-input/MultilineInput.js +1 -1
- package/dist-cjs/panel/Panel.js +1 -1
- package/dist-cjs/radio-button/RadioButton.js +1 -1
- package/dist-cjs/radio-button/RadioButtonGroup.js +1 -1
- package/dist-cjs/radio-button/RadioButtonIcon.js +1 -1
- package/dist-cjs/radio-button/internal/RadioGroupContext.js +1 -1
- package/dist-cjs/salt-provider/SaltProvider.js +1 -1
- package/dist-cjs/spinner/Spinner.js +1 -1
- package/dist-cjs/spinner/Spinner.js.map +1 -1
- package/dist-cjs/spinner/svgSpinners/SpinnerSVG.js +1 -1
- package/dist-cjs/stack-layout/StackLayout.js +1 -1
- package/dist-cjs/status-adornment/StatusAdornment.js +1 -1
- package/dist-cjs/status-indicator/StatusIndicator.js +1 -1
- package/dist-cjs/status-indicator/ValidationStatus.js.map +1 -1
- package/dist-cjs/text/Display.js +1 -1
- package/dist-cjs/text/Text.js +1 -1
- package/dist-cjs/theme/Density.js.map +1 -1
- package/dist-cjs/theme/Mode.js.map +1 -1
- package/dist-cjs/toast/Toast.js +1 -1
- package/dist-cjs/toast/ToastContent.js +1 -1
- package/dist-cjs/toast/ToastContent.js.map +1 -1
- package/dist-cjs/toggle-button/ToggleButton.js +1 -1
- package/dist-cjs/toggle-button-group/ToggleButtonGroup.js +1 -1
- package/dist-cjs/toggle-button-group/ToggleButtonGroupContext.js +1 -1
- package/dist-cjs/tooltip/Tooltip.js +19 -53
- package/dist-cjs/tooltip/Tooltip.js.map +1 -1
- package/dist-cjs/tooltip/TooltipBase.js +62 -0
- package/dist-cjs/tooltip/TooltipBase.js.map +1 -0
- package/dist-cjs/tooltip/useAriaAnnounce.js +1 -1
- package/dist-cjs/tooltip/useTooltip.js +16 -9
- package/dist-cjs/tooltip/useTooltip.js.map +1 -1
- package/dist-cjs/utils/useFloatingUI/useFloatingUI.js +124 -0
- package/dist-cjs/utils/useFloatingUI/useFloatingUI.js.map +1 -0
- package/dist-cjs/utils/useId.js +1 -1
- package/dist-cjs/utils/useId.js.map +1 -1
- package/dist-cjs/viewport/ViewportProvider.js +1 -1
- package/dist-es/accordion/Accordion.js +1 -1
- package/dist-es/accordion/AccordionContext.js +1 -1
- package/dist-es/accordion/AccordionGroup.js +1 -1
- package/dist-es/accordion/AccordionGroup.js.map +1 -1
- package/dist-es/accordion/AccordionHeader.js +1 -1
- package/dist-es/accordion/AccordionHeader.js.map +1 -1
- package/dist-es/accordion/AccordionPanel.js +1 -1
- package/dist-es/accordion/AccordionPanel.js.map +1 -1
- package/dist-es/aria-announcer/useAriaAnnouncer.js +1 -1
- package/dist-es/avatar/Avatar.js +1 -1
- package/dist-es/avatar/useAvatarImage.js +1 -1
- package/dist-es/banner/Banner.js +1 -1
- package/dist-es/banner/BannerActions.js +17 -15
- package/dist-es/banner/BannerActions.js.map +1 -1
- package/dist-es/banner/BannerContent.js +17 -15
- package/dist-es/banner/BannerContent.js.map +1 -1
- package/dist-es/border-item/BorderItem.js +1 -1
- package/dist-es/border-item/BorderItem.js.map +1 -1
- package/dist-es/border-layout/BorderLayout.js +1 -1
- package/dist-es/button/Button.css.js +1 -1
- package/dist-es/button/Button.js +1 -1
- package/dist-es/button/Button.js.map +1 -1
- package/dist-es/card/Card.js +1 -1
- package/dist-es/card/InteractableCard.js +1 -1
- package/dist-es/checkbox/Checkbox.js +1 -1
- package/dist-es/checkbox/CheckboxGroup.js +1 -1
- package/dist-es/checkbox/CheckboxIcon.js +1 -1
- package/dist-es/flex-item/FlexItem.js +1 -1
- package/dist-es/flex-item/FlexItem.js.map +1 -1
- package/dist-es/flex-layout/FlexLayout.js +1 -1
- package/dist-es/flex-layout/FlexLayout.js.map +1 -1
- package/dist-es/form-field/FormField.css.js +1 -1
- package/dist-es/form-field/FormField.js +1 -1
- package/dist-es/form-field/FormFieldHelperText.js +1 -1
- package/dist-es/form-field/FormFieldLabel.js +1 -1
- package/dist-es/form-field-context/FormFieldContext.js +1 -1
- package/dist-es/grid-item/GridItem.js +1 -1
- package/dist-es/grid-item/GridItem.js.map +1 -1
- package/dist-es/grid-layout/GridLayout.js +1 -1
- package/dist-es/index.js +1 -1
- package/dist-es/input/Input.js +1 -1
- package/dist-es/link/Link.js +1 -1
- package/dist-es/multiline-input/MultilineInput.js +1 -1
- package/dist-es/panel/Panel.js +1 -1
- package/dist-es/radio-button/RadioButton.js +1 -1
- package/dist-es/radio-button/RadioButtonGroup.js +1 -1
- package/dist-es/radio-button/RadioButtonIcon.js +1 -1
- package/dist-es/radio-button/internal/RadioGroupContext.js +1 -1
- package/dist-es/salt-provider/SaltProvider.js +1 -1
- package/dist-es/spinner/Spinner.js +1 -1
- package/dist-es/spinner/Spinner.js.map +1 -1
- package/dist-es/spinner/svgSpinners/SpinnerSVG.js +1 -1
- package/dist-es/stack-layout/StackLayout.js +1 -1
- package/dist-es/status-adornment/StatusAdornment.js +1 -1
- package/dist-es/status-indicator/StatusIndicator.js +1 -1
- package/dist-es/status-indicator/ValidationStatus.js.map +1 -1
- package/dist-es/text/Display.js +1 -1
- package/dist-es/text/Text.js +1 -1
- package/dist-es/theme/Density.js.map +1 -1
- package/dist-es/theme/Mode.js.map +1 -1
- package/dist-es/toast/Toast.js +1 -1
- package/dist-es/toast/ToastContent.js +1 -1
- package/dist-es/toast/ToastContent.js.map +1 -1
- package/dist-es/toggle-button/ToggleButton.js +1 -1
- package/dist-es/toggle-button-group/ToggleButtonGroup.js +1 -1
- package/dist-es/toggle-button-group/ToggleButtonGroupContext.js +1 -1
- package/dist-es/tooltip/Tooltip.js +19 -53
- package/dist-es/tooltip/Tooltip.js.map +1 -1
- package/dist-es/tooltip/TooltipBase.js +58 -0
- package/dist-es/tooltip/TooltipBase.js.map +1 -0
- package/dist-es/tooltip/useAriaAnnounce.js +1 -1
- package/dist-es/tooltip/useTooltip.js +16 -9
- package/dist-es/tooltip/useTooltip.js.map +1 -1
- package/dist-es/utils/useFloatingUI/useFloatingUI.js +115 -0
- package/dist-es/utils/useFloatingUI/useFloatingUI.js.map +1 -0
- package/dist-es/utils/useId.js +1 -1
- package/dist-es/utils/useId.js.map +1 -1
- package/dist-es/viewport/ViewportProvider.js +1 -1
- package/dist-types/accordion/AccordionGroup.d.ts +8 -3
- package/dist-types/accordion/AccordionHeader.d.ts +8 -3
- package/dist-types/accordion/AccordionPanel.d.ts +8 -3
- package/dist-types/aria-announcer/AriaAnnouncerContext.d.ts +0 -1
- package/dist-types/banner/BannerActions.d.ts +9 -2
- package/dist-types/banner/BannerContent.d.ts +9 -2
- package/dist-types/border-item/BorderItem.d.ts +1 -1
- package/dist-types/button/Button.d.ts +1 -1
- package/dist-types/checkbox/CheckboxIcon.d.ts +0 -1
- package/dist-types/checkbox/internal/CheckboxGroupContext.d.ts +0 -1
- package/dist-types/flex-item/FlexItem.d.ts +1 -1
- package/dist-types/flex-layout/FlexLayout.d.ts +2 -2
- package/dist-types/form-field/FormFieldHelperText.d.ts +0 -1
- package/dist-types/form-field/FormFieldLabel.d.ts +0 -1
- package/dist-types/form-field-context/FormFieldContext.d.ts +0 -1
- package/dist-types/grid-item/GridItem.d.ts +1 -1
- package/dist-types/spinner/Spinner.d.ts +1 -1
- package/dist-types/status-adornment/ErrorAdornment.d.ts +0 -1
- package/dist-types/status-adornment/StatusAdornment.d.ts +0 -1
- package/dist-types/status-adornment/SuccessAdornment.d.ts +0 -1
- package/dist-types/status-adornment/WarningAdornment.d.ts +0 -1
- package/dist-types/status-indicator/StatusIndicator.d.ts +0 -1
- package/dist-types/status-indicator/ValidationStatus.d.ts +1 -1
- package/dist-types/text/Display.d.ts +0 -1
- package/dist-types/text/Headings.d.ts +0 -1
- package/dist-types/text/Label.d.ts +0 -1
- package/dist-types/theme/Density.d.ts +1 -1
- package/dist-types/theme/Mode.d.ts +1 -1
- package/dist-types/toast/ToastContent.d.ts +8 -2
- package/dist-types/tooltip/TooltipBase.d.ts +12 -0
- package/dist-types/tooltip/useTooltip.d.ts +12 -5
- package/dist-types/utils/useFloatingUI/index.d.ts +1 -0
- package/dist-types/utils/useFloatingUI/useFloatingUI.d.ts +77 -0
- package/package.json +2 -2
- package/dist-cjs/utils/useFloatingUI.js +0 -38
- package/dist-cjs/utils/useFloatingUI.js.map +0 -1
- package/dist-es/utils/useFloatingUI.js +0 -33
- package/dist-es/utils/useFloatingUI.js.map +0 -1
- package/dist-types/utils/useFloatingUI.d.ts +0 -34
package/dist-es/button/Button.js
CHANGED
|
@@ -4,7 +4,7 @@ import { clsx } from 'clsx';
|
|
|
4
4
|
import { useComponentCssInjection } from '@salt-ds/styles';
|
|
5
5
|
import { useWindow } from '@salt-ds/window';
|
|
6
6
|
import { makePrefixer } from '../utils/makePrefixer.js';
|
|
7
|
-
import '../utils/useFloatingUI.js';
|
|
7
|
+
import '../utils/useFloatingUI/useFloatingUI.js';
|
|
8
8
|
import '../utils/useId.js';
|
|
9
9
|
import '../salt-provider/SaltProvider.js';
|
|
10
10
|
import '../viewport/ViewportProvider.js';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.js","sources":["../src/button/Button.tsx"],"sourcesContent":["import { ComponentPropsWithoutRef, forwardRef, ReactElement } from \"react\";\nimport { clsx } from \"clsx\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { makePrefixer } from \"../utils\";\n\nimport buttonCss from \"./Button.css\";\nimport { useButton } from \"./useButton\";\n\nconst withBaseName = makePrefixer(\"saltButton\");\n\nexport const ButtonVariantValues = [\"primary\", \"secondary\", \"cta\"] as const;\nexport type ButtonVariant = typeof ButtonVariantValues[number];\n\nexport interface ButtonProps extends ComponentPropsWithoutRef<\"button\"> {\n /**\n * If `true`, the button will be disabled.\n */\n disabled?: boolean;\n /**\n * If `true`, the button will be focusable when disabled.\n */\n focusableWhenDisabled?: boolean;\n /**\n * The variant to use. Options are 'primary', 'secondary' and 'cta'.\n * 'primary' is the default value.\n */\n variant?: ButtonVariant;\n}\n\nexport const Button = forwardRef<HTMLButtonElement, ButtonProps>(\n function Button(\n {\n children,\n className,\n disabled,\n focusableWhenDisabled,\n onKeyUp,\n onKeyDown,\n onBlur,\n onClick,\n type = \"button\",\n variant = \"primary\",\n ...restProps\n },\n ref?\n ): ReactElement<ButtonProps> {\n const { active, buttonProps } = useButton({\n disabled,\n focusableWhenDisabled,\n onKeyUp,\n onKeyDown,\n onBlur,\n onClick,\n });\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-button\",\n css: buttonCss,\n window: targetWindow,\n });\n\n // we do not want to spread tab index in this case because the button element\n // does not require tabindex=\"0\" attribute\n const { tabIndex, ...restButtonProps } = buttonProps;\n return (\n <button\n {...restButtonProps}\n className={clsx(\n withBaseName(),\n withBaseName(variant),\n {\n [withBaseName(\"disabled\")]: disabled,\n [withBaseName(\"active\")]: active,\n },\n className\n )}\n {...restProps}\n ref={ref}\n type={type}\n >\n {children}\n </button>\n );\n }\n);\n"],"names":["Button","buttonCss"],"mappings":";;;;;;;;;;;;;AASA,MAAM,YAAA,GAAe,aAAa,YAAY,CAAA,CAAA;AAEvC,MAAM,mBAAsB,GAAA,CAAC,SAAW,EAAA,WAAA,EAAa,KAAK,EAAA;AAmB1D,MAAM,MAAS,GAAA,UAAA;AAAA,EACpB,SAASA,OACP,CAAA;AAAA,IACE,QAAA;AAAA,IACA,SAAA;AAAA,IACA,QAAA;AAAA,IACA,qBAAA;AAAA,IACA,OAAA;AAAA,IACA,SAAA;AAAA,IACA,MAAA;AAAA,IACA,OAAA;AAAA,IACA,IAAO,GAAA,QAAA;AAAA,IACP,OAAU,GAAA,SAAA;AAAA,IACP,GAAA,SAAA;AAAA,KAEL,GAC2B,EAAA;AAC3B,IAAA,MAAM,EAAE,MAAA,EAAQ,WAAY,EAAA,GAAI,SAAU,CAAA;AAAA,MACxC,QAAA;AAAA,MACA,qBAAA;AAAA,MACA,OAAA;AAAA,MACA,SAAA;AAAA,MACA,MAAA;AAAA,MACA,OAAA;AAAA,KACD,CAAA,CAAA;AAED,IAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,aAAA;AAAA,MACR,GAAK,EAAAC,QAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAID,IAAM,MAAA,EAAE,QAAa,EAAA,GAAA,eAAA,EAAoB,GAAA,WAAA,CAAA;AACzC,IAAA,uBACG,GAAA,CAAA,QAAA,EAAA;AAAA,MACE,GAAG,eAAA;AAAA,MACJ,SAAW,EAAA,IAAA;AAAA,QACT,YAAa,EAAA;AAAA,QACb,aAAa,OAAO,CAAA;AAAA,QACpB;AAAA,UACE,CAAC,YAAa,CAAA,UAAU,CAAI,GAAA,QAAA;AAAA,UAC5B,CAAC,YAAa,CAAA,QAAQ,CAAI,GAAA,MAAA;AAAA,SAC5B;AAAA,QACA,SAAA;AAAA,OACF;AAAA,MACC,GAAG,SAAA;AAAA,MACJ,GAAA;AAAA,MACA,IAAA;AAAA,MAEC,QAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
|
|
1
|
+
{"version":3,"file":"Button.js","sources":["../src/button/Button.tsx"],"sourcesContent":["import { ComponentPropsWithoutRef, forwardRef, ReactElement } from \"react\";\nimport { clsx } from \"clsx\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { makePrefixer } from \"../utils\";\n\nimport buttonCss from \"./Button.css\";\nimport { useButton } from \"./useButton\";\n\nconst withBaseName = makePrefixer(\"saltButton\");\n\nexport const ButtonVariantValues = [\"primary\", \"secondary\", \"cta\"] as const;\nexport type ButtonVariant = (typeof ButtonVariantValues)[number];\n\nexport interface ButtonProps extends ComponentPropsWithoutRef<\"button\"> {\n /**\n * If `true`, the button will be disabled.\n */\n disabled?: boolean;\n /**\n * If `true`, the button will be focusable when disabled.\n */\n focusableWhenDisabled?: boolean;\n /**\n * The variant to use. Options are 'primary', 'secondary' and 'cta'.\n * 'primary' is the default value.\n */\n variant?: ButtonVariant;\n}\n\nexport const Button = forwardRef<HTMLButtonElement, ButtonProps>(\n function Button(\n {\n children,\n className,\n disabled,\n focusableWhenDisabled,\n onKeyUp,\n onKeyDown,\n onBlur,\n onClick,\n type = \"button\",\n variant = \"primary\",\n ...restProps\n },\n ref?\n ): ReactElement<ButtonProps> {\n const { active, buttonProps } = useButton({\n disabled,\n focusableWhenDisabled,\n onKeyUp,\n onKeyDown,\n onBlur,\n onClick,\n });\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-button\",\n css: buttonCss,\n window: targetWindow,\n });\n\n // we do not want to spread tab index in this case because the button element\n // does not require tabindex=\"0\" attribute\n const { tabIndex, ...restButtonProps } = buttonProps;\n return (\n <button\n {...restButtonProps}\n className={clsx(\n withBaseName(),\n withBaseName(variant),\n {\n [withBaseName(\"disabled\")]: disabled,\n [withBaseName(\"active\")]: active,\n },\n className\n )}\n {...restProps}\n ref={ref}\n type={type}\n >\n {children}\n </button>\n );\n }\n);\n"],"names":["Button","buttonCss"],"mappings":";;;;;;;;;;;;;AASA,MAAM,YAAA,GAAe,aAAa,YAAY,CAAA,CAAA;AAEvC,MAAM,mBAAsB,GAAA,CAAC,SAAW,EAAA,WAAA,EAAa,KAAK,EAAA;AAmB1D,MAAM,MAAS,GAAA,UAAA;AAAA,EACpB,SAASA,OACP,CAAA;AAAA,IACE,QAAA;AAAA,IACA,SAAA;AAAA,IACA,QAAA;AAAA,IACA,qBAAA;AAAA,IACA,OAAA;AAAA,IACA,SAAA;AAAA,IACA,MAAA;AAAA,IACA,OAAA;AAAA,IACA,IAAO,GAAA,QAAA;AAAA,IACP,OAAU,GAAA,SAAA;AAAA,IACP,GAAA,SAAA;AAAA,KAEL,GAC2B,EAAA;AAC3B,IAAA,MAAM,EAAE,MAAA,EAAQ,WAAY,EAAA,GAAI,SAAU,CAAA;AAAA,MACxC,QAAA;AAAA,MACA,qBAAA;AAAA,MACA,OAAA;AAAA,MACA,SAAA;AAAA,MACA,MAAA;AAAA,MACA,OAAA;AAAA,KACD,CAAA,CAAA;AAED,IAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,aAAA;AAAA,MACR,GAAK,EAAAC,QAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAID,IAAM,MAAA,EAAE,QAAa,EAAA,GAAA,eAAA,EAAoB,GAAA,WAAA,CAAA;AACzC,IAAA,uBACG,GAAA,CAAA,QAAA,EAAA;AAAA,MACE,GAAG,eAAA;AAAA,MACJ,SAAW,EAAA,IAAA;AAAA,QACT,YAAa,EAAA;AAAA,QACb,aAAa,OAAO,CAAA;AAAA,QACpB;AAAA,UACE,CAAC,YAAa,CAAA,UAAU,CAAI,GAAA,QAAA;AAAA,UAC5B,CAAC,YAAa,CAAA,QAAQ,CAAI,GAAA,MAAA;AAAA,SAC5B;AAAA,QACA,SAAA;AAAA,OACF;AAAA,MACC,GAAG,SAAA;AAAA,MACJ,GAAA;AAAA,MACA,IAAA;AAAA,MAEC,QAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
|
package/dist-es/card/Card.js
CHANGED
|
@@ -4,7 +4,7 @@ import { forwardRef } from 'react';
|
|
|
4
4
|
import { useWindow } from '@salt-ds/window';
|
|
5
5
|
import { useComponentCssInjection } from '@salt-ds/styles';
|
|
6
6
|
import { makePrefixer } from '../utils/makePrefixer.js';
|
|
7
|
-
import '../utils/useFloatingUI.js';
|
|
7
|
+
import '../utils/useFloatingUI/useFloatingUI.js';
|
|
8
8
|
import '../utils/useId.js';
|
|
9
9
|
import '../salt-provider/SaltProvider.js';
|
|
10
10
|
import '../viewport/ViewportProvider.js';
|
|
@@ -5,7 +5,7 @@ import { useWindow } from '@salt-ds/window';
|
|
|
5
5
|
import { useComponentCssInjection } from '@salt-ds/styles';
|
|
6
6
|
import { capitalize } from '../utils/capitalize.js';
|
|
7
7
|
import { makePrefixer } from '../utils/makePrefixer.js';
|
|
8
|
-
import '../utils/useFloatingUI.js';
|
|
8
|
+
import '../utils/useFloatingUI/useFloatingUI.js';
|
|
9
9
|
import '../utils/useId.js';
|
|
10
10
|
import '../salt-provider/SaltProvider.js';
|
|
11
11
|
import '../viewport/ViewportProvider.js';
|
|
@@ -5,7 +5,7 @@ import { useComponentCssInjection } from '@salt-ds/styles';
|
|
|
5
5
|
import { useWindow } from '@salt-ds/window';
|
|
6
6
|
import { makePrefixer } from '../utils/makePrefixer.js';
|
|
7
7
|
import { useControlled } from '../utils/useControlled.js';
|
|
8
|
-
import '../utils/useFloatingUI.js';
|
|
8
|
+
import '../utils/useFloatingUI/useFloatingUI.js';
|
|
9
9
|
import '../utils/useId.js';
|
|
10
10
|
import '../salt-provider/SaltProvider.js';
|
|
11
11
|
import '../viewport/ViewportProvider.js';
|
|
@@ -7,7 +7,7 @@ import '../form-field-context/FormFieldContext.js';
|
|
|
7
7
|
import { useFormFieldProps } from '../form-field-context/useFormFieldProps.js';
|
|
8
8
|
import { makePrefixer } from '../utils/makePrefixer.js';
|
|
9
9
|
import { useControlled } from '../utils/useControlled.js';
|
|
10
|
-
import '../utils/useFloatingUI.js';
|
|
10
|
+
import '../utils/useFloatingUI/useFloatingUI.js';
|
|
11
11
|
import '../utils/useId.js';
|
|
12
12
|
import '../salt-provider/SaltProvider.js';
|
|
13
13
|
import '../viewport/ViewportProvider.js';
|
|
@@ -5,7 +5,7 @@ import { useWindow } from '@salt-ds/window';
|
|
|
5
5
|
import { useDensity } from '../salt-provider/SaltProvider.js';
|
|
6
6
|
import 'react';
|
|
7
7
|
import { makePrefixer } from '../utils/makePrefixer.js';
|
|
8
|
-
import '../utils/useFloatingUI.js';
|
|
8
|
+
import '../utils/useFloatingUI/useFloatingUI.js';
|
|
9
9
|
import '../utils/useId.js';
|
|
10
10
|
import '../viewport/ViewportProvider.js';
|
|
11
11
|
import css_248z from './CheckboxIcon.css.js';
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { jsx } from 'react/jsx-runtime';
|
|
2
2
|
import { forwardRef } from 'react';
|
|
3
3
|
import { makePrefixer } from '../utils/makePrefixer.js';
|
|
4
|
-
import '../utils/useFloatingUI.js';
|
|
4
|
+
import '../utils/useFloatingUI/useFloatingUI.js';
|
|
5
5
|
import '../utils/useId.js';
|
|
6
6
|
import { useResponsiveProp } from '../utils/useResponsiveProp.js';
|
|
7
7
|
import { clsx } from 'clsx';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FlexItem.js","sources":["../src/flex-item/FlexItem.tsx"],"sourcesContent":["import { forwardRef, ElementType, ReactElement, CSSProperties } from \"react\";\nimport {\n makePrefixer,\n ResponsiveProp,\n useResponsiveProp,\n PolymorphicComponentPropWithRef,\n PolymorphicRef,\n} from \"../utils\";\nimport flexItemCss from \"./FlexItem.css\";\nimport { clsx } from \"clsx\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nconst withBaseName = makePrefixer(\"saltFlexItem\");\nexport const FLEX_ITEM_ALIGNMENTS = [\n \"start\",\n \"end\",\n \"center\",\n \"stretch\",\n] as const;\n\nexport type flexItemAlignment = typeof FLEX_ITEM_ALIGNMENTS[number];\n\nexport type FlexItemProps<T extends ElementType> =\n PolymorphicComponentPropWithRef<\n T,\n {\n /**\n * Allows the alignment specified by parent to be overridden for individual items, default is \"start\".\n */\n align?: flexItemAlignment;\n /**\n * Defines the ability for an item to shrink x times more compared to it's siblings, default is 1.\n */\n shrink?: ResponsiveProp<number>;\n /**\n * Defines the ability for an item to grow x times more compared to it's siblings, default is 0.\n */\n grow?: ResponsiveProp<number>;\n /**\n * Sets the initial main size of a flex item, default is \"auto\".\n */\n basis?: ResponsiveProp<CSSProperties[\"flexBasis\"]>;\n }\n >;\n\ntype FlexItemComponent = <T extends ElementType = \"div\">(\n props: FlexItemProps<T>\n) => ReactElement | null;\n\nexport const FlexItem: FlexItemComponent = forwardRef(\n <T extends ElementType = \"div\">(\n {\n as,\n align,\n children,\n className,\n shrink,\n grow,\n basis,\n style,\n ...rest\n }: FlexItemProps<T>,\n ref?: PolymorphicRef<T>\n ) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-flex-item\",\n css: flexItemCss,\n window: targetWindow,\n });\n\n const Component = as || \"div\";\n const flexItemShrink = useResponsiveProp(shrink, 1);\n const flexItemGrow = useResponsiveProp(grow, 0);\n const flexItemBasis = useResponsiveProp(basis, \"auto\");\n\n const itemStyle = {\n \"--saltFlexItem-alignment\": align,\n \"--saltFlexItem-shrink\": flexItemShrink,\n \"--saltFlexItem-grow\": flexItemGrow,\n \"--saltFlexItem-basis\": flexItemBasis,\n ...style,\n };\n return (\n <Component\n className={clsx(withBaseName(), className)}\n ref={ref}\n style={itemStyle}\n {...rest}\n >\n {children}\n </Component>\n );\n }\n);\n"],"names":["flexItemCss"],"mappings":";;;;;;;;;;;AAaA,MAAM,YAAA,GAAe,aAAa,cAAc,CAAA,CAAA;AACzC,MAAM,oBAAuB,GAAA;AAAA,EAClC,OAAA;AAAA,EACA,KAAA;AAAA,EACA,QAAA;AAAA,EACA,SAAA;AACF,EAAA;AA+BO,MAAM,QAA8B,GAAA,UAAA;AAAA,EACzC,CACE;AAAA,IACE,EAAA;AAAA,IACA,KAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA;AAAA,IACA,MAAA;AAAA,IACA,IAAA;AAAA,IACA,KAAA;AAAA,IACA,KAAA;AAAA,IACG,GAAA,IAAA;AAAA,KAEL,GACG,KAAA;AACH,IAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,gBAAA;AAAA,MACR,GAAK,EAAAA,QAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,YAAY,EAAM,IAAA,KAAA,CAAA;AACxB,IAAM,MAAA,cAAA,GAAiB,iBAAkB,CAAA,MAAA,EAAQ,CAAC,CAAA,CAAA;AAClD,IAAM,MAAA,YAAA,GAAe,iBAAkB,CAAA,IAAA,EAAM,CAAC,CAAA,CAAA;AAC9C,IAAM,MAAA,aAAA,GAAgB,iBAAkB,CAAA,KAAA,EAAO,MAAM,CAAA,CAAA;AAErD,IAAA,MAAM,SAAY,GAAA;AAAA,MAChB,0BAA4B,EAAA,KAAA;AAAA,MAC5B,uBAAyB,EAAA,cAAA;AAAA,MACzB,qBAAuB,EAAA,YAAA;AAAA,MACvB,sBAAwB,EAAA,aAAA;AAAA,MACxB,GAAG,KAAA;AAAA,KACL,CAAA;AACA,IAAA,uBACG,GAAA,CAAA,SAAA,EAAA;AAAA,MACC,SAAW,EAAA,IAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,MACzC,GAAA;AAAA,MACA,KAAO,EAAA,SAAA;AAAA,MACN,GAAG,IAAA;AAAA,MAEH,QAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
|
|
1
|
+
{"version":3,"file":"FlexItem.js","sources":["../src/flex-item/FlexItem.tsx"],"sourcesContent":["import { forwardRef, ElementType, ReactElement, CSSProperties } from \"react\";\nimport {\n makePrefixer,\n ResponsiveProp,\n useResponsiveProp,\n PolymorphicComponentPropWithRef,\n PolymorphicRef,\n} from \"../utils\";\nimport flexItemCss from \"./FlexItem.css\";\nimport { clsx } from \"clsx\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nconst withBaseName = makePrefixer(\"saltFlexItem\");\nexport const FLEX_ITEM_ALIGNMENTS = [\n \"start\",\n \"end\",\n \"center\",\n \"stretch\",\n] as const;\n\nexport type flexItemAlignment = (typeof FLEX_ITEM_ALIGNMENTS)[number];\n\nexport type FlexItemProps<T extends ElementType> =\n PolymorphicComponentPropWithRef<\n T,\n {\n /**\n * Allows the alignment specified by parent to be overridden for individual items, default is \"start\".\n */\n align?: flexItemAlignment;\n /**\n * Defines the ability for an item to shrink x times more compared to it's siblings, default is 1.\n */\n shrink?: ResponsiveProp<number>;\n /**\n * Defines the ability for an item to grow x times more compared to it's siblings, default is 0.\n */\n grow?: ResponsiveProp<number>;\n /**\n * Sets the initial main size of a flex item, default is \"auto\".\n */\n basis?: ResponsiveProp<CSSProperties[\"flexBasis\"]>;\n }\n >;\n\ntype FlexItemComponent = <T extends ElementType = \"div\">(\n props: FlexItemProps<T>\n) => ReactElement | null;\n\nexport const FlexItem: FlexItemComponent = forwardRef(\n <T extends ElementType = \"div\">(\n {\n as,\n align,\n children,\n className,\n shrink,\n grow,\n basis,\n style,\n ...rest\n }: FlexItemProps<T>,\n ref?: PolymorphicRef<T>\n ) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-flex-item\",\n css: flexItemCss,\n window: targetWindow,\n });\n\n const Component = as || \"div\";\n const flexItemShrink = useResponsiveProp(shrink, 1);\n const flexItemGrow = useResponsiveProp(grow, 0);\n const flexItemBasis = useResponsiveProp(basis, \"auto\");\n\n const itemStyle = {\n \"--saltFlexItem-alignment\": align,\n \"--saltFlexItem-shrink\": flexItemShrink,\n \"--saltFlexItem-grow\": flexItemGrow,\n \"--saltFlexItem-basis\": flexItemBasis,\n ...style,\n };\n return (\n <Component\n className={clsx(withBaseName(), className)}\n ref={ref}\n style={itemStyle}\n {...rest}\n >\n {children}\n </Component>\n );\n }\n);\n"],"names":["flexItemCss"],"mappings":";;;;;;;;;;;AAaA,MAAM,YAAA,GAAe,aAAa,cAAc,CAAA,CAAA;AACzC,MAAM,oBAAuB,GAAA;AAAA,EAClC,OAAA;AAAA,EACA,KAAA;AAAA,EACA,QAAA;AAAA,EACA,SAAA;AACF,EAAA;AA+BO,MAAM,QAA8B,GAAA,UAAA;AAAA,EACzC,CACE;AAAA,IACE,EAAA;AAAA,IACA,KAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA;AAAA,IACA,MAAA;AAAA,IACA,IAAA;AAAA,IACA,KAAA;AAAA,IACA,KAAA;AAAA,IACG,GAAA,IAAA;AAAA,KAEL,GACG,KAAA;AACH,IAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,gBAAA;AAAA,MACR,GAAK,EAAAA,QAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,YAAY,EAAM,IAAA,KAAA,CAAA;AACxB,IAAM,MAAA,cAAA,GAAiB,iBAAkB,CAAA,MAAA,EAAQ,CAAC,CAAA,CAAA;AAClD,IAAM,MAAA,YAAA,GAAe,iBAAkB,CAAA,IAAA,EAAM,CAAC,CAAA,CAAA;AAC9C,IAAM,MAAA,aAAA,GAAgB,iBAAkB,CAAA,KAAA,EAAO,MAAM,CAAA,CAAA;AAErD,IAAA,MAAM,SAAY,GAAA;AAAA,MAChB,0BAA4B,EAAA,KAAA;AAAA,MAC5B,uBAAyB,EAAA,cAAA;AAAA,MACzB,qBAAuB,EAAA,YAAA;AAAA,MACvB,sBAAwB,EAAA,aAAA;AAAA,MACxB,GAAG,KAAA;AAAA,KACL,CAAA;AACA,IAAA,uBACG,GAAA,CAAA,SAAA,EAAA;AAAA,MACC,SAAW,EAAA,IAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,MACzC,GAAA;AAAA,MACA,KAAO,EAAA,SAAA;AAAA,MACN,GAAG,IAAA;AAAA,MAEH,QAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
|
|
@@ -2,7 +2,7 @@ import { jsx } from 'react/jsx-runtime';
|
|
|
2
2
|
import { forwardRef } from 'react';
|
|
3
3
|
import { clsx } from 'clsx';
|
|
4
4
|
import { makePrefixer } from '../utils/makePrefixer.js';
|
|
5
|
-
import '../utils/useFloatingUI.js';
|
|
5
|
+
import '../utils/useFloatingUI/useFloatingUI.js';
|
|
6
6
|
import '../utils/useId.js';
|
|
7
7
|
import { useResponsiveProp } from '../utils/useResponsiveProp.js';
|
|
8
8
|
import css_248z from './FlexLayout.css.js';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FlexLayout.js","sources":["../src/flex-layout/FlexLayout.tsx"],"sourcesContent":["import { ElementType, forwardRef, ReactElement } from \"react\";\nimport { clsx } from \"clsx\";\n\nimport {\n makePrefixer,\n ResponsiveProp,\n useResponsiveProp,\n PolymorphicComponentPropWithRef,\n PolymorphicRef,\n} from \"../utils\";\n\nimport flexLayoutCss from \"./FlexLayout.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nconst withBaseName = makePrefixer(\"saltFlexLayout\");\n\nexport type LayoutSeparator = \"start\" | \"center\" | \"end\";\nexport type LayoutDirection = \"row\" | \"column\";\n\nexport const FLEX_ALIGNMENT_BASE = [\"start\", \"end\", \"center\"] as const;\nexport const FLEX_CONTENT_ALIGNMENT_BASE = [\n ...FLEX_ALIGNMENT_BASE,\n \"space-between\",\n \"space-around\",\n \"space-evenly\",\n] as const;\n\nexport type FlexAlignment = typeof FLEX_ALIGNMENT_BASE[number];\nexport type FlexContentAlignment = typeof FLEX_CONTENT_ALIGNMENT_BASE[number];\n\nexport type FlexLayoutProps<T extends ElementType> =\n PolymorphicComponentPropWithRef<\n T,\n {\n /**\n * Defines the default behavior for how flex items are laid out along the cross axis on the current line, default is \"stretch\".\n */\n align?: FlexAlignment | \"stretch\" | \"baseline\";\n /**\n * Establishes the main-axis, defining the direction children are placed. Default is \"row\".\n */\n direction?: ResponsiveProp<LayoutDirection>;\n /**\n * Controls the space between items, default is 3.\n */\n gap?: ResponsiveProp<number>;\n /**\n * Defines the alignment along the main axis, default is \"start\".\n */\n justify?: FlexContentAlignment;\n /**\n * **Deprecated:** For separators see `StackLayout` component instead.\n *\n * Adds a separator between elements if wrap is not active, default is false.\n */\n separators?: LayoutSeparator | true;\n /**\n * Allow the items to wrap as needed, default is false.\n */\n wrap?: ResponsiveProp<boolean>;\n }\n >;\n\ntype FlexLayoutComponent = <T extends ElementType = \"div\">(\n props: FlexLayoutProps<T>\n) => ReactElement | null;\n\nexport const FlexLayout: FlexLayoutComponent = forwardRef(\n <T extends ElementType = \"div\">(\n {\n as,\n align,\n children,\n className,\n direction,\n gap,\n justify,\n separators,\n style,\n wrap,\n ...rest\n }: FlexLayoutProps<T>,\n ref?: PolymorphicRef<T>\n ) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-flex-layout\",\n css: flexLayoutCss,\n window: targetWindow,\n });\n\n const Component = as || \"div\";\n const separatorAlignment = separators === true ? \"center\" : separators;\n const addPrefix = (style: string) => {\n return style === \"start\" || style === \"end\" ? `flex-${style}` : style;\n };\n\n const flexGap = useResponsiveProp(gap, 3);\n const flexDirection = useResponsiveProp(direction, \"row\");\n const flexWrap = useResponsiveProp(wrap, false);\n const flexLayoutStyles = {\n ...style,\n \"--flexLayout-align\": align && addPrefix(align),\n \"--flexLayout-direction\": flexDirection,\n \"--flexLayout-gap-multiplier\": flexGap,\n \"--flexLayout-justify\": justify && addPrefix(justify),\n \"--flexLayout-wrap\": flexWrap ? \"wrap\" : \"nowrap\",\n };\n\n return (\n <Component\n className={clsx(\n withBaseName(),\n {\n [withBaseName(\"separator\")]: separatorAlignment && !wrap,\n [withBaseName(\n `separator-${flexDirection || \"row\"}-${\n separatorAlignment || \"center\"\n }`\n )]: separatorAlignment && !wrap,\n [withBaseName(`separator-${flexDirection || \"row\"}`)]:\n separatorAlignment && !wrap,\n },\n className\n )}\n ref={ref}\n style={flexLayoutStyles}\n {...rest}\n >\n {children}\n </Component>\n );\n }\n);\n"],"names":["flexLayoutCss","style"],"mappings":";;;;;;;;;;;AAeA,MAAM,YAAA,GAAe,aAAa,gBAAgB,CAAA,CAAA;AAK3C,MAAM,mBAAsB,GAAA,CAAC,OAAS,EAAA,KAAA,EAAO,QAAQ,EAAA;AACrD,MAAM,2BAA8B,GAAA;AAAA,EACzC,GAAG,mBAAA;AAAA,EACH,eAAA;AAAA,EACA,cAAA;AAAA,EACA,cAAA;AACF,EAAA;AA0CO,MAAM,UAAkC,GAAA,UAAA;AAAA,EAC7C,CACE;AAAA,IACE,EAAA;AAAA,IACA,KAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA;AAAA,IACA,SAAA;AAAA,IACA,GAAA;AAAA,IACA,OAAA;AAAA,IACA,UAAA;AAAA,IACA,KAAA;AAAA,IACA,IAAA;AAAA,IACG,GAAA,IAAA;AAAA,KAEL,GACG,KAAA;AACH,IAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,kBAAA;AAAA,MACR,GAAK,EAAAA,QAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,YAAY,EAAM,IAAA,KAAA,CAAA;AACxB,IAAM,MAAA,kBAAA,GAAqB,UAAe,KAAA,IAAA,GAAO,QAAW,GAAA,UAAA,CAAA;AAC5D,IAAM,MAAA,SAAA,GAAY,CAACC,MAAkB,KAAA;AACnC,MAAA,OAAOA,MAAU,KAAA,OAAA,IAAWA,MAAU,KAAA,KAAA,GAAQ,QAAQA,MAAUA,CAAAA,CAAAA,GAAAA,MAAAA,CAAAA;AAAA,KAClE,CAAA;AAEA,IAAM,MAAA,OAAA,GAAU,iBAAkB,CAAA,GAAA,EAAK,CAAC,CAAA,CAAA;AACxC,IAAM,MAAA,aAAA,GAAgB,iBAAkB,CAAA,SAAA,EAAW,KAAK,CAAA,CAAA;AACxD,IAAM,MAAA,QAAA,GAAW,iBAAkB,CAAA,IAAA,EAAM,KAAK,CAAA,CAAA;AAC9C,IAAA,MAAM,gBAAmB,GAAA;AAAA,MACvB,GAAG,KAAA;AAAA,MACH,oBAAA,EAAsB,KAAS,IAAA,SAAA,CAAU,KAAK,CAAA;AAAA,MAC9C,wBAA0B,EAAA,aAAA;AAAA,MAC1B,6BAA+B,EAAA,OAAA;AAAA,MAC/B,sBAAA,EAAwB,OAAW,IAAA,SAAA,CAAU,OAAO,CAAA;AAAA,MACpD,mBAAA,EAAqB,WAAW,MAAS,GAAA,QAAA;AAAA,KAC3C,CAAA;AAEA,IAAA,uBACG,GAAA,CAAA,SAAA,EAAA;AAAA,MACC,SAAW,EAAA,IAAA;AAAA,QACT,YAAa,EAAA;AAAA,QACb;AAAA,UACE,CAAC,YAAA,CAAa,WAAW,CAAA,GAAI,sBAAsB,CAAC,IAAA;AAAA,UACpD,CAAC,YAAA;AAAA,YACC,CAAA,UAAA,EAAa,aAAiB,IAAA,KAAA,CAAA,CAAA,EAC5B,kBAAsB,IAAA,QAAA,CAAA,CAAA;AAAA,WAE1B,GAAI,sBAAsB,CAAC,IAAA;AAAA,UAC3B,CAAC,YAAa,CAAA,CAAA,UAAA,EAAa,iBAAiB,KAAO,CAAA,CAAA,CAAA,GACjD,sBAAsB,CAAC,IAAA;AAAA,SAC3B;AAAA,QACA,SAAA;AAAA,OACF;AAAA,MACA,GAAA;AAAA,MACA,KAAO,EAAA,gBAAA;AAAA,MACN,GAAG,IAAA;AAAA,MAEH,QAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
|
|
1
|
+
{"version":3,"file":"FlexLayout.js","sources":["../src/flex-layout/FlexLayout.tsx"],"sourcesContent":["import { ElementType, forwardRef, ReactElement } from \"react\";\nimport { clsx } from \"clsx\";\n\nimport {\n makePrefixer,\n ResponsiveProp,\n useResponsiveProp,\n PolymorphicComponentPropWithRef,\n PolymorphicRef,\n} from \"../utils\";\n\nimport flexLayoutCss from \"./FlexLayout.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nconst withBaseName = makePrefixer(\"saltFlexLayout\");\n\nexport type LayoutSeparator = \"start\" | \"center\" | \"end\";\nexport type LayoutDirection = \"row\" | \"column\";\n\nexport const FLEX_ALIGNMENT_BASE = [\"start\", \"end\", \"center\"] as const;\nexport const FLEX_CONTENT_ALIGNMENT_BASE = [\n ...FLEX_ALIGNMENT_BASE,\n \"space-between\",\n \"space-around\",\n \"space-evenly\",\n] as const;\n\nexport type FlexAlignment = (typeof FLEX_ALIGNMENT_BASE)[number];\nexport type FlexContentAlignment = (typeof FLEX_CONTENT_ALIGNMENT_BASE)[number];\n\nexport type FlexLayoutProps<T extends ElementType> =\n PolymorphicComponentPropWithRef<\n T,\n {\n /**\n * Defines the default behavior for how flex items are laid out along the cross axis on the current line, default is \"stretch\".\n */\n align?: FlexAlignment | \"stretch\" | \"baseline\";\n /**\n * Establishes the main-axis, defining the direction children are placed. Default is \"row\".\n */\n direction?: ResponsiveProp<LayoutDirection>;\n /**\n * Controls the space between items, default is 3.\n */\n gap?: ResponsiveProp<number>;\n /**\n * Defines the alignment along the main axis, default is \"start\".\n */\n justify?: FlexContentAlignment;\n /**\n * **Deprecated:** For separators see `StackLayout` component instead.\n *\n * Adds a separator between elements if wrap is not active, default is false.\n */\n separators?: LayoutSeparator | true;\n /**\n * Allow the items to wrap as needed, default is false.\n */\n wrap?: ResponsiveProp<boolean>;\n }\n >;\n\ntype FlexLayoutComponent = <T extends ElementType = \"div\">(\n props: FlexLayoutProps<T>\n) => ReactElement | null;\n\nexport const FlexLayout: FlexLayoutComponent = forwardRef(\n <T extends ElementType = \"div\">(\n {\n as,\n align,\n children,\n className,\n direction,\n gap,\n justify,\n separators,\n style,\n wrap,\n ...rest\n }: FlexLayoutProps<T>,\n ref?: PolymorphicRef<T>\n ) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-flex-layout\",\n css: flexLayoutCss,\n window: targetWindow,\n });\n\n const Component = as || \"div\";\n const separatorAlignment = separators === true ? \"center\" : separators;\n const addPrefix = (style: string) => {\n return style === \"start\" || style === \"end\" ? `flex-${style}` : style;\n };\n\n const flexGap = useResponsiveProp(gap, 3);\n const flexDirection = useResponsiveProp(direction, \"row\");\n const flexWrap = useResponsiveProp(wrap, false);\n const flexLayoutStyles = {\n ...style,\n \"--flexLayout-align\": align && addPrefix(align),\n \"--flexLayout-direction\": flexDirection,\n \"--flexLayout-gap-multiplier\": flexGap,\n \"--flexLayout-justify\": justify && addPrefix(justify),\n \"--flexLayout-wrap\": flexWrap ? \"wrap\" : \"nowrap\",\n };\n\n return (\n <Component\n className={clsx(\n withBaseName(),\n {\n [withBaseName(\"separator\")]: separatorAlignment && !wrap,\n [withBaseName(\n `separator-${flexDirection || \"row\"}-${\n separatorAlignment || \"center\"\n }`\n )]: separatorAlignment && !wrap,\n [withBaseName(`separator-${flexDirection || \"row\"}`)]:\n separatorAlignment && !wrap,\n },\n className\n )}\n ref={ref}\n style={flexLayoutStyles}\n {...rest}\n >\n {children}\n </Component>\n );\n }\n);\n"],"names":["flexLayoutCss","style"],"mappings":";;;;;;;;;;;AAeA,MAAM,YAAA,GAAe,aAAa,gBAAgB,CAAA,CAAA;AAK3C,MAAM,mBAAsB,GAAA,CAAC,OAAS,EAAA,KAAA,EAAO,QAAQ,EAAA;AACrD,MAAM,2BAA8B,GAAA;AAAA,EACzC,GAAG,mBAAA;AAAA,EACH,eAAA;AAAA,EACA,cAAA;AAAA,EACA,cAAA;AACF,EAAA;AA0CO,MAAM,UAAkC,GAAA,UAAA;AAAA,EAC7C,CACE;AAAA,IACE,EAAA;AAAA,IACA,KAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA;AAAA,IACA,SAAA;AAAA,IACA,GAAA;AAAA,IACA,OAAA;AAAA,IACA,UAAA;AAAA,IACA,KAAA;AAAA,IACA,IAAA;AAAA,IACG,GAAA,IAAA;AAAA,KAEL,GACG,KAAA;AACH,IAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,kBAAA;AAAA,MACR,GAAK,EAAAA,QAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,YAAY,EAAM,IAAA,KAAA,CAAA;AACxB,IAAM,MAAA,kBAAA,GAAqB,UAAe,KAAA,IAAA,GAAO,QAAW,GAAA,UAAA,CAAA;AAC5D,IAAM,MAAA,SAAA,GAAY,CAACC,MAAkB,KAAA;AACnC,MAAA,OAAOA,MAAU,KAAA,OAAA,IAAWA,MAAU,KAAA,KAAA,GAAQ,QAAQA,MAAUA,CAAAA,CAAAA,GAAAA,MAAAA,CAAAA;AAAA,KAClE,CAAA;AAEA,IAAM,MAAA,OAAA,GAAU,iBAAkB,CAAA,GAAA,EAAK,CAAC,CAAA,CAAA;AACxC,IAAM,MAAA,aAAA,GAAgB,iBAAkB,CAAA,SAAA,EAAW,KAAK,CAAA,CAAA;AACxD,IAAM,MAAA,QAAA,GAAW,iBAAkB,CAAA,IAAA,EAAM,KAAK,CAAA,CAAA;AAC9C,IAAA,MAAM,gBAAmB,GAAA;AAAA,MACvB,GAAG,KAAA;AAAA,MACH,oBAAA,EAAsB,KAAS,IAAA,SAAA,CAAU,KAAK,CAAA;AAAA,MAC9C,wBAA0B,EAAA,aAAA;AAAA,MAC1B,6BAA+B,EAAA,OAAA;AAAA,MAC/B,sBAAA,EAAwB,OAAW,IAAA,SAAA,CAAU,OAAO,CAAA;AAAA,MACpD,mBAAA,EAAqB,WAAW,MAAS,GAAA,QAAA;AAAA,KAC3C,CAAA;AAEA,IAAA,uBACG,GAAA,CAAA,SAAA,EAAA;AAAA,MACC,SAAW,EAAA,IAAA;AAAA,QACT,YAAa,EAAA;AAAA,QACb;AAAA,UACE,CAAC,YAAA,CAAa,WAAW,CAAA,GAAI,sBAAsB,CAAC,IAAA;AAAA,UACpD,CAAC,YAAA;AAAA,YACC,CAAA,UAAA,EAAa,aAAiB,IAAA,KAAA,CAAA,CAAA,EAC5B,kBAAsB,IAAA,QAAA,CAAA,CAAA;AAAA,WAE1B,GAAI,sBAAsB,CAAC,IAAA;AAAA,UAC3B,CAAC,YAAa,CAAA,CAAA,UAAA,EAAa,iBAAiB,KAAO,CAAA,CAAA,CAAA,GACjD,sBAAsB,CAAC,IAAA;AAAA,SAC3B;AAAA,QACA,SAAA;AAAA,OACF;AAAA,MACA,GAAA;AAAA,MACA,KAAO,EAAA,gBAAA;AAAA,MACN,GAAG,IAAA;AAAA,MAEH,QAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
var css_248z = ".saltFormField {\n display: inline-grid;\n position: relative;\n gap: var(--salt-spacing-100);\n text-align: left;\n width: var(--saltFormField-width, 100%);\n}\n\n.saltFormField-labelTop {\n grid-template-areas:\n \"label\"\n \"controls\"\n
|
|
1
|
+
var css_248z = ".saltFormField {\n display: inline-grid;\n position: relative;\n gap: var(--salt-spacing-100);\n text-align: left;\n width: var(--saltFormField-width, 100%);\n}\n\n.saltFormField-labelTop {\n grid-template-areas:\n \"label\"\n \"controls\";\n}\n\n.saltFormField-labelTop .saltFormFieldHelperText {\n grid-area: 3 / 1;\n}\n\n.saltFormField-labelLeft {\n align-self: center;\n grid-template-columns: var(--formField-label-width, 40%) 1fr;\n grid-template-areas: \"label controls\";\n}\n\n.saltFormField-labelRight {\n align-self: center;\n grid-template-columns: var(--formField-label-width, 40%) 1fr;\n grid-template-areas: \"label controls\";\n}\n\n.saltFormField-labelLeft .saltFormFieldHelperText,\n.saltFormField-labelRight .saltFormFieldHelperText {\n grid-area: 2 / 2;\n}\n\n.saltFormField-labelRight .saltFormFieldLabel,\n.saltFormField-labelLeft .saltFormFieldLabel {\n padding-top: var(--salt-spacing-100);\n}\n\n.saltFormField-labelRight .saltFormFieldLabel {\n text-align: right;\n}\n\n.saltFormField-controls {\n align-items: center;\n display: grid;\n grid-auto-columns: minmax(0, 1fr);\n grid-auto-flow: column;\n grid-column-gap: var(--salt-spacing-100);\n}\n\n.saltFormFieldLabel {\n grid-area: label;\n}\n\n.saltFormFieldHelperText {\n grid-area: helperText;\n}\n\n.saltFormField-disabled {\n --saltInput-outline: none;\n --saltCheckbox-outline: none;\n --saltRadioButton-outline: none;\n}\n";
|
|
2
2
|
|
|
3
3
|
export { css_248z as default };
|
|
4
4
|
//# sourceMappingURL=FormField.css.js.map
|
|
@@ -6,7 +6,7 @@ import { useWindow } from '@salt-ds/window';
|
|
|
6
6
|
import { FormFieldContext } from '../form-field-context/FormFieldContext.js';
|
|
7
7
|
import { capitalize } from '../utils/capitalize.js';
|
|
8
8
|
import { makePrefixer } from '../utils/makePrefixer.js';
|
|
9
|
-
import '../utils/useFloatingUI.js';
|
|
9
|
+
import '../utils/useFloatingUI/useFloatingUI.js';
|
|
10
10
|
import { useId } from '../utils/useId.js';
|
|
11
11
|
import '../salt-provider/SaltProvider.js';
|
|
12
12
|
import '../viewport/ViewportProvider.js';
|
|
@@ -7,7 +7,7 @@ import '../text/Headings.js';
|
|
|
7
7
|
import '../text/Label.js';
|
|
8
8
|
import 'react';
|
|
9
9
|
import { makePrefixer } from '../utils/makePrefixer.js';
|
|
10
|
-
import '../utils/useFloatingUI.js';
|
|
10
|
+
import '../utils/useFloatingUI/useFloatingUI.js';
|
|
11
11
|
import '../utils/useId.js';
|
|
12
12
|
import '../salt-provider/SaltProvider.js';
|
|
13
13
|
import '../viewport/ViewportProvider.js';
|
|
@@ -11,7 +11,7 @@ import { Label } from '../text/Label.js';
|
|
|
11
11
|
import { capitalize } from '../utils/capitalize.js';
|
|
12
12
|
import 'react';
|
|
13
13
|
import { makePrefixer } from '../utils/makePrefixer.js';
|
|
14
|
-
import '../utils/useFloatingUI.js';
|
|
14
|
+
import '../utils/useFloatingUI/useFloatingUI.js';
|
|
15
15
|
import '../utils/useId.js';
|
|
16
16
|
import '../salt-provider/SaltProvider.js';
|
|
17
17
|
import '../viewport/ViewportProvider.js';
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { createContext } from '../utils/createContext.js';
|
|
2
2
|
import 'react';
|
|
3
|
-
import '../utils/useFloatingUI.js';
|
|
3
|
+
import '../utils/useFloatingUI/useFloatingUI.js';
|
|
4
4
|
import '../utils/useId.js';
|
|
5
5
|
import '../salt-provider/SaltProvider.js';
|
|
6
6
|
import '../viewport/ViewportProvider.js';
|
|
@@ -2,7 +2,7 @@ import { jsx } from 'react/jsx-runtime';
|
|
|
2
2
|
import { forwardRef } from 'react';
|
|
3
3
|
import { clsx } from 'clsx';
|
|
4
4
|
import { makePrefixer } from '../utils/makePrefixer.js';
|
|
5
|
-
import '../utils/useFloatingUI.js';
|
|
5
|
+
import '../utils/useFloatingUI/useFloatingUI.js';
|
|
6
6
|
import '../utils/useId.js';
|
|
7
7
|
import { useResponsiveProp } from '../utils/useResponsiveProp.js';
|
|
8
8
|
import css_248z from './GridItem.css.js';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"GridItem.js","sources":["../src/grid-item/GridItem.tsx"],"sourcesContent":["import { forwardRef, ElementType, ReactElement } from \"react\";\nimport { clsx } from \"clsx\";\n\nimport {\n makePrefixer,\n ResponsiveProp,\n useResponsiveProp,\n PolymorphicRef,\n PolymorphicComponentPropWithRef,\n} from \"../utils\";\nimport gridItemCss from \"./GridItem.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nexport const GRID_ALIGNMENT_BASE = [\n \"start\",\n \"end\",\n \"center\",\n \"stretch\",\n] as const;\n\ntype GridAlignment = typeof GRID_ALIGNMENT_BASE[number];\n\ntype GridProperty = number | \"auto\";\nexport type GridItemProps<T extends ElementType> =\n PolymorphicComponentPropWithRef<\n T,\n {\n /**\n * The item will span across the provided number of grid columns. Defaults to \"auto\"\n */\n colSpan?: ResponsiveProp<GridProperty>;\n /**\n * The item will span across the provided number of grid rows. Defaults to \"auto\"\n */\n rowSpan?: ResponsiveProp<GridProperty>;\n /**\n * Aligns a grid item inside a cell along the inline (row) axis. Defaults to \"stretch\"\n */\n horizontalAlignment?: GridAlignment;\n /**\n * Aligns a grid item inside a cell along the block (column) axis. Defaults to \"stretch\"\n */\n verticalAlignment?: GridAlignment;\n }\n >;\n\nconst withBaseName = makePrefixer(\"saltGridItem\");\n\nconst colStart = \"auto\";\nconst colEnd = \"auto\";\nconst rowStart = \"auto\";\nconst rowEnd = \"auto\";\n\ntype GridItemComponent = <T extends ElementType = \"div\">(\n props: GridItemProps<T>\n) => ReactElement | null;\n\nexport const GridItem: GridItemComponent = forwardRef(\n <T extends ElementType = \"div\">(\n {\n as,\n children,\n className,\n colSpan,\n rowSpan,\n horizontalAlignment = \"stretch\",\n verticalAlignment = \"stretch\",\n style,\n ...rest\n }: GridItemProps<T>,\n ref?: PolymorphicRef<T>\n ) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-grid-item\",\n css: gridItemCss,\n window: targetWindow,\n });\n\n const Component = as || \"div\";\n const gridItemColSpan = useResponsiveProp(colSpan, \"auto\");\n\n const gridItemRowSpan = useResponsiveProp(rowSpan, \"auto\");\n\n const gridColumnStart = gridItemColSpan\n ? `span ${gridItemColSpan}`\n : colStart;\n\n const gridColumnEnd = gridItemColSpan ? `span ${gridItemColSpan}` : colEnd;\n\n const gridRowStart = gridItemRowSpan ? `span ${gridItemRowSpan}` : rowStart;\n\n const gridRowEnd = gridItemRowSpan ? `span ${gridItemRowSpan}` : rowEnd;\n\n const gridStyles = {\n ...style,\n \"--gridItem-justifySelf\": horizontalAlignment,\n \"--gridItem-alignSelf\": verticalAlignment,\n \"--gridItem-gridRowStart\": gridRowStart,\n \"--gridItem-gridColumnStart\": gridColumnStart,\n \"--gridItem-gridRowEnd\": gridRowEnd,\n \"--gridItem-gridColumnEnd\": gridColumnEnd,\n };\n\n return (\n <Component\n className={clsx(withBaseName(), className)}\n style={gridStyles}\n ref={ref}\n {...rest}\n >\n {children}\n </Component>\n );\n }\n);\n"],"names":["gridItemCss"],"mappings":";;;;;;;;;;;AAcO,MAAM,mBAAsB,GAAA;AAAA,EACjC,OAAA;AAAA,EACA,KAAA;AAAA,EACA,QAAA;AAAA,EACA,SAAA;AACF,EAAA;AA4BA,MAAM,YAAA,GAAe,aAAa,cAAc,CAAA,CAAA;AAEhD,MAAM,QAAW,GAAA,MAAA,CAAA;AACjB,MAAM,MAAS,GAAA,MAAA,CAAA;AACf,MAAM,QAAW,GAAA,MAAA,CAAA;AACjB,MAAM,MAAS,GAAA,MAAA,CAAA;AAMR,MAAM,QAA8B,GAAA,UAAA;AAAA,EACzC,CACE;AAAA,IACE,EAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA;AAAA,IACA,OAAA;AAAA,IACA,OAAA;AAAA,IACA,mBAAsB,GAAA,SAAA;AAAA,IACtB,iBAAoB,GAAA,SAAA;AAAA,IACpB,KAAA;AAAA,IACG,GAAA,IAAA;AAAA,KAEL,GACG,KAAA;AACH,IAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,gBAAA;AAAA,MACR,GAAK,EAAAA,QAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,YAAY,EAAM,IAAA,KAAA,CAAA;AACxB,IAAM,MAAA,eAAA,GAAkB,iBAAkB,CAAA,OAAA,EAAS,MAAM,CAAA,CAAA;AAEzD,IAAM,MAAA,eAAA,GAAkB,iBAAkB,CAAA,OAAA,EAAS,MAAM,CAAA,CAAA;AAEzD,IAAM,MAAA,eAAA,GAAkB,eACpB,GAAA,CAAA,KAAA,EAAQ,eACR,CAAA,CAAA,GAAA,QAAA,CAAA;AAEJ,IAAM,MAAA,aAAA,GAAgB,eAAkB,GAAA,CAAA,KAAA,EAAQ,eAAoB,CAAA,CAAA,GAAA,MAAA,CAAA;AAEpE,IAAM,MAAA,YAAA,GAAe,eAAkB,GAAA,CAAA,KAAA,EAAQ,eAAoB,CAAA,CAAA,GAAA,QAAA,CAAA;AAEnE,IAAM,MAAA,UAAA,GAAa,eAAkB,GAAA,CAAA,KAAA,EAAQ,eAAoB,CAAA,CAAA,GAAA,MAAA,CAAA;AAEjE,IAAA,MAAM,UAAa,GAAA;AAAA,MACjB,GAAG,KAAA;AAAA,MACH,wBAA0B,EAAA,mBAAA;AAAA,MAC1B,sBAAwB,EAAA,iBAAA;AAAA,MACxB,yBAA2B,EAAA,YAAA;AAAA,MAC3B,4BAA8B,EAAA,eAAA;AAAA,MAC9B,uBAAyB,EAAA,UAAA;AAAA,MACzB,0BAA4B,EAAA,aAAA;AAAA,KAC9B,CAAA;AAEA,IAAA,uBACG,GAAA,CAAA,SAAA,EAAA;AAAA,MACC,SAAW,EAAA,IAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,MACzC,KAAO,EAAA,UAAA;AAAA,MACP,GAAA;AAAA,MACC,GAAG,IAAA;AAAA,MAEH,QAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
|
|
1
|
+
{"version":3,"file":"GridItem.js","sources":["../src/grid-item/GridItem.tsx"],"sourcesContent":["import { forwardRef, ElementType, ReactElement } from \"react\";\nimport { clsx } from \"clsx\";\n\nimport {\n makePrefixer,\n ResponsiveProp,\n useResponsiveProp,\n PolymorphicRef,\n PolymorphicComponentPropWithRef,\n} from \"../utils\";\nimport gridItemCss from \"./GridItem.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nexport const GRID_ALIGNMENT_BASE = [\n \"start\",\n \"end\",\n \"center\",\n \"stretch\",\n] as const;\n\ntype GridAlignment = (typeof GRID_ALIGNMENT_BASE)[number];\n\ntype GridProperty = number | \"auto\";\nexport type GridItemProps<T extends ElementType> =\n PolymorphicComponentPropWithRef<\n T,\n {\n /**\n * The item will span across the provided number of grid columns. Defaults to \"auto\"\n */\n colSpan?: ResponsiveProp<GridProperty>;\n /**\n * The item will span across the provided number of grid rows. Defaults to \"auto\"\n */\n rowSpan?: ResponsiveProp<GridProperty>;\n /**\n * Aligns a grid item inside a cell along the inline (row) axis. Defaults to \"stretch\"\n */\n horizontalAlignment?: GridAlignment;\n /**\n * Aligns a grid item inside a cell along the block (column) axis. Defaults to \"stretch\"\n */\n verticalAlignment?: GridAlignment;\n }\n >;\n\nconst withBaseName = makePrefixer(\"saltGridItem\");\n\nconst colStart = \"auto\";\nconst colEnd = \"auto\";\nconst rowStart = \"auto\";\nconst rowEnd = \"auto\";\n\ntype GridItemComponent = <T extends ElementType = \"div\">(\n props: GridItemProps<T>\n) => ReactElement | null;\n\nexport const GridItem: GridItemComponent = forwardRef(\n <T extends ElementType = \"div\">(\n {\n as,\n children,\n className,\n colSpan,\n rowSpan,\n horizontalAlignment = \"stretch\",\n verticalAlignment = \"stretch\",\n style,\n ...rest\n }: GridItemProps<T>,\n ref?: PolymorphicRef<T>\n ) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-grid-item\",\n css: gridItemCss,\n window: targetWindow,\n });\n\n const Component = as || \"div\";\n const gridItemColSpan = useResponsiveProp(colSpan, \"auto\");\n\n const gridItemRowSpan = useResponsiveProp(rowSpan, \"auto\");\n\n const gridColumnStart = gridItemColSpan\n ? `span ${gridItemColSpan}`\n : colStart;\n\n const gridColumnEnd = gridItemColSpan ? `span ${gridItemColSpan}` : colEnd;\n\n const gridRowStart = gridItemRowSpan ? `span ${gridItemRowSpan}` : rowStart;\n\n const gridRowEnd = gridItemRowSpan ? `span ${gridItemRowSpan}` : rowEnd;\n\n const gridStyles = {\n ...style,\n \"--gridItem-justifySelf\": horizontalAlignment,\n \"--gridItem-alignSelf\": verticalAlignment,\n \"--gridItem-gridRowStart\": gridRowStart,\n \"--gridItem-gridColumnStart\": gridColumnStart,\n \"--gridItem-gridRowEnd\": gridRowEnd,\n \"--gridItem-gridColumnEnd\": gridColumnEnd,\n };\n\n return (\n <Component\n className={clsx(withBaseName(), className)}\n style={gridStyles}\n ref={ref}\n {...rest}\n >\n {children}\n </Component>\n );\n }\n);\n"],"names":["gridItemCss"],"mappings":";;;;;;;;;;;AAcO,MAAM,mBAAsB,GAAA;AAAA,EACjC,OAAA;AAAA,EACA,KAAA;AAAA,EACA,QAAA;AAAA,EACA,SAAA;AACF,EAAA;AA4BA,MAAM,YAAA,GAAe,aAAa,cAAc,CAAA,CAAA;AAEhD,MAAM,QAAW,GAAA,MAAA,CAAA;AACjB,MAAM,MAAS,GAAA,MAAA,CAAA;AACf,MAAM,QAAW,GAAA,MAAA,CAAA;AACjB,MAAM,MAAS,GAAA,MAAA,CAAA;AAMR,MAAM,QAA8B,GAAA,UAAA;AAAA,EACzC,CACE;AAAA,IACE,EAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA;AAAA,IACA,OAAA;AAAA,IACA,OAAA;AAAA,IACA,mBAAsB,GAAA,SAAA;AAAA,IACtB,iBAAoB,GAAA,SAAA;AAAA,IACpB,KAAA;AAAA,IACG,GAAA,IAAA;AAAA,KAEL,GACG,KAAA;AACH,IAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,gBAAA;AAAA,MACR,GAAK,EAAAA,QAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,YAAY,EAAM,IAAA,KAAA,CAAA;AACxB,IAAM,MAAA,eAAA,GAAkB,iBAAkB,CAAA,OAAA,EAAS,MAAM,CAAA,CAAA;AAEzD,IAAM,MAAA,eAAA,GAAkB,iBAAkB,CAAA,OAAA,EAAS,MAAM,CAAA,CAAA;AAEzD,IAAM,MAAA,eAAA,GAAkB,eACpB,GAAA,CAAA,KAAA,EAAQ,eACR,CAAA,CAAA,GAAA,QAAA,CAAA;AAEJ,IAAM,MAAA,aAAA,GAAgB,eAAkB,GAAA,CAAA,KAAA,EAAQ,eAAoB,CAAA,CAAA,GAAA,MAAA,CAAA;AAEpE,IAAM,MAAA,YAAA,GAAe,eAAkB,GAAA,CAAA,KAAA,EAAQ,eAAoB,CAAA,CAAA,GAAA,QAAA,CAAA;AAEnE,IAAM,MAAA,UAAA,GAAa,eAAkB,GAAA,CAAA,KAAA,EAAQ,eAAoB,CAAA,CAAA,GAAA,MAAA,CAAA;AAEjE,IAAA,MAAM,UAAa,GAAA;AAAA,MACjB,GAAG,KAAA;AAAA,MACH,wBAA0B,EAAA,mBAAA;AAAA,MAC1B,sBAAwB,EAAA,iBAAA;AAAA,MACxB,yBAA2B,EAAA,YAAA;AAAA,MAC3B,4BAA8B,EAAA,eAAA;AAAA,MAC9B,uBAAyB,EAAA,UAAA;AAAA,MACzB,0BAA4B,EAAA,aAAA;AAAA,KAC9B,CAAA;AAEA,IAAA,uBACG,GAAA,CAAA,SAAA,EAAA;AAAA,MACC,SAAW,EAAA,IAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,MACzC,KAAO,EAAA,UAAA;AAAA,MACP,GAAA;AAAA,MACC,GAAG,IAAA;AAAA,MAEH,QAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
|
|
@@ -2,7 +2,7 @@ import { jsx } from 'react/jsx-runtime';
|
|
|
2
2
|
import { forwardRef } from 'react';
|
|
3
3
|
import { clsx } from 'clsx';
|
|
4
4
|
import { makePrefixer } from '../utils/makePrefixer.js';
|
|
5
|
-
import '../utils/useFloatingUI.js';
|
|
5
|
+
import '../utils/useFloatingUI/useFloatingUI.js';
|
|
6
6
|
import '../utils/useId.js';
|
|
7
7
|
import { useResponsiveProp } from '../utils/useResponsiveProp.js';
|
|
8
8
|
import css_248z from './GridLayout.css.js';
|
package/dist-es/index.js
CHANGED
|
@@ -69,7 +69,7 @@ export { ownerDocument } from './utils/ownerDocument.js';
|
|
|
69
69
|
export { ownerWindow } from './utils/ownerWindow.js';
|
|
70
70
|
export { setRef } from './utils/setRef.js';
|
|
71
71
|
export { useControlled } from './utils/useControlled.js';
|
|
72
|
-
export { DEFAULT_FLOATING_UI_MIDDLEWARE, useFloatingUI } from './utils/useFloatingUI.js';
|
|
72
|
+
export { DEFAULT_FLOATING_UI_MIDDLEWARE, FloatingComponentProvider, FloatingPlatformProvider, useFloatingComponent, useFloatingPlatform, useFloatingUI } from './utils/useFloatingUI/useFloatingUI.js';
|
|
73
73
|
export { useForkRef } from './utils/useForkRef.js';
|
|
74
74
|
export { useId, useIdMemo } from './utils/useId.js';
|
|
75
75
|
export { teardown, useIsFocusVisible } from './utils/useIsFocusVisible.js';
|
package/dist-es/input/Input.js
CHANGED
|
@@ -7,7 +7,7 @@ import '../form-field-context/FormFieldContext.js';
|
|
|
7
7
|
import { useFormFieldProps } from '../form-field-context/useFormFieldProps.js';
|
|
8
8
|
import { makePrefixer } from '../utils/makePrefixer.js';
|
|
9
9
|
import { useControlled } from '../utils/useControlled.js';
|
|
10
|
-
import '../utils/useFloatingUI.js';
|
|
10
|
+
import '../utils/useFloatingUI/useFloatingUI.js';
|
|
11
11
|
import '../utils/useId.js';
|
|
12
12
|
import '../salt-provider/SaltProvider.js';
|
|
13
13
|
import '../viewport/ViewportProvider.js';
|
package/dist-es/link/Link.js
CHANGED
|
@@ -3,7 +3,7 @@ import { forwardRef } from 'react';
|
|
|
3
3
|
import { clsx } from 'clsx';
|
|
4
4
|
import { TearOutIcon } from '@salt-ds/icons';
|
|
5
5
|
import { makePrefixer } from '../utils/makePrefixer.js';
|
|
6
|
-
import '../utils/useFloatingUI.js';
|
|
6
|
+
import '../utils/useFloatingUI/useFloatingUI.js';
|
|
7
7
|
import '../utils/useId.js';
|
|
8
8
|
import '../salt-provider/SaltProvider.js';
|
|
9
9
|
import '../viewport/ViewportProvider.js';
|
|
@@ -8,7 +8,7 @@ import { useFormFieldProps } from '../form-field-context/useFormFieldProps.js';
|
|
|
8
8
|
import { StatusAdornment } from '../status-adornment/StatusAdornment.js';
|
|
9
9
|
import { makePrefixer } from '../utils/makePrefixer.js';
|
|
10
10
|
import { useControlled } from '../utils/useControlled.js';
|
|
11
|
-
import '../utils/useFloatingUI.js';
|
|
11
|
+
import '../utils/useFloatingUI/useFloatingUI.js';
|
|
12
12
|
import '../utils/useId.js';
|
|
13
13
|
import '../salt-provider/SaltProvider.js';
|
|
14
14
|
import '../viewport/ViewportProvider.js';
|
package/dist-es/panel/Panel.js
CHANGED
|
@@ -2,7 +2,7 @@ import { jsx } from 'react/jsx-runtime';
|
|
|
2
2
|
import { clsx } from 'clsx';
|
|
3
3
|
import { forwardRef } from 'react';
|
|
4
4
|
import { makePrefixer } from '../utils/makePrefixer.js';
|
|
5
|
-
import '../utils/useFloatingUI.js';
|
|
5
|
+
import '../utils/useFloatingUI/useFloatingUI.js';
|
|
6
6
|
import '../utils/useId.js';
|
|
7
7
|
import '../salt-provider/SaltProvider.js';
|
|
8
8
|
import '../viewport/ViewportProvider.js';
|
|
@@ -3,7 +3,7 @@ import { clsx } from 'clsx';
|
|
|
3
3
|
import { forwardRef } from 'react';
|
|
4
4
|
import { makePrefixer } from '../utils/makePrefixer.js';
|
|
5
5
|
import { useControlled } from '../utils/useControlled.js';
|
|
6
|
-
import '../utils/useFloatingUI.js';
|
|
6
|
+
import '../utils/useFloatingUI/useFloatingUI.js';
|
|
7
7
|
import '../utils/useId.js';
|
|
8
8
|
import '../salt-provider/SaltProvider.js';
|
|
9
9
|
import '../viewport/ViewportProvider.js';
|
|
@@ -3,7 +3,7 @@ import { clsx } from 'clsx';
|
|
|
3
3
|
import { forwardRef } from 'react';
|
|
4
4
|
import { makePrefixer } from '../utils/makePrefixer.js';
|
|
5
5
|
import { useControlled } from '../utils/useControlled.js';
|
|
6
|
-
import '../utils/useFloatingUI.js';
|
|
6
|
+
import '../utils/useFloatingUI/useFloatingUI.js';
|
|
7
7
|
import { useId } from '../utils/useId.js';
|
|
8
8
|
import '../salt-provider/SaltProvider.js';
|
|
9
9
|
import '../viewport/ViewportProvider.js';
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
2
|
import 'react';
|
|
3
3
|
import { makePrefixer } from '../utils/makePrefixer.js';
|
|
4
|
-
import '../utils/useFloatingUI.js';
|
|
4
|
+
import '../utils/useFloatingUI/useFloatingUI.js';
|
|
5
5
|
import '../utils/useId.js';
|
|
6
6
|
import '../salt-provider/SaltProvider.js';
|
|
7
7
|
import '../viewport/ViewportProvider.js';
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { createContext } from '../../utils/createContext.js';
|
|
2
2
|
import 'react';
|
|
3
|
-
import '../../utils/useFloatingUI.js';
|
|
3
|
+
import '../../utils/useFloatingUI/useFloatingUI.js';
|
|
4
4
|
import '../../utils/useId.js';
|
|
5
5
|
import '../../salt-provider/SaltProvider.js';
|
|
6
6
|
import '../../viewport/ViewportProvider.js';
|
|
@@ -2,7 +2,7 @@ import { jsx } from 'react/jsx-runtime';
|
|
|
2
2
|
import { clsx } from 'clsx';
|
|
3
3
|
import React__default, { createContext, useContext, useMemo } from 'react';
|
|
4
4
|
import '../aria-announcer/AriaAnnouncerContext.js';
|
|
5
|
-
import '../utils/useFloatingUI.js';
|
|
5
|
+
import '../utils/useFloatingUI/useFloatingUI.js';
|
|
6
6
|
import '../utils/useId.js';
|
|
7
7
|
import { useIsomorphicLayoutEffect } from '../utils/useIsomorphicLayoutEffect.js';
|
|
8
8
|
import { ViewportProvider } from '../viewport/ViewportProvider.js';
|
|
@@ -4,7 +4,7 @@ import { forwardRef, useEffect } from 'react';
|
|
|
4
4
|
import '../aria-announcer/AriaAnnouncerContext.js';
|
|
5
5
|
import { useAriaAnnouncer } from '../aria-announcer/useAriaAnnouncer.js';
|
|
6
6
|
import { makePrefixer } from '../utils/makePrefixer.js';
|
|
7
|
-
import '../utils/useFloatingUI.js';
|
|
7
|
+
import '../utils/useFloatingUI/useFloatingUI.js';
|
|
8
8
|
import { useId } from '../utils/useId.js';
|
|
9
9
|
import '../salt-provider/SaltProvider.js';
|
|
10
10
|
import '../viewport/ViewportProvider.js';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Spinner.js","sources":["../src/spinner/Spinner.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { forwardRef, HTMLAttributes, useEffect } from \"react\";\nimport { useAriaAnnouncer } from \"../aria-announcer\";\nimport { makePrefixer, useId } from \"../utils\";\nimport { SpinnerSVG } from \"./svgSpinners/SpinnerSVG\";\n\nimport spinnerCss from \"./Spinner.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\n/**\n * Spinner component, provides an indeterminate loading indicator\n *\n * @example\n * <Spinner size=\"default | large\" />\n */\n\nexport const SpinnerSizeValues = [\"default\", \"large\"] as const;\nexport type SpinnerSize = typeof SpinnerSizeValues[number];\nconst withBaseName = makePrefixer(\"saltSpinner\");\n\nexport interface SpinnerProps extends HTMLAttributes<HTMLDivElement> {\n /**\n * Determines the interval on which the component will continue to announce the aria-label. Defaults to 5000ms (5s)\n */\n announcerInterval?: number;\n /**\n * * Determines the interval after which the component will stop announcing the aria-label. Defaults to 20000ms (20s)\n */\n announcerTimeout?: number;\n /**\n * The className(s) of the component\n */\n className?: string;\n /**\n * Determines the message to be announced by the component when it unmounts. Set to null if not needed.\n */\n completionAnnouncement?: string | null;\n /**\n * If true, built in aria announcer will be inactive\n */\n disableAnnouncer?: boolean;\n /**\n * The prop for the role attribute of the component\n */\n role?: string;\n /**\n * Determines the size of the spinner. Must be one of: 'default', 'large'.\n */\n size?: SpinnerSize;\n /**\n * The ids of the SvgSpinner components\n */\n id?: string;\n}\n\nexport const Spinner = forwardRef<HTMLDivElement, SpinnerProps>(\n function Spinner(\n {\n \"aria-label\": ariaLabel = \"loading\",\n announcerInterval = 5000,\n announcerTimeout = 20000,\n completionAnnouncement = `finished ${ariaLabel}`,\n disableAnnouncer,\n role = \"img\",\n className,\n size = \"default\",\n id: idProp,\n ...rest\n },\n ref\n ) {\n const id = useId(idProp);\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-spinner\",\n css: spinnerCss,\n window: targetWindow,\n });\n\n const { announce } = useAriaAnnouncer();\n\n useEffect(() => {\n if (disableAnnouncer) return;\n\n announce(ariaLabel);\n\n const startTime = new Date().getTime();\n\n const interval =\n announcerInterval > 0 &&\n setInterval(() => {\n if (new Date().getTime() - startTime > announcerTimeout) {\n // The announcer will stop after `announcerTimeout` time\n announce(\n `${ariaLabel} is still in progress, but will no longer announce.`\n );\n interval && clearInterval(interval);\n return;\n }\n announce(ariaLabel);\n }, announcerInterval);\n\n return () => {\n if (disableAnnouncer) return;\n\n interval && clearInterval(interval);\n if (completionAnnouncement) {\n announce(completionAnnouncement);\n }\n };\n }, [\n announce,\n announcerInterval,\n announcerTimeout,\n ariaLabel,\n completionAnnouncement,\n disableAnnouncer,\n ]);\n\n return (\n <div\n aria-label={ariaLabel}\n className={clsx(withBaseName(), withBaseName(size), className)}\n ref={ref}\n role={role}\n {...rest}\n >\n <SpinnerSVG id={id} />\n </div>\n );\n }\n);\n"],"names":["Spinner","spinnerCss"],"mappings":";;;;;;;;;;;;;;;AAiBa,MAAA,iBAAA,GAAoB,CAAC,SAAA,EAAW,OAAO,EAAA;AAEpD,MAAM,YAAA,GAAe,aAAa,aAAa,CAAA,CAAA;AAqCxC,MAAM,OAAU,GAAA,UAAA;AAAA,EACrB,SAASA,QACP,CAAA;AAAA,IACE,cAAc,SAAY,GAAA,SAAA;AAAA,IAC1B,iBAAoB,GAAA,GAAA;AAAA,IACpB,gBAAmB,GAAA,GAAA;AAAA,IACnB,yBAAyB,CAAY,SAAA,EAAA,SAAA,CAAA,CAAA;AAAA,IACrC,gBAAA;AAAA,IACA,IAAO,GAAA,KAAA;AAAA,IACP,SAAA;AAAA,IACA,IAAO,GAAA,SAAA;AAAA,IACP,EAAI,EAAA,MAAA;AAAA,IACD,GAAA,IAAA;AAAA,KAEL,GACA,EAAA;AACA,IAAM,MAAA,EAAA,GAAK,MAAM,MAAM,CAAA,CAAA;AACvB,IAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,cAAA;AAAA,MACR,GAAK,EAAAC,QAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAM,MAAA,EAAE,QAAS,EAAA,GAAI,gBAAiB,EAAA,CAAA;AAEtC,IAAA,SAAA,CAAU,MAAM;AACd,MAAI,IAAA,gBAAA;AAAkB,QAAA,OAAA;AAEtB,MAAA,QAAA,CAAS,SAAS,CAAA,CAAA;AAElB,MAAA,MAAM,SAAY,GAAA,IAAI,IAAK,EAAA,CAAE,OAAQ,EAAA,CAAA;AAErC,MAAA,MAAM,QACJ,GAAA,iBAAA,GAAoB,CACpB,IAAA,WAAA,CAAY,MAAM;AAChB,QAAA,IAAI,IAAI,IAAK,EAAA,CAAE,OAAQ,EAAA,GAAI,YAAY,gBAAkB,EAAA;AAEvD,UAAA,QAAA;AAAA,YACE,CAAG,EAAA,SAAA,CAAA,mDAAA,CAAA;AAAA,WACL,CAAA;AACA,UAAA,QAAA,IAAY,cAAc,QAAQ,CAAA,CAAA;AAClC,UAAA,OAAA;AAAA,SACF;AACA,QAAA,QAAA,CAAS,SAAS,CAAA,CAAA;AAAA,SACjB,iBAAiB,CAAA,CAAA;AAEtB,MAAA,OAAO,MAAM;AACX,QAAI,IAAA,gBAAA;AAAkB,UAAA,OAAA;AAEtB,QAAA,QAAA,IAAY,cAAc,QAAQ,CAAA,CAAA;AAClC,QAAA,IAAI,sBAAwB,EAAA;AAC1B,UAAA,QAAA,CAAS,sBAAsB,CAAA,CAAA;AAAA,SACjC;AAAA,OACF,CAAA;AAAA,KACC,EAAA;AAAA,MACD,QAAA;AAAA,MACA,iBAAA;AAAA,MACA,gBAAA;AAAA,MACA,SAAA;AAAA,MACA,sBAAA;AAAA,MACA,gBAAA;AAAA,KACD,CAAA,CAAA;AAED,IAAA,uBACG,GAAA,CAAA,KAAA,EAAA;AAAA,MACC,YAAY,EAAA,SAAA;AAAA,MACZ,WAAW,IAAK,CAAA,YAAA,IAAgB,YAAa,CAAA,IAAI,GAAG,SAAS,CAAA;AAAA,MAC7D,GAAA;AAAA,MACA,IAAA;AAAA,MACC,GAAG,IAAA;AAAA,MAEJ,QAAC,kBAAA,GAAA,CAAA,UAAA,EAAA;AAAA,QAAW,EAAA;AAAA,OAAQ,CAAA;AAAA,KACtB,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
|
|
1
|
+
{"version":3,"file":"Spinner.js","sources":["../src/spinner/Spinner.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { forwardRef, HTMLAttributes, useEffect } from \"react\";\nimport { useAriaAnnouncer } from \"../aria-announcer\";\nimport { makePrefixer, useId } from \"../utils\";\nimport { SpinnerSVG } from \"./svgSpinners/SpinnerSVG\";\n\nimport spinnerCss from \"./Spinner.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\n/**\n * Spinner component, provides an indeterminate loading indicator\n *\n * @example\n * <Spinner size=\"default | large\" />\n */\n\nexport const SpinnerSizeValues = [\"default\", \"large\"] as const;\nexport type SpinnerSize = (typeof SpinnerSizeValues)[number];\nconst withBaseName = makePrefixer(\"saltSpinner\");\n\nexport interface SpinnerProps extends HTMLAttributes<HTMLDivElement> {\n /**\n * Determines the interval on which the component will continue to announce the aria-label. Defaults to 5000ms (5s)\n */\n announcerInterval?: number;\n /**\n * * Determines the interval after which the component will stop announcing the aria-label. Defaults to 20000ms (20s)\n */\n announcerTimeout?: number;\n /**\n * The className(s) of the component\n */\n className?: string;\n /**\n * Determines the message to be announced by the component when it unmounts. Set to null if not needed.\n */\n completionAnnouncement?: string | null;\n /**\n * If true, built in aria announcer will be inactive\n */\n disableAnnouncer?: boolean;\n /**\n * The prop for the role attribute of the component\n */\n role?: string;\n /**\n * Determines the size of the spinner. Must be one of: 'default', 'large'.\n */\n size?: SpinnerSize;\n /**\n * The ids of the SvgSpinner components\n */\n id?: string;\n}\n\nexport const Spinner = forwardRef<HTMLDivElement, SpinnerProps>(\n function Spinner(\n {\n \"aria-label\": ariaLabel = \"loading\",\n announcerInterval = 5000,\n announcerTimeout = 20000,\n completionAnnouncement = `finished ${ariaLabel}`,\n disableAnnouncer,\n role = \"img\",\n className,\n size = \"default\",\n id: idProp,\n ...rest\n },\n ref\n ) {\n const id = useId(idProp);\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-spinner\",\n css: spinnerCss,\n window: targetWindow,\n });\n\n const { announce } = useAriaAnnouncer();\n\n useEffect(() => {\n if (disableAnnouncer) return;\n\n announce(ariaLabel);\n\n const startTime = new Date().getTime();\n\n const interval =\n announcerInterval > 0 &&\n setInterval(() => {\n if (new Date().getTime() - startTime > announcerTimeout) {\n // The announcer will stop after `announcerTimeout` time\n announce(\n `${ariaLabel} is still in progress, but will no longer announce.`\n );\n interval && clearInterval(interval);\n return;\n }\n announce(ariaLabel);\n }, announcerInterval);\n\n return () => {\n if (disableAnnouncer) return;\n\n interval && clearInterval(interval);\n if (completionAnnouncement) {\n announce(completionAnnouncement);\n }\n };\n }, [\n announce,\n announcerInterval,\n announcerTimeout,\n ariaLabel,\n completionAnnouncement,\n disableAnnouncer,\n ]);\n\n return (\n <div\n aria-label={ariaLabel}\n className={clsx(withBaseName(), withBaseName(size), className)}\n ref={ref}\n role={role}\n {...rest}\n >\n <SpinnerSVG id={id} />\n </div>\n );\n }\n);\n"],"names":["Spinner","spinnerCss"],"mappings":";;;;;;;;;;;;;;;AAiBa,MAAA,iBAAA,GAAoB,CAAC,SAAA,EAAW,OAAO,EAAA;AAEpD,MAAM,YAAA,GAAe,aAAa,aAAa,CAAA,CAAA;AAqCxC,MAAM,OAAU,GAAA,UAAA;AAAA,EACrB,SAASA,QACP,CAAA;AAAA,IACE,cAAc,SAAY,GAAA,SAAA;AAAA,IAC1B,iBAAoB,GAAA,GAAA;AAAA,IACpB,gBAAmB,GAAA,GAAA;AAAA,IACnB,yBAAyB,CAAY,SAAA,EAAA,SAAA,CAAA,CAAA;AAAA,IACrC,gBAAA;AAAA,IACA,IAAO,GAAA,KAAA;AAAA,IACP,SAAA;AAAA,IACA,IAAO,GAAA,SAAA;AAAA,IACP,EAAI,EAAA,MAAA;AAAA,IACD,GAAA,IAAA;AAAA,KAEL,GACA,EAAA;AACA,IAAM,MAAA,EAAA,GAAK,MAAM,MAAM,CAAA,CAAA;AACvB,IAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,cAAA;AAAA,MACR,GAAK,EAAAC,QAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAM,MAAA,EAAE,QAAS,EAAA,GAAI,gBAAiB,EAAA,CAAA;AAEtC,IAAA,SAAA,CAAU,MAAM;AACd,MAAI,IAAA,gBAAA;AAAkB,QAAA,OAAA;AAEtB,MAAA,QAAA,CAAS,SAAS,CAAA,CAAA;AAElB,MAAA,MAAM,SAAY,GAAA,IAAI,IAAK,EAAA,CAAE,OAAQ,EAAA,CAAA;AAErC,MAAA,MAAM,QACJ,GAAA,iBAAA,GAAoB,CACpB,IAAA,WAAA,CAAY,MAAM;AAChB,QAAA,IAAI,IAAI,IAAK,EAAA,CAAE,OAAQ,EAAA,GAAI,YAAY,gBAAkB,EAAA;AAEvD,UAAA,QAAA;AAAA,YACE,CAAG,EAAA,SAAA,CAAA,mDAAA,CAAA;AAAA,WACL,CAAA;AACA,UAAA,QAAA,IAAY,cAAc,QAAQ,CAAA,CAAA;AAClC,UAAA,OAAA;AAAA,SACF;AACA,QAAA,QAAA,CAAS,SAAS,CAAA,CAAA;AAAA,SACjB,iBAAiB,CAAA,CAAA;AAEtB,MAAA,OAAO,MAAM;AACX,QAAI,IAAA,gBAAA;AAAkB,UAAA,OAAA;AAEtB,QAAA,QAAA,IAAY,cAAc,QAAQ,CAAA,CAAA;AAClC,QAAA,IAAI,sBAAwB,EAAA;AAC1B,UAAA,QAAA,CAAS,sBAAsB,CAAA,CAAA;AAAA,SACjC;AAAA,OACF,CAAA;AAAA,KACC,EAAA;AAAA,MACD,QAAA;AAAA,MACA,iBAAA;AAAA,MACA,gBAAA;AAAA,MACA,SAAA;AAAA,MACA,sBAAA;AAAA,MACA,gBAAA;AAAA,KACD,CAAA,CAAA;AAED,IAAA,uBACG,GAAA,CAAA,KAAA,EAAA;AAAA,MACC,YAAY,EAAA,SAAA;AAAA,MACZ,WAAW,IAAK,CAAA,YAAA,IAAgB,YAAa,CAAA,IAAI,GAAG,SAAS,CAAA;AAAA,MAC7D,GAAA;AAAA,MACA,IAAA;AAAA,MACC,GAAG,IAAA;AAAA,MAEJ,QAAC,kBAAA,GAAA,CAAA,UAAA,EAAA;AAAA,QAAW,EAAA;AAAA,OAAQ,CAAA;AAAA,KACtB,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
2
|
import 'react';
|
|
3
3
|
import { makePrefixer } from '../../utils/makePrefixer.js';
|
|
4
|
-
import '../../utils/useFloatingUI.js';
|
|
4
|
+
import '../../utils/useFloatingUI/useFloatingUI.js';
|
|
5
5
|
import '../../utils/useId.js';
|
|
6
6
|
import '../../salt-provider/SaltProvider.js';
|
|
7
7
|
import '../../viewport/ViewportProvider.js';
|
|
@@ -2,7 +2,7 @@ import { jsx } from 'react/jsx-runtime';
|
|
|
2
2
|
import { forwardRef } from 'react';
|
|
3
3
|
import { FlexLayout } from '../flex-layout/FlexLayout.js';
|
|
4
4
|
import { makePrefixer } from '../utils/makePrefixer.js';
|
|
5
|
-
import '../utils/useFloatingUI.js';
|
|
5
|
+
import '../utils/useFloatingUI/useFloatingUI.js';
|
|
6
6
|
import '../utils/useId.js';
|
|
7
7
|
import { useResponsiveProp } from '../utils/useResponsiveProp.js';
|
|
8
8
|
import { clsx } from 'clsx';
|
|
@@ -4,7 +4,7 @@ import { forwardRef } from 'react';
|
|
|
4
4
|
import { useComponentCssInjection } from '@salt-ds/styles';
|
|
5
5
|
import { useWindow } from '@salt-ds/window';
|
|
6
6
|
import { makePrefixer } from '../utils/makePrefixer.js';
|
|
7
|
-
import '../utils/useFloatingUI.js';
|
|
7
|
+
import '../utils/useFloatingUI/useFloatingUI.js';
|
|
8
8
|
import '../utils/useId.js';
|
|
9
9
|
import '../salt-provider/SaltProvider.js';
|
|
10
10
|
import '../viewport/ViewportProvider.js';
|
|
@@ -3,7 +3,7 @@ import { DEFAULT_ICON_SIZE, ErrorSolidIcon, SuccessTickIcon, WarningSolidIcon, I
|
|
|
3
3
|
import { clsx } from 'clsx';
|
|
4
4
|
import { forwardRef } from 'react';
|
|
5
5
|
import { makePrefixer } from '../utils/makePrefixer.js';
|
|
6
|
-
import '../utils/useFloatingUI.js';
|
|
6
|
+
import '../utils/useFloatingUI/useFloatingUI.js';
|
|
7
7
|
import '../utils/useId.js';
|
|
8
8
|
import '../salt-provider/SaltProvider.js';
|
|
9
9
|
import '../viewport/ViewportProvider.js';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ValidationStatus.js","sources":["../src/status-indicator/ValidationStatus.ts"],"sourcesContent":["export const VALIDATION_NAMED_STATUS = [\n \"error\",\n \"warning\",\n \"success\",\n \"info\",\n] as const;\n\nexport type ValidationStatus = typeof VALIDATION_NAMED_STATUS[number];\n"],"names":[],"mappings":"AAAO,MAAM,uBAA0B,GAAA;AAAA,EACrC,OAAA;AAAA,EACA,SAAA;AAAA,EACA,SAAA;AAAA,EACA,MAAA;AACF;;;;"}
|
|
1
|
+
{"version":3,"file":"ValidationStatus.js","sources":["../src/status-indicator/ValidationStatus.ts"],"sourcesContent":["export const VALIDATION_NAMED_STATUS = [\n \"error\",\n \"warning\",\n \"success\",\n \"info\",\n] as const;\n\nexport type ValidationStatus = (typeof VALIDATION_NAMED_STATUS)[number];\n"],"names":[],"mappings":"AAAO,MAAM,uBAA0B,GAAA;AAAA,EACrC,OAAA;AAAA,EACA,SAAA;AAAA,EACA,SAAA;AAAA,EACA,MAAA;AACF;;;;"}
|
package/dist-es/text/Display.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { jsx } from 'react/jsx-runtime';
|
|
2
2
|
import { forwardRef } from 'react';
|
|
3
3
|
import { makePrefixer } from '../utils/makePrefixer.js';
|
|
4
|
-
import '../utils/useFloatingUI.js';
|
|
4
|
+
import '../utils/useFloatingUI/useFloatingUI.js';
|
|
5
5
|
import '../utils/useId.js';
|
|
6
6
|
import '../salt-provider/SaltProvider.js';
|
|
7
7
|
import '../viewport/ViewportProvider.js';
|
package/dist-es/text/Text.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { jsx } from 'react/jsx-runtime';
|
|
2
2
|
import { forwardRef } from 'react';
|
|
3
3
|
import { makePrefixer } from '../utils/makePrefixer.js';
|
|
4
|
-
import '../utils/useFloatingUI.js';
|
|
4
|
+
import '../utils/useFloatingUI/useFloatingUI.js';
|
|
5
5
|
import '../utils/useId.js';
|
|
6
6
|
import '../salt-provider/SaltProvider.js';
|
|
7
7
|
import '../viewport/ViewportProvider.js';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Density.js","sources":["../src/theme/Density.ts"],"sourcesContent":["export const DensityValues = [\"high\", \"medium\", \"low\", \"touch\"] as const;\n\nexport type Density = typeof DensityValues[number];\n"],"names":[],"mappings":"AAAO,MAAM,aAAgB,GAAA,CAAC,MAAQ,EAAA,QAAA,EAAU,OAAO,OAAO;;;;"}
|
|
1
|
+
{"version":3,"file":"Density.js","sources":["../src/theme/Density.ts"],"sourcesContent":["export const DensityValues = [\"high\", \"medium\", \"low\", \"touch\"] as const;\n\nexport type Density = (typeof DensityValues)[number];\n"],"names":[],"mappings":"AAAO,MAAM,aAAgB,GAAA,CAAC,MAAQ,EAAA,QAAA,EAAU,OAAO,OAAO;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Mode.js","sources":["../src/theme/Mode.ts"],"sourcesContent":["export const ModeValues = [\"light\", \"dark\"] as const;\n\nexport type Mode = typeof ModeValues[number];\n"],"names":[],"mappings":"AAAa,MAAA,UAAA,GAAa,CAAC,OAAA,EAAS,MAAM;;;;"}
|
|
1
|
+
{"version":3,"file":"Mode.js","sources":["../src/theme/Mode.ts"],"sourcesContent":["export const ModeValues = [\"light\", \"dark\"] as const;\n\nexport type Mode = (typeof ModeValues)[number];\n"],"names":[],"mappings":"AAAa,MAAA,UAAA,GAAa,CAAC,OAAA,EAAS,MAAM;;;;"}
|
package/dist-es/toast/Toast.js
CHANGED
|
@@ -4,7 +4,7 @@ import { forwardRef, useRef, useLayoutEffect } from 'react';
|
|
|
4
4
|
import { useWindow } from '@salt-ds/window';
|
|
5
5
|
import { useComponentCssInjection } from '@salt-ds/styles';
|
|
6
6
|
import { makePrefixer } from '../utils/makePrefixer.js';
|
|
7
|
-
import '../utils/useFloatingUI.js';
|
|
7
|
+
import '../utils/useFloatingUI/useFloatingUI.js';
|
|
8
8
|
import { useForkRef } from '../utils/useForkRef.js';
|
|
9
9
|
import '../utils/useId.js';
|
|
10
10
|
import '../salt-provider/SaltProvider.js';
|
|
@@ -4,7 +4,7 @@ import { forwardRef } from 'react';
|
|
|
4
4
|
import { useWindow } from '@salt-ds/window';
|
|
5
5
|
import { useComponentCssInjection } from '@salt-ds/styles';
|
|
6
6
|
import { makePrefixer } from '../utils/makePrefixer.js';
|
|
7
|
-
import '../utils/useFloatingUI.js';
|
|
7
|
+
import '../utils/useFloatingUI/useFloatingUI.js';
|
|
8
8
|
import '../utils/useId.js';
|
|
9
9
|
import '../salt-provider/SaltProvider.js';
|
|
10
10
|
import '../viewport/ViewportProvider.js';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ToastContent.js","sources":["../src/toast/ToastContent.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {
|
|
1
|
+
{"version":3,"file":"ToastContent.js","sources":["../src/toast/ToastContent.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n ComponentPropsWithoutRef,\n ForwardedRef,\n forwardRef,\n ReactNode,\n} from \"react\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { makePrefixer } from \"../utils\";\n\nimport toastContentCss from \"./ToastContent.css\";\n\nconst withBaseName = makePrefixer(\"saltToastContent\");\n\nexport interface ToastContentProps extends ComponentPropsWithoutRef<\"div\"> {\n /**\n * The content of Toast Content\n */\n children?: ReactNode;\n}\n\nexport const ToastContent = forwardRef(function ToastContent(\n { children, className, ...restProps }: ToastContentProps,\n ref: ForwardedRef<HTMLDivElement>\n) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-toast-content\",\n css: toastContentCss,\n window: targetWindow,\n });\n\n return (\n <div className={clsx(withBaseName(), className)} {...restProps} ref={ref}>\n {children}\n </div>\n );\n});\n"],"names":["ToastContent","toastContentCss"],"mappings":";;;;;;;;;;;;AAaA,MAAM,YAAA,GAAe,aAAa,kBAAkB,CAAA,CAAA;AASvC,MAAA,YAAA,GAAe,WAAW,SAASA,aAAAA,CAC9C,EAAE,QAAU,EAAA,SAAA,EAAA,GAAc,SAAU,EAAA,EACpC,GACA,EAAA;AACA,EAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,oBAAA;AAAA,IACR,GAAK,EAAAC,QAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,uBACG,GAAA,CAAA,KAAA,EAAA;AAAA,IAAI,SAAW,EAAA,IAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,IAAI,GAAG,SAAA;AAAA,IAAW,GAAA;AAAA,IAC7D,QAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAC;;;;"}
|
|
@@ -7,7 +7,7 @@ import { useWindow } from '@salt-ds/window';
|
|
|
7
7
|
import { useComponentCssInjection } from '@salt-ds/styles';
|
|
8
8
|
import { makePrefixer } from '../utils/makePrefixer.js';
|
|
9
9
|
import { useControlled } from '../utils/useControlled.js';
|
|
10
|
-
import '../utils/useFloatingUI.js';
|
|
10
|
+
import '../utils/useFloatingUI/useFloatingUI.js';
|
|
11
11
|
import { useForkRef } from '../utils/useForkRef.js';
|
|
12
12
|
import '../utils/useId.js';
|
|
13
13
|
import '../salt-provider/SaltProvider.js';
|
|
@@ -5,7 +5,7 @@ import { useWindow } from '@salt-ds/window';
|
|
|
5
5
|
import { useComponentCssInjection } from '@salt-ds/styles';
|
|
6
6
|
import { makePrefixer } from '../utils/makePrefixer.js';
|
|
7
7
|
import { useControlled } from '../utils/useControlled.js';
|
|
8
|
-
import '../utils/useFloatingUI.js';
|
|
8
|
+
import '../utils/useFloatingUI/useFloatingUI.js';
|
|
9
9
|
import { useForkRef } from '../utils/useForkRef.js';
|
|
10
10
|
import '../utils/useId.js';
|
|
11
11
|
import '../salt-provider/SaltProvider.js';
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { useContext } from 'react';
|
|
2
2
|
import { createContext } from '../utils/createContext.js';
|
|
3
|
-
import '../utils/useFloatingUI.js';
|
|
3
|
+
import '../utils/useFloatingUI/useFloatingUI.js';
|
|
4
4
|
import '../utils/useId.js';
|
|
5
5
|
import '../salt-provider/SaltProvider.js';
|
|
6
6
|
import '../viewport/ViewportProvider.js';
|