@salt-ds/lab 1.0.0-alpha.33 → 1.0.0-alpha.34

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (124) hide show
  1. package/css/salt-lab.css +106 -223
  2. package/dist-cjs/calendar/Calendar.css.js +1 -1
  3. package/dist-cjs/calendar/internal/CalendarCarousel.css.js +1 -1
  4. package/dist-cjs/calendar/internal/CalendarCarousel.js +5 -29
  5. package/dist-cjs/calendar/internal/CalendarCarousel.js.map +1 -1
  6. package/dist-cjs/calendar/internal/CalendarContext.js.map +1 -1
  7. package/dist-cjs/calendar/internal/CalendarDay.css.js +1 -1
  8. package/dist-cjs/calendar/internal/CalendarDay.js +18 -19
  9. package/dist-cjs/calendar/internal/CalendarDay.js.map +1 -1
  10. package/dist-cjs/calendar/internal/CalendarMonth.css.js +1 -1
  11. package/dist-cjs/calendar/internal/CalendarMonth.js +0 -2
  12. package/dist-cjs/calendar/internal/CalendarMonth.js.map +1 -1
  13. package/dist-cjs/calendar/internal/CalendarNavigation.css.js +1 -1
  14. package/dist-cjs/calendar/internal/CalendarNavigation.js +74 -81
  15. package/dist-cjs/calendar/internal/CalendarNavigation.js.map +1 -1
  16. package/dist-cjs/calendar/internal/CalendarWeekHeader.css.js +1 -1
  17. package/dist-cjs/calendar/useCalendar.js +14 -8
  18. package/dist-cjs/calendar/useCalendar.js.map +1 -1
  19. package/dist-cjs/calendar/useCalendarDay.js +15 -5
  20. package/dist-cjs/calendar/useCalendarDay.js.map +1 -1
  21. package/dist-cjs/calendar/useSelection.js.map +1 -1
  22. package/dist-cjs/combo-box-next/ComboBoxNext.js +36 -13
  23. package/dist-cjs/combo-box-next/ComboBoxNext.js.map +1 -1
  24. package/dist-cjs/combo-box-next/useComboBoxNext.js +16 -15
  25. package/dist-cjs/combo-box-next/useComboBoxNext.js.map +1 -1
  26. package/dist-cjs/dialog/Dialog.css.js +1 -1
  27. package/dist-cjs/dialog/DialogHeader.css.js +6 -0
  28. package/dist-cjs/dialog/DialogHeader.css.js.map +1 -0
  29. package/dist-cjs/dialog/{DialogTitle.js → DialogHeader.js} +16 -16
  30. package/dist-cjs/dialog/DialogHeader.js.map +1 -0
  31. package/dist-cjs/dropdown-next/DropdownNext.js +7 -8
  32. package/dist-cjs/dropdown-next/DropdownNext.js.map +1 -1
  33. package/dist-cjs/index.js +2 -6
  34. package/dist-cjs/index.js.map +1 -1
  35. package/dist-cjs/list-control/ListControlContext.js +3 -1
  36. package/dist-cjs/list-control/ListControlContext.js.map +1 -1
  37. package/dist-cjs/list-control/ListControlState.js +16 -18
  38. package/dist-cjs/list-control/ListControlState.js.map +1 -1
  39. package/dist-cjs/option/Option.css.js +1 -1
  40. package/dist-cjs/option/Option.js +10 -20
  41. package/dist-cjs/option/Option.js.map +1 -1
  42. package/dist-cjs/overlay/Overlay.css.js +1 -1
  43. package/dist-es/calendar/Calendar.css.js +1 -1
  44. package/dist-es/calendar/internal/CalendarCarousel.css.js +1 -1
  45. package/dist-es/calendar/internal/CalendarCarousel.js +5 -29
  46. package/dist-es/calendar/internal/CalendarCarousel.js.map +1 -1
  47. package/dist-es/calendar/internal/CalendarContext.js.map +1 -1
  48. package/dist-es/calendar/internal/CalendarDay.css.js +1 -1
  49. package/dist-es/calendar/internal/CalendarDay.js +20 -21
  50. package/dist-es/calendar/internal/CalendarDay.js.map +1 -1
  51. package/dist-es/calendar/internal/CalendarMonth.css.js +1 -1
  52. package/dist-es/calendar/internal/CalendarMonth.js +0 -2
  53. package/dist-es/calendar/internal/CalendarMonth.js.map +1 -1
  54. package/dist-es/calendar/internal/CalendarNavigation.css.js +1 -1
  55. package/dist-es/calendar/internal/CalendarNavigation.js +75 -82
  56. package/dist-es/calendar/internal/CalendarNavigation.js.map +1 -1
  57. package/dist-es/calendar/internal/CalendarWeekHeader.css.js +1 -1
  58. package/dist-es/calendar/useCalendar.js +14 -8
  59. package/dist-es/calendar/useCalendar.js.map +1 -1
  60. package/dist-es/calendar/useCalendarDay.js +15 -5
  61. package/dist-es/calendar/useCalendarDay.js.map +1 -1
  62. package/dist-es/calendar/useSelection.js.map +1 -1
  63. package/dist-es/combo-box-next/ComboBoxNext.js +36 -13
  64. package/dist-es/combo-box-next/ComboBoxNext.js.map +1 -1
  65. package/dist-es/combo-box-next/useComboBoxNext.js +16 -15
  66. package/dist-es/combo-box-next/useComboBoxNext.js.map +1 -1
  67. package/dist-es/dialog/Dialog.css.js +1 -1
  68. package/dist-es/dialog/DialogHeader.css.js +4 -0
  69. package/dist-es/dialog/DialogHeader.css.js.map +1 -0
  70. package/dist-es/dialog/{DialogTitle.js → DialogHeader.js} +16 -16
  71. package/dist-es/dialog/DialogHeader.js.map +1 -0
  72. package/dist-es/dropdown-next/DropdownNext.js +8 -9
  73. package/dist-es/dropdown-next/DropdownNext.js.map +1 -1
  74. package/dist-es/index.js +1 -3
  75. package/dist-es/index.js.map +1 -1
  76. package/dist-es/list-control/ListControlContext.js +3 -1
  77. package/dist-es/list-control/ListControlContext.js.map +1 -1
  78. package/dist-es/list-control/ListControlState.js +16 -19
  79. package/dist-es/list-control/ListControlState.js.map +1 -1
  80. package/dist-es/option/Option.css.js +1 -1
  81. package/dist-es/option/Option.js +11 -21
  82. package/dist-es/option/Option.js.map +1 -1
  83. package/dist-es/overlay/Overlay.css.js +1 -1
  84. package/dist-types/calendar/internal/CalendarContext.d.ts +2 -2
  85. package/dist-types/calendar/internal/CalendarNavigation.d.ts +3 -7
  86. package/dist-types/calendar/useCalendarDay.d.ts +7 -4
  87. package/dist-types/calendar/useSelection.d.ts +4 -4
  88. package/dist-types/combo-box-next/ComboBoxNext.d.ts +7 -10
  89. package/dist-types/combo-box-next/useComboBoxNext.d.ts +6 -4
  90. package/dist-types/dialog/DialogHeader.d.ts +22 -0
  91. package/dist-types/dialog/index.d.ts +1 -1
  92. package/dist-types/dropdown-next/DropdownNext.d.ts +49 -7
  93. package/dist-types/index.d.ts +0 -1
  94. package/dist-types/list-control/ListControlContext.d.ts +1 -1
  95. package/dist-types/list-control/ListControlState.d.ts +14 -12
  96. package/dist-types/option/Option.d.ts +0 -4
  97. package/package.json +2 -2
  98. package/dist-cjs/dialog/DialogTitle.css.js +0 -6
  99. package/dist-cjs/dialog/DialogTitle.css.js.map +0 -1
  100. package/dist-cjs/dialog/DialogTitle.js.map +0 -1
  101. package/dist-cjs/drawer/Drawer.css.js +0 -6
  102. package/dist-cjs/drawer/Drawer.css.js.map +0 -1
  103. package/dist-cjs/drawer/Drawer.js +0 -104
  104. package/dist-cjs/drawer/Drawer.js.map +0 -1
  105. package/dist-cjs/drawer/DrawerCloseButton.css.js +0 -6
  106. package/dist-cjs/drawer/DrawerCloseButton.css.js.map +0 -1
  107. package/dist-cjs/drawer/DrawerCloseButton.js +0 -44
  108. package/dist-cjs/drawer/DrawerCloseButton.js.map +0 -1
  109. package/dist-es/dialog/DialogTitle.css.js +0 -4
  110. package/dist-es/dialog/DialogTitle.css.js.map +0 -1
  111. package/dist-es/dialog/DialogTitle.js.map +0 -1
  112. package/dist-es/drawer/Drawer.css.js +0 -4
  113. package/dist-es/drawer/Drawer.css.js.map +0 -1
  114. package/dist-es/drawer/Drawer.js +0 -100
  115. package/dist-es/drawer/Drawer.js.map +0 -1
  116. package/dist-es/drawer/DrawerCloseButton.css.js +0 -4
  117. package/dist-es/drawer/DrawerCloseButton.css.js.map +0 -1
  118. package/dist-es/drawer/DrawerCloseButton.js +0 -36
  119. package/dist-es/drawer/DrawerCloseButton.js.map +0 -1
  120. package/dist-types/calendar/useCalendar.d.ts +0 -60
  121. package/dist-types/dialog/DialogTitle.d.ts +0 -22
  122. package/dist-types/drawer/Drawer.d.ts +0 -28
  123. package/dist-types/drawer/DrawerCloseButton.d.ts +0 -2
  124. package/dist-types/drawer/index.d.ts +0 -2
@@ -1 +0,0 @@
1
- {"version":3,"file":"Drawer.js","sources":["../src/drawer/Drawer.tsx"],"sourcesContent":["import {\n ComponentPropsWithoutRef,\n forwardRef,\n useEffect,\n useState,\n PropsWithChildren,\n} from \"react\";\nimport { clsx } from \"clsx\";\nimport { useClick, useDismiss, useInteractions } from \"@floating-ui/react\";\nimport {\n makePrefixer,\n Scrim,\n useFloatingComponent,\n useFloatingUI,\n useForkRef,\n} from \"@salt-ds/core\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport drawerCss from \"./Drawer.css\";\n\ninterface ConditionalScrimWrapperProps extends PropsWithChildren {\n condition: boolean;\n}\n\nconst ConditionalScrimWrapper = ({\n condition,\n children,\n}: ConditionalScrimWrapperProps) => {\n return condition ? <Scrim fixed> {children} </Scrim> : <>{children} </>;\n};\n\nexport interface DrawerProps extends ComponentPropsWithoutRef<\"div\"> {\n /**\n * Defines the drawer position within the screen. Defaults to `left`.\n */\n position?: \"left\" | \"top\" | \"right\" | \"bottom\";\n /**\n * Display or hide the component.\n */\n open?: boolean;\n /**\n * Callback function triggered when open state changes.\n */\n onOpenChange?: (newOpen: boolean) => void;\n /**\n * Change background color palette\n */\n variant?: \"primary\" | \"secondary\";\n /**\n * Prevent the dialog closing on click away\n * */\n disableDismiss?: boolean;\n /**\n * Prevent Scrim from rendering\n * */\n disableScrim?: boolean;\n}\n\nconst withBaseName = makePrefixer(\"saltDrawer\");\n\nexport const Drawer = forwardRef<HTMLDivElement, DrawerProps>(function Drawer(\n props,\n ref\n) {\n const {\n children,\n className,\n position = \"left\",\n open = false,\n onOpenChange,\n variant = \"primary\",\n disableDismiss,\n disableScrim,\n ...rest\n } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-drawer\",\n css: drawerCss,\n window: targetWindow,\n });\n\n const [showComponent, setShowComponent] = useState(false);\n const { Component: FloatingComponent } = useFloatingComponent();\n\n const { context, floating, elements } = useFloatingUI({\n open,\n onOpenChange,\n });\n\n const { getFloatingProps } = useInteractions([\n useClick(context),\n useDismiss(context, { enabled: !disableDismiss }),\n ]);\n\n const handleRef = useForkRef<HTMLDivElement>(floating, ref);\n\n useEffect(() => {\n if (open && !showComponent) {\n setShowComponent(true);\n }\n\n if (!open && showComponent) {\n const animate = setTimeout(() => {\n setShowComponent(false);\n }, 300); // var(--salt-duration-perceptible)\n return () => clearTimeout(animate);\n }\n }, [open, showComponent, setShowComponent]);\n\n return (\n <ConditionalScrimWrapper condition={open && !disableScrim}>\n <FloatingComponent\n open={showComponent}\n ref={handleRef}\n role={\"dialog\"}\n width={elements.floating?.offsetWidth}\n height={elements.floating?.offsetHeight}\n aria-modal=\"true\"\n focusManagerProps={{\n context: context,\n }}\n className={clsx(\n withBaseName(),\n withBaseName(position),\n {\n [withBaseName(\"enterAnimation\")]: open,\n [withBaseName(\"exitAnimation\")]: !open,\n [withBaseName(variant)]: variant,\n },\n className\n )}\n {...getFloatingProps()}\n {...rest}\n >\n {children}\n </FloatingComponent>\n </ConditionalScrimWrapper>\n );\n});\n"],"names":["jsxs","Scrim","Fragment","makePrefixer","forwardRef","Drawer","useWindow","useComponentCssInjection","drawerCss","useState","useFloatingComponent","useFloatingUI","useInteractions","useClick","useDismiss","useForkRef","useEffect","jsx","clsx"],"mappings":"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"}
@@ -1,6 +0,0 @@
1
- 'use strict';
2
-
3
- var css_248z = ".saltDrawerCloseButton-container {\n position: relative;\n display: flex;\n justify-content: flex-end;\n}\n\n.saltButton-secondary.saltDrawerCloseButton {\n position: fixed;\n margin-top: calc(var(--salt-spacing-300) * -1);\n margin-right: calc(var(--salt-spacing-300) * -1);\n}\n";
4
-
5
- module.exports = css_248z;
6
- //# sourceMappingURL=DrawerCloseButton.css.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"DrawerCloseButton.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}
@@ -1,44 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- var jsxRuntime = require('react/jsx-runtime');
6
- var React = require('react');
7
- var clsx = require('clsx');
8
- var core = require('@salt-ds/core');
9
- var window = require('@salt-ds/window');
10
- var styles = require('@salt-ds/styles');
11
- var icons = require('@salt-ds/icons');
12
- var DrawerCloseButton$1 = require('./DrawerCloseButton.css.js');
13
-
14
- function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
15
-
16
- var clsx__default = /*#__PURE__*/_interopDefaultLegacy(clsx);
17
-
18
- const withBaseName = core.makePrefixer("saltDrawerCloseButton");
19
- const DrawerCloseButton = React.forwardRef(
20
- function DrawerCloseButton2({ className, ...rest }, ref) {
21
- const targetWindow = window.useWindow();
22
- styles.useComponentCssInjection({
23
- testId: "salt-drawer-close-button",
24
- css: DrawerCloseButton$1,
25
- window: targetWindow
26
- });
27
- return /* @__PURE__ */ jsxRuntime.jsx("div", {
28
- className: withBaseName("container"),
29
- children: /* @__PURE__ */ jsxRuntime.jsx(core.Button, {
30
- ref,
31
- "aria-label": "Close Drawer",
32
- variant: "secondary",
33
- className: clsx__default["default"](withBaseName(), className),
34
- ...rest,
35
- children: /* @__PURE__ */ jsxRuntime.jsx(icons.CloseIcon, {
36
- "aria-hidden": true
37
- })
38
- })
39
- });
40
- }
41
- );
42
-
43
- exports.DrawerCloseButton = DrawerCloseButton;
44
- //# sourceMappingURL=DrawerCloseButton.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"DrawerCloseButton.js","sources":["../src/drawer/DrawerCloseButton.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport clsx from \"clsx\";\nimport { Button, ButtonProps, makePrefixer } from \"@salt-ds/core\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { CloseIcon } from \"@salt-ds/icons\";\n\nimport drawerCloseButtonCss from \"./DrawerCloseButton.css\";\n\nconst withBaseName = makePrefixer(\"saltDrawerCloseButton\");\n\nexport const DrawerCloseButton = forwardRef<HTMLButtonElement, ButtonProps>(\n function DrawerCloseButton({ className, ...rest }, ref) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-drawer-close-button\",\n css: drawerCloseButtonCss,\n window: targetWindow,\n });\n\n return (\n <div className={withBaseName(\"container\")}>\n <Button\n ref={ref}\n aria-label=\"Close Drawer\"\n variant=\"secondary\"\n className={clsx(withBaseName(), className)}\n {...rest}\n >\n <CloseIcon aria-hidden />\n </Button>\n </div>\n );\n }\n);\n"],"names":["makePrefixer","forwardRef","DrawerCloseButton","useWindow","useComponentCssInjection","drawerCloseButtonCss","jsx","Button","clsx","CloseIcon"],"mappings":";;;;;;;;;;;;;;;;;AASA,MAAM,YAAA,GAAeA,kBAAa,uBAAuB,CAAA,CAAA;AAElD,MAAM,iBAAoB,GAAAC,gBAAA;AAAA,EAC/B,SAASC,kBAAkB,CAAA,EAAE,SAAc,EAAA,GAAA,IAAA,IAAQ,GAAK,EAAA;AACtD,IAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,0BAAA;AAAA,MACR,GAAK,EAAAC,mBAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,uBACGC,cAAA,CAAA,KAAA,EAAA;AAAA,MAAI,SAAA,EAAW,aAAa,WAAW,CAAA;AAAA,MACtC,QAAC,kBAAAA,cAAA,CAAAC,WAAA,EAAA;AAAA,QACC,GAAA;AAAA,QACA,YAAW,EAAA,cAAA;AAAA,QACX,OAAQ,EAAA,WAAA;AAAA,QACR,SAAW,EAAAC,wBAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,QACxC,GAAG,IAAA;AAAA,QAEJ,QAAC,kBAAAF,cAAA,CAAAG,eAAA,EAAA;AAAA,UAAU,aAAW,EAAA,IAAA;AAAA,SAAC,CAAA;AAAA,OACzB,CAAA;AAAA,KACF,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
@@ -1,4 +0,0 @@
1
- var css_248z = "/* Styles applied to the root element */\n.saltDialogTitle {\n padding-bottom: var(--salt-spacing-100);\n padding-left: var(--salt-spacing-300);\n padding-right: var(--salt-spacing-300);\n align-items: center;\n display: flex;\n flex-direction: row;\n gap: var(--salt-spacing-100);\n box-sizing: border-box;\n}\n\n.saltDialogTitle-title {\n margin: 0;\n}\n\n/* Styles applied to the status indicator icon overriding its default size */\n.saltDialogTitle .saltStatusIndicator.saltIcon {\n --icon-size: var(--salt-text-h2-lineHeight);\n}\n\n/* Styles applied to DialogTitle when accent={true} */\n.saltDialogTitle-withAccent {\n position: relative;\n}\n\n.saltDialogTitle-withAccent::before {\n content: \"\";\n position: absolute;\n top: 0;\n left: 0;\n bottom: var(--salt-spacing-100);\n width: var(--salt-size-accent);\n background: var(--salt-accent-background);\n}\n\n.saltDialogTitle-error::before {\n background: var(--salt-status-error-borderColor);\n}\n\n.saltDialogTitle-info::before {\n background: var(--salt-status-info-borderColor);\n}\n\n.saltDialogTitle-success::before {\n background: var(--salt-status-success-borderColor);\n}\n\n.saltDialogTitle-warning::before {\n background: var(--salt-status-warning-borderColor);\n}\n";
2
-
3
- export { css_248z as default };
4
- //# sourceMappingURL=DialogTitle.css.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"DialogTitle.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"DialogTitle.js","sources":["../src/dialog/DialogTitle.tsx"],"sourcesContent":["import { ReactNode, ComponentPropsWithoutRef } from \"react\";\nimport clsx from \"clsx\";\nimport {\n H2,\n StatusIndicator,\n ValidationStatus,\n makePrefixer,\n Text,\n} from \"@salt-ds/core\";\nimport { useDialogContext } from \"./DialogContext\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport dialogTitleCss from \"./DialogTitle.css\";\n\nconst withBaseName = makePrefixer(\"saltDialogTitle\");\n\ninterface DialogTitleProps\n extends Omit<ComponentPropsWithoutRef<\"div\">, \"title\"> {\n /**\n * The status of the Dialog\n */\n status?: ValidationStatus | undefined;\n /**\n * Displays the accent bar in the Dialog Title */\n disableAccent?: boolean;\n /**\n * Displays the Dialog Title in a H2 component\n */\n title: ReactNode;\n /**\n * Displays the Dialog Subtitle in a Label component\n **/\n subtitle?: ReactNode;\n\n className?: string;\n}\n\nexport const DialogTitle = ({\n className,\n title,\n subtitle,\n disableAccent,\n status: statusProp,\n ...rest\n}: DialogTitleProps) => {\n const { status: statusContext, id } = useDialogContext();\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-dialog-title\",\n css: dialogTitleCss,\n window: targetWindow,\n });\n\n const status = statusProp ?? (statusContext as ValidationStatus);\n\n return (\n <div\n id={id as string}\n className={clsx(\n withBaseName(),\n {\n [withBaseName(\"withAccent\")]: !disableAccent && !status,\n [withBaseName(status)]: !!status,\n },\n className\n )}\n {...rest}\n >\n {status && <StatusIndicator status={status} />}\n <div>\n {subtitle && (\n <Text as={\"label\"} variant=\"secondary\">\n {subtitle}\n </Text>\n )}\n <H2 className={clsx(withBaseName(\"title\"))}>{title}</H2>\n </div>\n </div>\n );\n};\n"],"names":["dialogTitleCss"],"mappings":";;;;;;;;AAcA,MAAM,YAAA,GAAe,aAAa,iBAAiB,CAAA,CAAA;AAuB5C,MAAM,cAAc,CAAC;AAAA,EAC1B,SAAA;AAAA,EACA,KAAA;AAAA,EACA,QAAA;AAAA,EACA,aAAA;AAAA,EACA,MAAQ,EAAA,UAAA;AAAA,EACL,GAAA,IAAA;AACL,CAAwB,KAAA;AACtB,EAAA,MAAM,EAAE,MAAA,EAAQ,aAAe,EAAA,EAAA,KAAO,gBAAiB,EAAA,CAAA;AACvD,EAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,mBAAA;AAAA,IACR,GAAK,EAAAA,QAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,MAAM,SAAS,UAAe,IAAA,IAAA,GAAA,UAAA,GAAA,aAAA,CAAA;AAE9B,EAAA,uBACG,IAAA,CAAA,KAAA,EAAA;AAAA,IACC,EAAA;AAAA,IACA,SAAW,EAAA,IAAA;AAAA,MACT,YAAa,EAAA;AAAA,MACb;AAAA,QACE,CAAC,YAAa,CAAA,YAAY,CAAI,GAAA,CAAC,iBAAiB,CAAC,MAAA;AAAA,QACjD,CAAC,YAAA,CAAa,MAAM,CAAA,GAAI,CAAC,CAAC,MAAA;AAAA,OAC5B;AAAA,MACA,SAAA;AAAA,KACF;AAAA,IACC,GAAG,IAAA;AAAA,IAEH,QAAA,EAAA;AAAA,MAAA,MAAA,oBAAW,GAAA,CAAA,eAAA,EAAA;AAAA,QAAgB,MAAA;AAAA,OAAgB,CAAA;AAAA,sBAC3C,IAAA,CAAA,KAAA,EAAA;AAAA,QACE,QAAA,EAAA;AAAA,UAAA,QAAA,oBACE,GAAA,CAAA,IAAA,EAAA;AAAA,YAAK,EAAI,EAAA,OAAA;AAAA,YAAS,OAAQ,EAAA,WAAA;AAAA,YACxB,QAAA,EAAA,QAAA;AAAA,WACH,CAAA;AAAA,0BAED,GAAA,CAAA,EAAA,EAAA;AAAA,YAAG,SAAW,EAAA,IAAA,CAAK,YAAa,CAAA,OAAO,CAAC,CAAA;AAAA,YAAI,QAAA,EAAA,KAAA;AAAA,WAAM,CAAA;AAAA,SAAA;AAAA,OACrD,CAAA;AAAA,KAAA;AAAA,GACF,CAAA,CAAA;AAEJ;;;;"}
@@ -1,4 +0,0 @@
1
- var css_248z = "/* Styles applied to Drawer component */\n.saltDrawer {\n background: var(--drawer-background);\n display: flex;\n flex-direction: column;\n max-height: 100%;\n max-width: 100%;\n overflow: auto;\n padding: var(--salt-spacing-300);\n box-shadow: var(--salt-overlayable-shadow-modal);\n z-index: var(--salt-zIndex-drawer);\n position: fixed;\n top: 0;\n box-sizing: border-box;\n}\n\n/* Styles applied when variant = \"primary\" */\n.saltDrawer-primary {\n --drawer-background: var(--salt-container-primary-background);\n}\n\n/* Styles applied when variant = \"secondary\" */\n.saltDrawer-secondary {\n --drawer-background: var(--salt-container-secondary-background);\n}\n\n/* Styles applied when position = \"top\" */\n.saltDrawer-top {\n left: 0;\n right: 0;\n bottom: auto;\n}\n\n/* Styles applied when position = \"top\" and the component mounts */\n.saltDrawer-top.saltDrawer-enterAnimation {\n animation: var(--salt-animation-slide-in-bottom);\n}\n\n/* Styles applied when position = \"top\" and the component unmounts */\n.saltDrawer-top.saltDrawer-exitAnimation {\n animation: var(--salt-animation-slide-out-bottom);\n}\n\n/* Styles applied when position = \"right\" */\n.saltDrawer-right {\n left: auto;\n right: 0;\n height: 100%;\n}\n\n/* Styles applied when position = \"right\" and the component mounts */\n.saltDrawer-right.saltDrawer-enterAnimation {\n animation: var(--salt-animation-slide-in-right);\n}\n\n/* Styles applied when position = \"right\" and the component unmounts */\n.saltDrawer-right.saltDrawer-exitAnimation {\n animation: var(--salt-animation-slide-out-right);\n}\n\n/* Styles applied when position = \"left\" */\n.saltDrawer-left {\n left: 0;\n right: auto;\n height: 100%;\n}\n\n/* Styles applied when position = \"left\" and the component mounts */\n.saltDrawer-left.saltDrawer-enterAnimation {\n animation: var(--salt-animation-slide-in-left);\n}\n\n/* Styles applied when position = \"left\" and the component unmounts */\n.saltDrawer-left.saltDrawer-exitAnimation {\n animation: var(--salt-animation-slide-out-left);\n}\n\n/* Styles applied when position = \"bottom\" */\n.saltDrawer-bottom {\n left: 0;\n right: 0;\n bottom: 0;\n top: auto;\n}\n\n/* Styles applied when position = \"bottom\" and the component mounts */\n.saltDrawer-bottom.saltDrawer-enterAnimation {\n animation: var(--salt-animation-slide-in-top);\n}\n\n/* Styles applied when position = \"bottom\" and the component unmounts */\n.saltDrawer-bottom.saltDrawer-exitAnimation {\n animation: var(--salt-animation-slide-out-top);\n}\n";
2
-
3
- export { css_248z as default };
4
- //# sourceMappingURL=Drawer.css.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Drawer.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
@@ -1,100 +0,0 @@
1
- import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
2
- import { forwardRef, useState, useEffect } from 'react';
3
- import { clsx } from 'clsx';
4
- import { useInteractions, useClick, useDismiss } from '@floating-ui/react';
5
- import { makePrefixer, useFloatingComponent, useFloatingUI, useForkRef, Scrim } from '@salt-ds/core';
6
- import { useWindow } from '@salt-ds/window';
7
- import { useComponentCssInjection } from '@salt-ds/styles';
8
- import css_248z from './Drawer.css.js';
9
-
10
- const ConditionalScrimWrapper = ({
11
- condition,
12
- children
13
- }) => {
14
- return condition ? /* @__PURE__ */ jsxs(Scrim, {
15
- fixed: true,
16
- children: [
17
- " ",
18
- children,
19
- " "
20
- ]
21
- }) : /* @__PURE__ */ jsxs(Fragment, {
22
- children: [
23
- children,
24
- " "
25
- ]
26
- });
27
- };
28
- const withBaseName = makePrefixer("saltDrawer");
29
- const Drawer = forwardRef(function Drawer2(props, ref) {
30
- var _a, _b;
31
- const {
32
- children,
33
- className,
34
- position = "left",
35
- open = false,
36
- onOpenChange,
37
- variant = "primary",
38
- disableDismiss,
39
- disableScrim,
40
- ...rest
41
- } = props;
42
- const targetWindow = useWindow();
43
- useComponentCssInjection({
44
- testId: "salt-drawer",
45
- css: css_248z,
46
- window: targetWindow
47
- });
48
- const [showComponent, setShowComponent] = useState(false);
49
- const { Component: FloatingComponent } = useFloatingComponent();
50
- const { context, floating, elements } = useFloatingUI({
51
- open,
52
- onOpenChange
53
- });
54
- const { getFloatingProps } = useInteractions([
55
- useClick(context),
56
- useDismiss(context, { enabled: !disableDismiss })
57
- ]);
58
- const handleRef = useForkRef(floating, ref);
59
- useEffect(() => {
60
- if (open && !showComponent) {
61
- setShowComponent(true);
62
- }
63
- if (!open && showComponent) {
64
- const animate = setTimeout(() => {
65
- setShowComponent(false);
66
- }, 300);
67
- return () => clearTimeout(animate);
68
- }
69
- }, [open, showComponent, setShowComponent]);
70
- return /* @__PURE__ */ jsx(ConditionalScrimWrapper, {
71
- condition: open && !disableScrim,
72
- children: /* @__PURE__ */ jsx(FloatingComponent, {
73
- open: showComponent,
74
- ref: handleRef,
75
- role: "dialog",
76
- width: (_a = elements.floating) == null ? void 0 : _a.offsetWidth,
77
- height: (_b = elements.floating) == null ? void 0 : _b.offsetHeight,
78
- "aria-modal": "true",
79
- focusManagerProps: {
80
- context
81
- },
82
- className: clsx(
83
- withBaseName(),
84
- withBaseName(position),
85
- {
86
- [withBaseName("enterAnimation")]: open,
87
- [withBaseName("exitAnimation")]: !open,
88
- [withBaseName(variant)]: variant
89
- },
90
- className
91
- ),
92
- ...getFloatingProps(),
93
- ...rest,
94
- children
95
- })
96
- });
97
- });
98
-
99
- export { Drawer };
100
- //# sourceMappingURL=Drawer.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Drawer.js","sources":["../src/drawer/Drawer.tsx"],"sourcesContent":["import {\n ComponentPropsWithoutRef,\n forwardRef,\n useEffect,\n useState,\n PropsWithChildren,\n} from \"react\";\nimport { clsx } from \"clsx\";\nimport { useClick, useDismiss, useInteractions } from \"@floating-ui/react\";\nimport {\n makePrefixer,\n Scrim,\n useFloatingComponent,\n useFloatingUI,\n useForkRef,\n} from \"@salt-ds/core\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport drawerCss from \"./Drawer.css\";\n\ninterface ConditionalScrimWrapperProps extends PropsWithChildren {\n condition: boolean;\n}\n\nconst ConditionalScrimWrapper = ({\n condition,\n children,\n}: ConditionalScrimWrapperProps) => {\n return condition ? <Scrim fixed> {children} </Scrim> : <>{children} </>;\n};\n\nexport interface DrawerProps extends ComponentPropsWithoutRef<\"div\"> {\n /**\n * Defines the drawer position within the screen. Defaults to `left`.\n */\n position?: \"left\" | \"top\" | \"right\" | \"bottom\";\n /**\n * Display or hide the component.\n */\n open?: boolean;\n /**\n * Callback function triggered when open state changes.\n */\n onOpenChange?: (newOpen: boolean) => void;\n /**\n * Change background color palette\n */\n variant?: \"primary\" | \"secondary\";\n /**\n * Prevent the dialog closing on click away\n * */\n disableDismiss?: boolean;\n /**\n * Prevent Scrim from rendering\n * */\n disableScrim?: boolean;\n}\n\nconst withBaseName = makePrefixer(\"saltDrawer\");\n\nexport const Drawer = forwardRef<HTMLDivElement, DrawerProps>(function Drawer(\n props,\n ref\n) {\n const {\n children,\n className,\n position = \"left\",\n open = false,\n onOpenChange,\n variant = \"primary\",\n disableDismiss,\n disableScrim,\n ...rest\n } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-drawer\",\n css: drawerCss,\n window: targetWindow,\n });\n\n const [showComponent, setShowComponent] = useState(false);\n const { Component: FloatingComponent } = useFloatingComponent();\n\n const { context, floating, elements } = useFloatingUI({\n open,\n onOpenChange,\n });\n\n const { getFloatingProps } = useInteractions([\n useClick(context),\n useDismiss(context, { enabled: !disableDismiss }),\n ]);\n\n const handleRef = useForkRef<HTMLDivElement>(floating, ref);\n\n useEffect(() => {\n if (open && !showComponent) {\n setShowComponent(true);\n }\n\n if (!open && showComponent) {\n const animate = setTimeout(() => {\n setShowComponent(false);\n }, 300); // var(--salt-duration-perceptible)\n return () => clearTimeout(animate);\n }\n }, [open, showComponent, setShowComponent]);\n\n return (\n <ConditionalScrimWrapper condition={open && !disableScrim}>\n <FloatingComponent\n open={showComponent}\n ref={handleRef}\n role={\"dialog\"}\n width={elements.floating?.offsetWidth}\n height={elements.floating?.offsetHeight}\n aria-modal=\"true\"\n focusManagerProps={{\n context: context,\n }}\n className={clsx(\n withBaseName(),\n withBaseName(position),\n {\n [withBaseName(\"enterAnimation\")]: open,\n [withBaseName(\"exitAnimation\")]: !open,\n [withBaseName(variant)]: variant,\n },\n className\n )}\n {...getFloatingProps()}\n {...rest}\n >\n {children}\n </FloatingComponent>\n </ConditionalScrimWrapper>\n );\n});\n"],"names":["Drawer","drawerCss"],"mappings":"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"}
@@ -1,4 +0,0 @@
1
- var css_248z = ".saltDrawerCloseButton-container {\n position: relative;\n display: flex;\n justify-content: flex-end;\n}\n\n.saltButton-secondary.saltDrawerCloseButton {\n position: fixed;\n margin-top: calc(var(--salt-spacing-300) * -1);\n margin-right: calc(var(--salt-spacing-300) * -1);\n}\n";
2
-
3
- export { css_248z as default };
4
- //# sourceMappingURL=DrawerCloseButton.css.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"DrawerCloseButton.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
@@ -1,36 +0,0 @@
1
- import { jsx } from 'react/jsx-runtime';
2
- import { forwardRef } from 'react';
3
- import clsx from 'clsx';
4
- import { makePrefixer, Button } from '@salt-ds/core';
5
- import { useWindow } from '@salt-ds/window';
6
- import { useComponentCssInjection } from '@salt-ds/styles';
7
- import { CloseIcon } from '@salt-ds/icons';
8
- import css_248z from './DrawerCloseButton.css.js';
9
-
10
- const withBaseName = makePrefixer("saltDrawerCloseButton");
11
- const DrawerCloseButton = forwardRef(
12
- function DrawerCloseButton2({ className, ...rest }, ref) {
13
- const targetWindow = useWindow();
14
- useComponentCssInjection({
15
- testId: "salt-drawer-close-button",
16
- css: css_248z,
17
- window: targetWindow
18
- });
19
- return /* @__PURE__ */ jsx("div", {
20
- className: withBaseName("container"),
21
- children: /* @__PURE__ */ jsx(Button, {
22
- ref,
23
- "aria-label": "Close Drawer",
24
- variant: "secondary",
25
- className: clsx(withBaseName(), className),
26
- ...rest,
27
- children: /* @__PURE__ */ jsx(CloseIcon, {
28
- "aria-hidden": true
29
- })
30
- })
31
- });
32
- }
33
- );
34
-
35
- export { DrawerCloseButton };
36
- //# sourceMappingURL=DrawerCloseButton.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"DrawerCloseButton.js","sources":["../src/drawer/DrawerCloseButton.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport clsx from \"clsx\";\nimport { Button, ButtonProps, makePrefixer } from \"@salt-ds/core\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { CloseIcon } from \"@salt-ds/icons\";\n\nimport drawerCloseButtonCss from \"./DrawerCloseButton.css\";\n\nconst withBaseName = makePrefixer(\"saltDrawerCloseButton\");\n\nexport const DrawerCloseButton = forwardRef<HTMLButtonElement, ButtonProps>(\n function DrawerCloseButton({ className, ...rest }, ref) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-drawer-close-button\",\n css: drawerCloseButtonCss,\n window: targetWindow,\n });\n\n return (\n <div className={withBaseName(\"container\")}>\n <Button\n ref={ref}\n aria-label=\"Close Drawer\"\n variant=\"secondary\"\n className={clsx(withBaseName(), className)}\n {...rest}\n >\n <CloseIcon aria-hidden />\n </Button>\n </div>\n );\n }\n);\n"],"names":["DrawerCloseButton","drawerCloseButtonCss"],"mappings":";;;;;;;;;AASA,MAAM,YAAA,GAAe,aAAa,uBAAuB,CAAA,CAAA;AAElD,MAAM,iBAAoB,GAAA,UAAA;AAAA,EAC/B,SAASA,kBAAkB,CAAA,EAAE,SAAc,EAAA,GAAA,IAAA,IAAQ,GAAK,EAAA;AACtD,IAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,0BAAA;AAAA,MACR,GAAK,EAAAC,QAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,uBACG,GAAA,CAAA,KAAA,EAAA;AAAA,MAAI,SAAA,EAAW,aAAa,WAAW,CAAA;AAAA,MACtC,QAAC,kBAAA,GAAA,CAAA,MAAA,EAAA;AAAA,QACC,GAAA;AAAA,QACA,YAAW,EAAA,cAAA;AAAA,QACX,OAAQ,EAAA,WAAA;AAAA,QACR,SAAW,EAAA,IAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,QACxC,GAAG,IAAA;AAAA,QAEJ,QAAC,kBAAA,GAAA,CAAA,SAAA,EAAA;AAAA,UAAU,aAAW,EAAA,IAAA;AAAA,SAAC,CAAA;AAAA,OACzB,CAAA;AAAA,KACF,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
@@ -1,60 +0,0 @@
1
- import { DateValue } from "@internationalized/date";
2
- import { SyntheticEvent } from "react";
3
- import { UseMultiSelectionCalendarProps, UseOffsetSelectionCalendarProps, UseRangeSelectionCalendarProps, UseSingleSelectionCalendarProps } from "./useSelection";
4
- export declare type UnselectableInfo = {
5
- emphasis: "medium";
6
- tooltip: string;
7
- } | {
8
- emphasis: "low";
9
- tooltip?: string;
10
- };
11
- interface BaseUseCalendarProps {
12
- defaultVisibleMonth?: DateValue;
13
- onVisibleMonthChange?: (event: SyntheticEvent, visibleMonth: DateValue) => void;
14
- isDayUnselectable?: (date: DateValue) => UnselectableInfo | boolean | void;
15
- visibleMonth?: DateValue;
16
- hideOutOfRangeDates?: boolean;
17
- hideYearDropdown?: boolean;
18
- minDate?: DateValue;
19
- maxDate?: DateValue;
20
- }
21
- export declare type useCalendarProps = (Omit<UseSingleSelectionCalendarProps, "isDaySelectable"> | Omit<UseMultiSelectionCalendarProps, "isDaySelectable"> | Omit<UseRangeSelectionCalendarProps, "isDaySelectable"> | Omit<UseOffsetSelectionCalendarProps, "isDaySelectable">) & BaseUseCalendarProps;
22
- export declare function useCalendar(props: useCalendarProps): {
23
- state: {
24
- selectedDate: import("@internationalized/date").CalendarDate | import("@internationalized/date").CalendarDateTime | import("@internationalized/date").ZonedDateTime | {
25
- startDate?: DateValue | undefined;
26
- endDate?: DateValue | undefined;
27
- } | {
28
- startDate?: DateValue | undefined;
29
- endDate?: DateValue | undefined;
30
- } | DateValue[] | null | undefined;
31
- hoveredDate: import("@internationalized/date").CalendarDate | import("@internationalized/date").CalendarDateTime | import("@internationalized/date").ZonedDateTime | null | undefined;
32
- visibleMonth: DateValue;
33
- focusedDate: DateValue;
34
- minDate: DateValue | undefined;
35
- maxDate: DateValue | undefined;
36
- selectionVariant: "offset" | "range" | "default" | "multiselect";
37
- hideOutOfRangeDates: boolean | undefined;
38
- calendarFocused: boolean;
39
- };
40
- helpers: {
41
- setSelectedDate: (event: SyntheticEvent<HTMLButtonElement, Event>, newSelectedDate: DateValue) => void;
42
- isSelected: (date: DateValue) => boolean;
43
- setHoveredDate: (event: SyntheticEvent<Element, Event>, date: DateValue | null) => void;
44
- isHovered: (date: DateValue) => boolean;
45
- isSelectedSpan: (date: DateValue) => boolean;
46
- isHoveredSpan: (date: DateValue) => boolean;
47
- isSelectedStart: (date: DateValue) => boolean;
48
- isSelectedEnd: (date: DateValue) => boolean;
49
- isHoveredOffset: (date: DateValue) => boolean;
50
- setVisibleMonth: (event: SyntheticEvent, newVisibleMonth: DateValue) => void;
51
- setFocusedDate: (event: SyntheticEvent, date: DateValue) => void;
52
- setCalendarFocused: import("react").Dispatch<import("react").SetStateAction<boolean>>;
53
- isDayUnselectable: (date: DateValue) => boolean | void | UnselectableInfo;
54
- isDayVisible: (date: DateValue) => boolean;
55
- isOutsideAllowedDates: (date: DateValue) => boolean;
56
- isOutsideAllowedMonths: (date: DateValue) => boolean;
57
- isOutsideAllowedYears: (date: DateValue) => boolean;
58
- };
59
- };
60
- export {};
@@ -1,22 +0,0 @@
1
- import { ReactNode, ComponentPropsWithoutRef } from "react";
2
- import { ValidationStatus } from "@salt-ds/core";
3
- interface DialogTitleProps extends Omit<ComponentPropsWithoutRef<"div">, "title"> {
4
- /**
5
- * The status of the Dialog
6
- */
7
- status?: ValidationStatus | undefined;
8
- /**
9
- * Displays the accent bar in the Dialog Title */
10
- disableAccent?: boolean;
11
- /**
12
- * Displays the Dialog Title in a H2 component
13
- */
14
- title: ReactNode;
15
- /**
16
- * Displays the Dialog Subtitle in a Label component
17
- **/
18
- subtitle?: ReactNode;
19
- className?: string;
20
- }
21
- export declare const DialogTitle: ({ className, title, subtitle, disableAccent, status: statusProp, ...rest }: DialogTitleProps) => JSX.Element;
22
- export {};
@@ -1,28 +0,0 @@
1
- import { ComponentPropsWithoutRef } from "react";
2
- export interface DrawerProps extends ComponentPropsWithoutRef<"div"> {
3
- /**
4
- * Defines the drawer position within the screen. Defaults to `left`.
5
- */
6
- position?: "left" | "top" | "right" | "bottom";
7
- /**
8
- * Display or hide the component.
9
- */
10
- open?: boolean;
11
- /**
12
- * Callback function triggered when open state changes.
13
- */
14
- onOpenChange?: (newOpen: boolean) => void;
15
- /**
16
- * Change background color palette
17
- */
18
- variant?: "primary" | "secondary";
19
- /**
20
- * Prevent the dialog closing on click away
21
- * */
22
- disableDismiss?: boolean;
23
- /**
24
- * Prevent Scrim from rendering
25
- * */
26
- disableScrim?: boolean;
27
- }
28
- export declare const Drawer: import("react").ForwardRefExoticComponent<DrawerProps & import("react").RefAttributes<HTMLDivElement>>;
@@ -1,2 +0,0 @@
1
- import { ButtonProps } from "@salt-ds/core";
2
- export declare const DrawerCloseButton: import("react").ForwardRefExoticComponent<ButtonProps & import("react").RefAttributes<HTMLButtonElement>>;
@@ -1,2 +0,0 @@
1
- export * from "./Drawer";
2
- export * from "./DrawerCloseButton";