@salt-ds/core 1.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +1 -0
- package/dist-cjs/node_modules/style-inject/dist/style-inject.es.js +31 -0
- package/dist-cjs/node_modules/style-inject/dist/style-inject.es.js.map +1 -0
- package/dist-cjs/packages/core/src/aria-announcer/AriaAnnounce.js +22 -0
- package/dist-cjs/packages/core/src/aria-announcer/AriaAnnounce.js.map +1 -0
- package/dist-cjs/packages/core/src/aria-announcer/AriaAnnouncerContext.js +12 -0
- package/dist-cjs/packages/core/src/aria-announcer/AriaAnnouncerContext.js.map +1 -0
- package/dist-cjs/packages/core/src/aria-announcer/AriaAnnouncerProvider.js +78 -0
- package/dist-cjs/packages/core/src/aria-announcer/AriaAnnouncerProvider.js.map +1 -0
- package/dist-cjs/packages/core/src/aria-announcer/useAriaAnnouncer.js +65 -0
- package/dist-cjs/packages/core/src/aria-announcer/useAriaAnnouncer.js.map +1 -0
- package/dist-cjs/packages/core/src/border-item/BorderItem.css.js +9 -0
- package/dist-cjs/packages/core/src/border-item/BorderItem.css.js.map +1 -0
- package/dist-cjs/packages/core/src/border-item/BorderItem.js +54 -0
- package/dist-cjs/packages/core/src/border-item/BorderItem.js.map +1 -0
- package/dist-cjs/packages/core/src/border-layout/BorderLayout.js +59 -0
- package/dist-cjs/packages/core/src/border-layout/BorderLayout.js.map +1 -0
- package/dist-cjs/packages/core/src/breakpoints/Breakpoints.js +15 -0
- package/dist-cjs/packages/core/src/breakpoints/Breakpoints.js.map +1 -0
- package/dist-cjs/packages/core/src/button/Button.css.js +9 -0
- package/dist-cjs/packages/core/src/button/Button.css.js.map +1 -0
- package/dist-cjs/packages/core/src/button/Button.js +60 -0
- package/dist-cjs/packages/core/src/button/Button.js.map +1 -0
- package/dist-cjs/packages/core/src/button/useButton.js +65 -0
- package/dist-cjs/packages/core/src/button/useButton.js.map +1 -0
- package/dist-cjs/packages/core/src/flex-item/FlexItem.css.js +9 -0
- package/dist-cjs/packages/core/src/flex-item/FlexItem.css.js.map +1 -0
- package/dist-cjs/packages/core/src/flex-item/FlexItem.js +56 -0
- package/dist-cjs/packages/core/src/flex-item/FlexItem.js.map +1 -0
- package/dist-cjs/packages/core/src/flex-layout/FlexLayout.css.js +9 -0
- package/dist-cjs/packages/core/src/flex-layout/FlexLayout.css.js.map +1 -0
- package/dist-cjs/packages/core/src/flex-layout/FlexLayout.js +77 -0
- package/dist-cjs/packages/core/src/flex-layout/FlexLayout.js.map +1 -0
- package/dist-cjs/packages/core/src/flow-layout/FlowLayout.js +21 -0
- package/dist-cjs/packages/core/src/flow-layout/FlowLayout.js.map +1 -0
- package/dist-cjs/packages/core/src/grid-item/GridItem.css.js +9 -0
- package/dist-cjs/packages/core/src/grid-item/GridItem.css.js.map +1 -0
- package/dist-cjs/packages/core/src/grid-item/GridItem.js +68 -0
- package/dist-cjs/packages/core/src/grid-item/GridItem.js.map +1 -0
- package/dist-cjs/packages/core/src/grid-layout/GridLayout.css.js +9 -0
- package/dist-cjs/packages/core/src/grid-layout/GridLayout.css.js.map +1 -0
- package/dist-cjs/packages/core/src/grid-layout/GridLayout.js +55 -0
- package/dist-cjs/packages/core/src/grid-layout/GridLayout.js.map +1 -0
- package/dist-cjs/packages/core/src/index.js +118 -0
- package/dist-cjs/packages/core/src/index.js.map +1 -0
- package/dist-cjs/packages/core/src/link/Link.css.js +9 -0
- package/dist-cjs/packages/core/src/link/Link.css.js.map +1 -0
- package/dist-cjs/packages/core/src/link/Link.js +60 -0
- package/dist-cjs/packages/core/src/link/Link.js.map +1 -0
- package/dist-cjs/packages/core/src/salt-provider/SaltProvider.css.js +9 -0
- package/dist-cjs/packages/core/src/salt-provider/SaltProvider.css.js.map +1 -0
- package/dist-cjs/packages/core/src/salt-provider/SaltProvider.js +158 -0
- package/dist-cjs/packages/core/src/salt-provider/SaltProvider.js.map +1 -0
- package/dist-cjs/packages/core/src/stack-layout/StackLayout.js +20 -0
- package/dist-cjs/packages/core/src/stack-layout/StackLayout.js.map +1 -0
- package/dist-cjs/packages/core/src/status-indicator/StatusIndicator.css.js +9 -0
- package/dist-cjs/packages/core/src/status-indicator/StatusIndicator.css.js.map +1 -0
- package/dist-cjs/packages/core/src/status-indicator/StatusIndicator.js +47 -0
- package/dist-cjs/packages/core/src/status-indicator/StatusIndicator.js.map +1 -0
- package/dist-cjs/packages/core/src/status-indicator/ValidationStatus.js +13 -0
- package/dist-cjs/packages/core/src/status-indicator/ValidationStatus.js.map +1 -0
- package/dist-cjs/packages/core/src/text/Display.js +50 -0
- package/dist-cjs/packages/core/src/text/Display.js.map +1 -0
- package/dist-cjs/packages/core/src/text/Headings.js +54 -0
- package/dist-cjs/packages/core/src/text/Headings.js.map +1 -0
- package/dist-cjs/packages/core/src/text/Label.js +19 -0
- package/dist-cjs/packages/core/src/text/Label.js.map +1 -0
- package/dist-cjs/packages/core/src/text/Text.css.js +9 -0
- package/dist-cjs/packages/core/src/text/Text.css.js.map +1 -0
- package/dist-cjs/packages/core/src/text/Text.js +47 -0
- package/dist-cjs/packages/core/src/text/Text.js.map +1 -0
- package/dist-cjs/packages/core/src/theme/Density.js +8 -0
- package/dist-cjs/packages/core/src/theme/Density.js.map +1 -0
- package/dist-cjs/packages/core/src/theme/Mode.js +8 -0
- package/dist-cjs/packages/core/src/theme/Mode.js.map +1 -0
- package/dist-cjs/packages/core/src/theme/Theme.js +19 -0
- package/dist-cjs/packages/core/src/theme/Theme.js.map +1 -0
- package/dist-cjs/packages/core/src/utils/createChainedFunction.js +22 -0
- package/dist-cjs/packages/core/src/utils/createChainedFunction.js.map +1 -0
- package/dist-cjs/packages/core/src/utils/createContext.js +16 -0
- package/dist-cjs/packages/core/src/utils/createContext.js.map +1 -0
- package/dist-cjs/packages/core/src/utils/debounce.js +24 -0
- package/dist-cjs/packages/core/src/utils/debounce.js.map +1 -0
- package/dist-cjs/packages/core/src/utils/makePrefixer.js +8 -0
- package/dist-cjs/packages/core/src/utils/makePrefixer.js.map +1 -0
- package/dist-cjs/packages/core/src/utils/marginMiddleware.js +22 -0
- package/dist-cjs/packages/core/src/utils/marginMiddleware.js.map +1 -0
- package/dist-cjs/packages/core/src/utils/ownerDocument.js +10 -0
- package/dist-cjs/packages/core/src/utils/ownerDocument.js.map +1 -0
- package/dist-cjs/packages/core/src/utils/ownerWindow.js +13 -0
- package/dist-cjs/packages/core/src/utils/ownerWindow.js.map +1 -0
- package/dist-cjs/packages/core/src/utils/setRef.js +14 -0
- package/dist-cjs/packages/core/src/utils/setRef.js.map +1 -0
- package/dist-cjs/packages/core/src/utils/useControlled.js +60 -0
- package/dist-cjs/packages/core/src/utils/useControlled.js.map +1 -0
- package/dist-cjs/packages/core/src/utils/useForkRef.js +21 -0
- package/dist-cjs/packages/core/src/utils/useForkRef.js.map +1 -0
- package/dist-cjs/packages/core/src/utils/useId.js +55 -0
- package/dist-cjs/packages/core/src/utils/useId.js.map +1 -0
- package/dist-cjs/packages/core/src/utils/useIsFocusVisible.js +108 -0
- package/dist-cjs/packages/core/src/utils/useIsFocusVisible.js.map +1 -0
- package/dist-cjs/packages/core/src/utils/useIsomorphicLayoutEffect.js +10 -0
- package/dist-cjs/packages/core/src/utils/useIsomorphicLayoutEffect.js.map +1 -0
- package/dist-cjs/packages/core/src/utils/usePrevious.js +16 -0
- package/dist-cjs/packages/core/src/utils/usePrevious.js.map +1 -0
- package/dist-cjs/packages/core/src/utils/useResponsiveProp.js +71 -0
- package/dist-cjs/packages/core/src/utils/useResponsiveProp.js.map +1 -0
- package/dist-cjs/packages/core/src/viewport/ViewportProvider.js +43 -0
- package/dist-cjs/packages/core/src/viewport/ViewportProvider.js.map +1 -0
- package/dist-es/node_modules/style-inject/dist/style-inject.es.js +29 -0
- package/dist-es/node_modules/style-inject/dist/style-inject.es.js.map +1 -0
- package/dist-es/packages/core/src/aria-announcer/AriaAnnounce.js +18 -0
- package/dist-es/packages/core/src/aria-announcer/AriaAnnounce.js.map +1 -0
- package/dist-es/packages/core/src/aria-announcer/AriaAnnouncerContext.js +8 -0
- package/dist-es/packages/core/src/aria-announcer/AriaAnnouncerContext.js.map +1 -0
- package/dist-es/packages/core/src/aria-announcer/AriaAnnouncerProvider.js +73 -0
- package/dist-es/packages/core/src/aria-announcer/AriaAnnouncerProvider.js.map +1 -0
- package/dist-es/packages/core/src/aria-announcer/useAriaAnnouncer.js +61 -0
- package/dist-es/packages/core/src/aria-announcer/useAriaAnnouncer.js.map +1 -0
- package/dist-es/packages/core/src/border-item/BorderItem.css.js +7 -0
- package/dist-es/packages/core/src/border-item/BorderItem.css.js.map +1 -0
- package/dist-es/packages/core/src/border-item/BorderItem.js +45 -0
- package/dist-es/packages/core/src/border-item/BorderItem.js.map +1 -0
- package/dist-es/packages/core/src/border-layout/BorderLayout.js +51 -0
- package/dist-es/packages/core/src/border-layout/BorderLayout.js.map +1 -0
- package/dist-es/packages/core/src/breakpoints/Breakpoints.js +11 -0
- package/dist-es/packages/core/src/breakpoints/Breakpoints.js.map +1 -0
- package/dist-es/packages/core/src/button/Button.css.js +7 -0
- package/dist-es/packages/core/src/button/Button.css.js.map +1 -0
- package/dist-es/packages/core/src/button/Button.js +51 -0
- package/dist-es/packages/core/src/button/Button.js.map +1 -0
- package/dist-es/packages/core/src/button/useButton.js +61 -0
- package/dist-es/packages/core/src/button/useButton.js.map +1 -0
- package/dist-es/packages/core/src/flex-item/FlexItem.css.js +7 -0
- package/dist-es/packages/core/src/flex-item/FlexItem.css.js.map +1 -0
- package/dist-es/packages/core/src/flex-item/FlexItem.js +47 -0
- package/dist-es/packages/core/src/flex-item/FlexItem.js.map +1 -0
- package/dist-es/packages/core/src/flex-layout/FlexLayout.css.js +7 -0
- package/dist-es/packages/core/src/flex-layout/FlexLayout.css.js.map +1 -0
- package/dist-es/packages/core/src/flex-layout/FlexLayout.js +67 -0
- package/dist-es/packages/core/src/flex-layout/FlexLayout.js.map +1 -0
- package/dist-es/packages/core/src/flow-layout/FlowLayout.js +17 -0
- package/dist-es/packages/core/src/flow-layout/FlowLayout.js.map +1 -0
- package/dist-es/packages/core/src/grid-item/GridItem.css.js +7 -0
- package/dist-es/packages/core/src/grid-item/GridItem.css.js.map +1 -0
- package/dist-es/packages/core/src/grid-item/GridItem.js +59 -0
- package/dist-es/packages/core/src/grid-item/GridItem.js.map +1 -0
- package/dist-es/packages/core/src/grid-layout/GridLayout.css.js +7 -0
- package/dist-es/packages/core/src/grid-layout/GridLayout.css.js.map +1 -0
- package/dist-es/packages/core/src/grid-layout/GridLayout.js +47 -0
- package/dist-es/packages/core/src/grid-layout/GridLayout.js.map +1 -0
- package/dist-es/packages/core/src/index.js +43 -0
- package/dist-es/packages/core/src/index.js.map +1 -0
- package/dist-es/packages/core/src/link/Link.css.js +7 -0
- package/dist-es/packages/core/src/link/Link.css.js.map +1 -0
- package/dist-es/packages/core/src/link/Link.js +52 -0
- package/dist-es/packages/core/src/link/Link.js.map +1 -0
- package/dist-es/packages/core/src/salt-provider/SaltProvider.css.js +7 -0
- package/dist-es/packages/core/src/salt-provider/SaltProvider.css.js.map +1 -0
- package/dist-es/packages/core/src/salt-provider/SaltProvider.js +142 -0
- package/dist-es/packages/core/src/salt-provider/SaltProvider.js.map +1 -0
- package/dist-es/packages/core/src/stack-layout/StackLayout.js +16 -0
- package/dist-es/packages/core/src/stack-layout/StackLayout.js.map +1 -0
- package/dist-es/packages/core/src/status-indicator/StatusIndicator.css.js +7 -0
- package/dist-es/packages/core/src/status-indicator/StatusIndicator.css.js.map +1 -0
- package/dist-es/packages/core/src/status-indicator/StatusIndicator.js +39 -0
- package/dist-es/packages/core/src/status-indicator/StatusIndicator.js.map +1 -0
- package/dist-es/packages/core/src/status-indicator/ValidationStatus.js +9 -0
- package/dist-es/packages/core/src/status-indicator/ValidationStatus.js.map +1 -0
- package/dist-es/packages/core/src/text/Display.js +40 -0
- package/dist-es/packages/core/src/text/Display.js.map +1 -0
- package/dist-es/packages/core/src/text/Headings.js +47 -0
- package/dist-es/packages/core/src/text/Headings.js.map +1 -0
- package/dist-es/packages/core/src/text/Label.js +15 -0
- package/dist-es/packages/core/src/text/Label.js.map +1 -0
- package/dist-es/packages/core/src/text/Text.css.js +7 -0
- package/dist-es/packages/core/src/text/Text.css.js.map +1 -0
- package/dist-es/packages/core/src/text/Text.js +39 -0
- package/dist-es/packages/core/src/text/Text.js.map +1 -0
- package/dist-es/packages/core/src/theme/Density.js +4 -0
- package/dist-es/packages/core/src/theme/Density.js.map +1 -0
- package/dist-es/packages/core/src/theme/Mode.js +4 -0
- package/dist-es/packages/core/src/theme/Mode.js.map +1 -0
- package/dist-es/packages/core/src/theme/Theme.js +15 -0
- package/dist-es/packages/core/src/theme/Theme.js.map +1 -0
- package/dist-es/packages/core/src/utils/createChainedFunction.js +18 -0
- package/dist-es/packages/core/src/utils/createChainedFunction.js.map +1 -0
- package/dist-es/packages/core/src/utils/createContext.js +12 -0
- package/dist-es/packages/core/src/utils/createContext.js.map +1 -0
- package/dist-es/packages/core/src/utils/debounce.js +20 -0
- package/dist-es/packages/core/src/utils/debounce.js.map +1 -0
- package/dist-es/packages/core/src/utils/makePrefixer.js +4 -0
- package/dist-es/packages/core/src/utils/makePrefixer.js.map +1 -0
- package/dist-es/packages/core/src/utils/marginMiddleware.js +18 -0
- package/dist-es/packages/core/src/utils/marginMiddleware.js.map +1 -0
- package/dist-es/packages/core/src/utils/ownerDocument.js +6 -0
- package/dist-es/packages/core/src/utils/ownerDocument.js.map +1 -0
- package/dist-es/packages/core/src/utils/ownerWindow.js +9 -0
- package/dist-es/packages/core/src/utils/ownerWindow.js.map +1 -0
- package/dist-es/packages/core/src/utils/setRef.js +10 -0
- package/dist-es/packages/core/src/utils/setRef.js.map +1 -0
- package/dist-es/packages/core/src/utils/useControlled.js +56 -0
- package/dist-es/packages/core/src/utils/useControlled.js.map +1 -0
- package/dist-es/packages/core/src/utils/useForkRef.js +17 -0
- package/dist-es/packages/core/src/utils/useForkRef.js.map +1 -0
- package/dist-es/packages/core/src/utils/useId.js +30 -0
- package/dist-es/packages/core/src/utils/useId.js.map +1 -0
- package/dist-es/packages/core/src/utils/useIsFocusVisible.js +103 -0
- package/dist-es/packages/core/src/utils/useIsFocusVisible.js.map +1 -0
- package/dist-es/packages/core/src/utils/useIsomorphicLayoutEffect.js +6 -0
- package/dist-es/packages/core/src/utils/useIsomorphicLayoutEffect.js.map +1 -0
- package/dist-es/packages/core/src/utils/usePrevious.js +12 -0
- package/dist-es/packages/core/src/utils/usePrevious.js.map +1 -0
- package/dist-es/packages/core/src/utils/useResponsiveProp.js +64 -0
- package/dist-es/packages/core/src/utils/useResponsiveProp.js.map +1 -0
- package/dist-es/packages/core/src/viewport/ViewportProvider.js +37 -0
- package/dist-es/packages/core/src/viewport/ViewportProvider.js.map +1 -0
- package/dist-types/aria-announcer/AriaAnnounce.d.ts +8 -0
- package/dist-types/aria-announcer/AriaAnnouncerContext.d.ts +6 -0
- package/dist-types/aria-announcer/AriaAnnouncerProvider.d.ts +10 -0
- package/dist-types/aria-announcer/index.d.ts +4 -0
- package/dist-types/aria-announcer/useAriaAnnouncer.d.ts +6 -0
- package/dist-types/border-item/BorderItem.d.ts +27 -0
- package/dist-types/border-item/index.d.ts +1 -0
- package/dist-types/border-layout/BorderLayout.d.ts +25 -0
- package/dist-types/border-layout/index.d.ts +1 -0
- package/dist-types/breakpoints/Breakpoints.d.ts +8 -0
- package/dist-types/breakpoints/index.d.ts +1 -0
- package/dist-types/button/Button.d.ts +20 -0
- package/dist-types/button/index.d.ts +2 -0
- package/dist-types/button/useButton.d.ts +22 -0
- package/dist-types/flex-item/FlexItem.d.ts +23 -0
- package/dist-types/flex-item/index.d.ts +1 -0
- package/dist-types/flex-layout/FlexLayout.d.ts +38 -0
- package/dist-types/flex-layout/index.d.ts +1 -0
- package/dist-types/flow-layout/FlowLayout.d.ts +17 -0
- package/dist-types/flow-layout/index.d.ts +1 -0
- package/dist-types/grid-item/GridItem.d.ts +27 -0
- package/dist-types/grid-item/index.d.ts +1 -0
- package/dist-types/grid-layout/GridLayout.d.ts +28 -0
- package/dist-types/grid-layout/index.d.ts +1 -0
- package/dist-types/index.d.ts +18 -0
- package/dist-types/link/Link.d.ts +14 -0
- package/dist-types/link/index.d.ts +1 -0
- package/dist-types/salt-provider/SaltProvider.d.ts +39 -0
- package/dist-types/salt-provider/index.d.ts +1 -0
- package/dist-types/stack-layout/StackLayout.d.ts +17 -0
- package/dist-types/stack-layout/index.d.ts +1 -0
- package/dist-types/status-indicator/StatusIndicator.d.ts +11 -0
- package/dist-types/status-indicator/ValidationStatus.d.ts +2 -0
- package/dist-types/status-indicator/index.d.ts +2 -0
- package/dist-types/text/Display.d.ts +5 -0
- package/dist-types/text/Headings.d.ts +6 -0
- package/dist-types/text/Label.d.ts +3 -0
- package/dist-types/text/Text.d.ts +20 -0
- package/dist-types/text/index.d.ts +4 -0
- package/dist-types/theme/Density.d.ts +2 -0
- package/dist-types/theme/Mode.d.ts +2 -0
- package/dist-types/theme/Theme.d.ts +3 -0
- package/dist-types/theme/index.d.ts +3 -0
- package/dist-types/utils/createChainedFunction.d.ts +3 -0
- package/dist-types/utils/createContext.d.ts +2 -0
- package/dist-types/utils/debounce.d.ts +4 -0
- package/dist-types/utils/index.d.ts +17 -0
- package/dist-types/utils/inferElementType.d.ts +2 -0
- package/dist-types/utils/makePrefixer.d.ts +2 -0
- package/dist-types/utils/marginMiddleware.d.ts +2 -0
- package/dist-types/utils/ownerDocument.d.ts +1 -0
- package/dist-types/utils/ownerWindow.d.ts +1 -0
- package/dist-types/utils/polymorphicTypes.d.ts +14 -0
- package/dist-types/utils/setRef.d.ts +2 -0
- package/dist-types/utils/useControlled.d.ts +24 -0
- package/dist-types/utils/useForkRef.d.ts +2 -0
- package/dist-types/utils/useId.d.ts +2 -0
- package/dist-types/utils/useIsFocusVisible.d.ts +8 -0
- package/dist-types/utils/useIsomorphicLayoutEffect.d.ts +2 -0
- package/dist-types/utils/usePrevious.d.ts +2 -0
- package/dist-types/utils/useResponsiveProp.d.ts +10 -0
- package/dist-types/viewport/ViewportProvider.d.ts +8 -0
- package/dist-types/viewport/index.d.ts +1 -0
- package/package.json +40 -0
package/README.md
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
# Core
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
function styleInject(css, ref) {
|
|
4
|
+
if ( ref === void 0 ) ref = {};
|
|
5
|
+
var insertAt = ref.insertAt;
|
|
6
|
+
|
|
7
|
+
if (!css || typeof document === 'undefined') { return; }
|
|
8
|
+
|
|
9
|
+
var head = document.head || document.getElementsByTagName('head')[0];
|
|
10
|
+
var style = document.createElement('style');
|
|
11
|
+
style.type = 'text/css';
|
|
12
|
+
|
|
13
|
+
if (insertAt === 'top') {
|
|
14
|
+
if (head.firstChild) {
|
|
15
|
+
head.insertBefore(style, head.firstChild);
|
|
16
|
+
} else {
|
|
17
|
+
head.appendChild(style);
|
|
18
|
+
}
|
|
19
|
+
} else {
|
|
20
|
+
head.appendChild(style);
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
if (style.styleSheet) {
|
|
24
|
+
style.styleSheet.cssText = css;
|
|
25
|
+
} else {
|
|
26
|
+
style.appendChild(document.createTextNode(css));
|
|
27
|
+
}
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
module.exports = styleInject;
|
|
31
|
+
//# sourceMappingURL=style-inject.es.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"style-inject.es.js","sources":["../../../node_modules/style-inject/dist/style-inject.es.js"],"sourcesContent":["function styleInject(css, ref) {\n if ( ref === void 0 ) ref = {};\n var insertAt = ref.insertAt;\n\n if (!css || typeof document === 'undefined') { return; }\n\n var head = document.head || document.getElementsByTagName('head')[0];\n var style = document.createElement('style');\n style.type = 'text/css';\n\n if (insertAt === 'top') {\n if (head.firstChild) {\n head.insertBefore(style, head.firstChild);\n } else {\n head.appendChild(style);\n }\n } else {\n head.appendChild(style);\n }\n\n if (style.styleSheet) {\n style.styleSheet.cssText = css;\n } else {\n style.appendChild(document.createTextNode(css));\n }\n}\n\nexport default styleInject;\n"],"names":[],"mappings":";;AAAA,SAAS,WAAW,CAAC,GAAG,EAAE,GAAG,EAAE;AAC/B,EAAE,KAAK,GAAG,KAAK,KAAK,CAAC,GAAG,GAAG,GAAG,EAAE,CAAC;AACjC,EAAE,IAAI,QAAQ,GAAG,GAAG,CAAC,QAAQ,CAAC;AAC9B;AACA,EAAE,IAAI,CAAC,GAAG,IAAI,OAAO,QAAQ,KAAK,WAAW,EAAE,EAAE,OAAO,EAAE;AAC1D;AACA,EAAE,IAAI,IAAI,GAAG,QAAQ,CAAC,IAAI,IAAI,QAAQ,CAAC,oBAAoB,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC;AACvE,EAAE,IAAI,KAAK,GAAG,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;AAC9C,EAAE,KAAK,CAAC,IAAI,GAAG,UAAU,CAAC;AAC1B;AACA,EAAE,IAAI,QAAQ,KAAK,KAAK,EAAE;AAC1B,IAAI,IAAI,IAAI,CAAC,UAAU,EAAE;AACzB,MAAM,IAAI,CAAC,YAAY,CAAC,KAAK,EAAE,IAAI,CAAC,UAAU,CAAC,CAAC;AAChD,KAAK,MAAM;AACX,MAAM,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;AAC9B,KAAK;AACL,GAAG,MAAM;AACT,IAAI,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;AAC5B,GAAG;AACH;AACA,EAAE,IAAI,KAAK,CAAC,UAAU,EAAE;AACxB,IAAI,KAAK,CAAC,UAAU,CAAC,OAAO,GAAG,GAAG,CAAC;AACnC,GAAG,MAAM;AACT,IAAI,KAAK,CAAC,WAAW,CAAC,QAAQ,CAAC,cAAc,CAAC,GAAG,CAAC,CAAC,CAAC;AACpD,GAAG;AACH;;;;"}
|
|
@@ -0,0 +1,22 @@
|
|
|
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 useAriaAnnouncer = require('./useAriaAnnouncer.js');
|
|
8
|
+
|
|
9
|
+
const AriaAnnounce = ({
|
|
10
|
+
announcement
|
|
11
|
+
}) => {
|
|
12
|
+
const { announce } = useAriaAnnouncer.useAriaAnnouncer();
|
|
13
|
+
React.useEffect(() => {
|
|
14
|
+
if (announcement) {
|
|
15
|
+
announce(announcement);
|
|
16
|
+
}
|
|
17
|
+
}, [announce, announcement]);
|
|
18
|
+
return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, {});
|
|
19
|
+
};
|
|
20
|
+
|
|
21
|
+
exports.AriaAnnounce = AriaAnnounce;
|
|
22
|
+
//# sourceMappingURL=AriaAnnounce.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AriaAnnounce.js","sources":["../src/aria-announcer/AriaAnnounce.tsx"],"sourcesContent":["import { ComponentType, useEffect } from \"react\";\n\nimport { useAriaAnnouncer } from \"./useAriaAnnouncer\";\n\nexport interface AriaAnnounceProps {\n /**\n * String which will be announced by screen readers on change\n */\n announcement?: string;\n}\n\nexport const AriaAnnounce: ComponentType<AriaAnnounceProps> = ({\n announcement,\n}) => {\n const { announce } = useAriaAnnouncer();\n\n useEffect(() => {\n if (announcement) {\n announce(announcement);\n }\n }, [announce, announcement]);\n\n // If we return null here, react-docgen wouldn't be able to locate the component\n return <></>;\n};\n"],"names":["useAriaAnnouncer","useEffect","jsx","Fragment"],"mappings":";;;;;;;;AAWO,MAAM,eAAiD,CAAC;AAAA,EAC7D,YAAA;AACF,CAAM,KAAA;AACJ,EAAM,MAAA,EAAE,QAAS,EAAA,GAAIA,iCAAiB,EAAA,CAAA;AAEtC,EAAAC,eAAA,CAAU,MAAM;AACd,IAAA,IAAI,YAAc,EAAA;AAChB,MAAA,QAAA,CAAS,YAAY,CAAA,CAAA;AAAA,KACvB;AAAA,GACC,EAAA,CAAC,QAAU,EAAA,YAAY,CAAC,CAAA,CAAA;AAG3B,EAAA,uBAASC,cAAA,CAAAC,mBAAA,EAAA,EAAA,CAAA,CAAA;AACX;;;;"}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
var React = require('react');
|
|
6
|
+
|
|
7
|
+
const AriaAnnouncerContext = React.createContext(
|
|
8
|
+
void 0
|
|
9
|
+
);
|
|
10
|
+
|
|
11
|
+
exports.AriaAnnouncerContext = AriaAnnouncerContext;
|
|
12
|
+
//# sourceMappingURL=AriaAnnouncerContext.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AriaAnnouncerContext.js","sources":["../src/aria-announcer/AriaAnnouncerContext.ts"],"sourcesContent":["import { createContext } from \"react\";\n\nexport type AnnounceFn = (announcement: string, delay?: number) => void;\n\nexport type AriaAnnouncer = {\n announce: AnnounceFn;\n};\n\nexport const AriaAnnouncerContext = createContext<AriaAnnouncer | undefined>(\n undefined\n);\n"],"names":["createContext"],"mappings":";;;;;;AAQO,MAAM,oBAAuB,GAAAA,mBAAA;AAAA,EAClC,KAAA,CAAA;AACF;;;;"}
|
|
@@ -0,0 +1,78 @@
|
|
|
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 AriaAnnouncerContext = require('./AriaAnnouncerContext.js');
|
|
8
|
+
|
|
9
|
+
const ARIA_ANNOUNCE_DELAY = 150;
|
|
10
|
+
function AriaAnnouncerProvider({
|
|
11
|
+
children,
|
|
12
|
+
style
|
|
13
|
+
}) {
|
|
14
|
+
const [currentAnnouncement, setCurrentAnnouncement] = React.useState("");
|
|
15
|
+
const announcementsRef = React.useRef([]);
|
|
16
|
+
const isAnnouncingRef = React.useRef(false);
|
|
17
|
+
const mountedRef = React.useRef(true);
|
|
18
|
+
const announceAll = React.useCallback(() => {
|
|
19
|
+
isAnnouncingRef.current = true;
|
|
20
|
+
if (announcementsRef.current.length && mountedRef.current) {
|
|
21
|
+
setCurrentAnnouncement("");
|
|
22
|
+
requestAnimationFrame(() => {
|
|
23
|
+
if (mountedRef.current) {
|
|
24
|
+
const announcement = announcementsRef.current.shift();
|
|
25
|
+
setCurrentAnnouncement(announcement);
|
|
26
|
+
setTimeout(() => {
|
|
27
|
+
announceAll();
|
|
28
|
+
}, ARIA_ANNOUNCE_DELAY);
|
|
29
|
+
}
|
|
30
|
+
});
|
|
31
|
+
} else {
|
|
32
|
+
isAnnouncingRef.current = false;
|
|
33
|
+
}
|
|
34
|
+
}, []);
|
|
35
|
+
const announce = React.useCallback(
|
|
36
|
+
(announcement) => {
|
|
37
|
+
announcementsRef.current.push(announcement);
|
|
38
|
+
if (!isAnnouncingRef.current) {
|
|
39
|
+
announceAll();
|
|
40
|
+
}
|
|
41
|
+
},
|
|
42
|
+
[announceAll]
|
|
43
|
+
);
|
|
44
|
+
React.useEffect(
|
|
45
|
+
() => () => {
|
|
46
|
+
mountedRef.current = false;
|
|
47
|
+
},
|
|
48
|
+
[]
|
|
49
|
+
);
|
|
50
|
+
const value = React.useMemo(() => ({ announce }), [announce]);
|
|
51
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(AriaAnnouncerContext.AriaAnnouncerContext.Provider, {
|
|
52
|
+
value,
|
|
53
|
+
children: [
|
|
54
|
+
children,
|
|
55
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", {
|
|
56
|
+
"aria-atomic": "true",
|
|
57
|
+
"aria-live": "assertive",
|
|
58
|
+
style: {
|
|
59
|
+
position: "absolute",
|
|
60
|
+
height: 1,
|
|
61
|
+
width: 1,
|
|
62
|
+
padding: 0,
|
|
63
|
+
margin: -1,
|
|
64
|
+
overflow: "hidden",
|
|
65
|
+
clip: "rect(0, 0, 0, 0)",
|
|
66
|
+
whiteSpace: "nowrap",
|
|
67
|
+
borderWidth: 0,
|
|
68
|
+
...style
|
|
69
|
+
},
|
|
70
|
+
children: currentAnnouncement
|
|
71
|
+
})
|
|
72
|
+
]
|
|
73
|
+
});
|
|
74
|
+
}
|
|
75
|
+
|
|
76
|
+
exports.ARIA_ANNOUNCE_DELAY = ARIA_ANNOUNCE_DELAY;
|
|
77
|
+
exports.AriaAnnouncerProvider = AriaAnnouncerProvider;
|
|
78
|
+
//# sourceMappingURL=AriaAnnouncerProvider.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AriaAnnouncerProvider.js","sources":["../src/aria-announcer/AriaAnnouncerProvider.tsx"],"sourcesContent":["import {\n useState,\n useCallback,\n useRef,\n useMemo,\n useEffect,\n CSSProperties,\n ReactNode,\n} from \"react\";\n\nimport { AriaAnnouncerContext } from \"./AriaAnnouncerContext\";\n\nexport const ARIA_ANNOUNCE_DELAY = 150;\n\nexport interface AriaAnnouncerProviderProps {\n children?: ReactNode;\n /**\n * Style overrides for the aria-live element\n */\n style?: CSSProperties;\n}\n\nexport function AriaAnnouncerProvider({\n children,\n style,\n}: AriaAnnouncerProviderProps) {\n // announcement that gets rendered inside aria-live and read out by screen readers\n const [currentAnnouncement, setCurrentAnnouncement] = useState(\"\");\n // queue that stores all the requested announcements\n const announcementsRef = useRef<string[]>([]);\n // we use this variable to decide whether to start the announcement queue if one is not already in progress\n const isAnnouncingRef = useRef(false);\n // we need to keep track of the state of the component mount since all the async function calls\n // might trigger a setState after a component has been unmounted\n const mountedRef = useRef(true);\n\n // announceAll will get called recursively until all the announcements are rendered and cleared from the queue\n const announceAll = useCallback(() => {\n isAnnouncingRef.current = true;\n if (announcementsRef.current.length && mountedRef.current) {\n setCurrentAnnouncement(\"\");\n requestAnimationFrame(() => {\n if (mountedRef.current) {\n const announcement = announcementsRef.current.shift() as string;\n setCurrentAnnouncement(announcement);\n setTimeout(() => {\n announceAll();\n }, ARIA_ANNOUNCE_DELAY);\n }\n });\n } else {\n isAnnouncingRef.current = false;\n }\n }, []);\n\n const announce = useCallback(\n (announcement: string) => {\n announcementsRef.current.push(announcement);\n if (!isAnnouncingRef.current) {\n announceAll();\n }\n },\n [announceAll]\n );\n\n useEffect(\n () => () => {\n mountedRef.current = false;\n },\n []\n );\n\n const value = useMemo(() => ({ announce }), [announce]);\n return (\n <AriaAnnouncerContext.Provider value={value}>\n {children}\n <div\n aria-atomic=\"true\"\n aria-live=\"assertive\"\n // hidden styling based on https://tailwindcss.com/docs/screen-readers\n style={{\n position: \"absolute\",\n height: 1,\n width: 1,\n padding: 0,\n margin: -1,\n overflow: \"hidden\",\n clip: \"rect(0, 0, 0, 0)\",\n whiteSpace: \"nowrap\",\n borderWidth: 0,\n ...style,\n }}\n >\n {currentAnnouncement}\n </div>\n </AriaAnnouncerContext.Provider>\n );\n}\n"],"names":["useState","useRef","useCallback","useEffect","useMemo","jsxs","AriaAnnouncerContext","jsx"],"mappings":";;;;;;;;AAYO,MAAM,mBAAsB,GAAA,IAAA;AAU5B,SAAS,qBAAsB,CAAA;AAAA,EACpC,QAAA;AAAA,EACA,KAAA;AACF,CAA+B,EAAA;AAE7B,EAAA,MAAM,CAAC,mBAAA,EAAqB,sBAAsB,CAAA,GAAIA,eAAS,EAAE,CAAA,CAAA;AAEjE,EAAM,MAAA,gBAAA,GAAmBC,YAAiB,CAAA,EAAE,CAAA,CAAA;AAE5C,EAAM,MAAA,eAAA,GAAkBA,aAAO,KAAK,CAAA,CAAA;AAGpC,EAAM,MAAA,UAAA,GAAaA,aAAO,IAAI,CAAA,CAAA;AAG9B,EAAM,MAAA,WAAA,GAAcC,kBAAY,MAAM;AACpC,IAAA,eAAA,CAAgB,OAAU,GAAA,IAAA,CAAA;AAC1B,IAAA,IAAI,gBAAiB,CAAA,OAAA,CAAQ,MAAU,IAAA,UAAA,CAAW,OAAS,EAAA;AACzD,MAAA,sBAAA,CAAuB,EAAE,CAAA,CAAA;AACzB,MAAA,qBAAA,CAAsB,MAAM;AAC1B,QAAA,IAAI,WAAW,OAAS,EAAA;AACtB,UAAM,MAAA,YAAA,GAAe,gBAAiB,CAAA,OAAA,CAAQ,KAAM,EAAA,CAAA;AACpD,UAAA,sBAAA,CAAuB,YAAY,CAAA,CAAA;AACnC,UAAA,UAAA,CAAW,MAAM;AACf,YAAY,WAAA,EAAA,CAAA;AAAA,aACX,mBAAmB,CAAA,CAAA;AAAA,SACxB;AAAA,OACD,CAAA,CAAA;AAAA,KACI,MAAA;AACL,MAAA,eAAA,CAAgB,OAAU,GAAA,KAAA,CAAA;AAAA,KAC5B;AAAA,GACF,EAAG,EAAE,CAAA,CAAA;AAEL,EAAA,MAAM,QAAW,GAAAA,iBAAA;AAAA,IACf,CAAC,YAAyB,KAAA;AACxB,MAAiB,gBAAA,CAAA,OAAA,CAAQ,KAAK,YAAY,CAAA,CAAA;AAC1C,MAAI,IAAA,CAAC,gBAAgB,OAAS,EAAA;AAC5B,QAAY,WAAA,EAAA,CAAA;AAAA,OACd;AAAA,KACF;AAAA,IACA,CAAC,WAAW,CAAA;AAAA,GACd,CAAA;AAEA,EAAAC,eAAA;AAAA,IACE,MAAM,MAAM;AACV,MAAA,UAAA,CAAW,OAAU,GAAA,KAAA,CAAA;AAAA,KACvB;AAAA,IACA,EAAC;AAAA,GACH,CAAA;AAEA,EAAM,MAAA,KAAA,GAAQC,cAAQ,OAAO,EAAE,UAAa,CAAA,EAAA,CAAC,QAAQ,CAAC,CAAA,CAAA;AACtD,EACE,uBAAAC,eAAA,CAACC,0CAAqB,QAArB,EAAA;AAAA,IAA8B,KAAA;AAAA,IAC5B,QAAA,EAAA;AAAA,MAAA,QAAA;AAAA,sBACAC,cAAA,CAAA,KAAA,EAAA;AAAA,QACC,aAAY,EAAA,MAAA;AAAA,QACZ,WAAU,EAAA,WAAA;AAAA,QAEV,KAAO,EAAA;AAAA,UACL,QAAU,EAAA,UAAA;AAAA,UACV,MAAQ,EAAA,CAAA;AAAA,UACR,KAAO,EAAA,CAAA;AAAA,UACP,OAAS,EAAA,CAAA;AAAA,UACT,MAAQ,EAAA,CAAA,CAAA;AAAA,UACR,QAAU,EAAA,QAAA;AAAA,UACV,IAAM,EAAA,kBAAA;AAAA,UACN,UAAY,EAAA,QAAA;AAAA,UACZ,WAAa,EAAA,CAAA;AAAA,UACb,GAAG,KAAA;AAAA,SACL;AAAA,QAEC,QAAA,EAAA,mBAAA;AAAA,OACH,CAAA;AAAA,KAAA;AAAA,GACF,CAAA,CAAA;AAEJ;;;;;"}
|
|
@@ -0,0 +1,65 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
var React = require('react');
|
|
6
|
+
var debounce = require('../utils/debounce.js');
|
|
7
|
+
require('../utils/useId.js');
|
|
8
|
+
require('../salt-provider/SaltProvider.js');
|
|
9
|
+
require('../viewport/ViewportProvider.js');
|
|
10
|
+
var AriaAnnouncerContext = require('./AriaAnnouncerContext.js');
|
|
11
|
+
|
|
12
|
+
let warnedOnce = false;
|
|
13
|
+
const useAriaAnnouncer = ({
|
|
14
|
+
debounce: debounceInterval = 0
|
|
15
|
+
} = {}) => {
|
|
16
|
+
const context = React.useContext(AriaAnnouncerContext.AriaAnnouncerContext);
|
|
17
|
+
const mountedRef = React.useRef(true);
|
|
18
|
+
const baseAnnounce = React.useCallback(
|
|
19
|
+
(announcement, delay) => {
|
|
20
|
+
const isReactAnnouncerInstalled = context && context.announce;
|
|
21
|
+
if (process.env.NODE_ENV !== "production") {
|
|
22
|
+
if (isReactAnnouncerInstalled && warnedOnce) {
|
|
23
|
+
console.warn(
|
|
24
|
+
"useAriaAnnouncer is being used without an AriaAnnouncerProvider. Your application should be wrapped in an AriaAnnouncerProvider"
|
|
25
|
+
);
|
|
26
|
+
warnedOnce = true;
|
|
27
|
+
}
|
|
28
|
+
}
|
|
29
|
+
function makeAnnouncement() {
|
|
30
|
+
if (mountedRef.current) {
|
|
31
|
+
if (isReactAnnouncerInstalled) {
|
|
32
|
+
context.announce(announcement);
|
|
33
|
+
}
|
|
34
|
+
}
|
|
35
|
+
}
|
|
36
|
+
if (delay) {
|
|
37
|
+
setTimeout(makeAnnouncement, delay);
|
|
38
|
+
} else {
|
|
39
|
+
makeAnnouncement();
|
|
40
|
+
}
|
|
41
|
+
},
|
|
42
|
+
[context]
|
|
43
|
+
);
|
|
44
|
+
const announce = React.useMemo(
|
|
45
|
+
() => debounceInterval > 0 ? debounce.debounce(baseAnnounce, debounceInterval) : baseAnnounce,
|
|
46
|
+
[baseAnnounce, debounceInterval]
|
|
47
|
+
);
|
|
48
|
+
const ariaAnnouncer = React.useMemo(
|
|
49
|
+
() => ({
|
|
50
|
+
...context,
|
|
51
|
+
announce
|
|
52
|
+
}),
|
|
53
|
+
[context, announce]
|
|
54
|
+
);
|
|
55
|
+
React.useEffect(
|
|
56
|
+
() => () => {
|
|
57
|
+
mountedRef.current = false;
|
|
58
|
+
},
|
|
59
|
+
[]
|
|
60
|
+
);
|
|
61
|
+
return ariaAnnouncer;
|
|
62
|
+
};
|
|
63
|
+
|
|
64
|
+
exports.useAriaAnnouncer = useAriaAnnouncer;
|
|
65
|
+
//# sourceMappingURL=useAriaAnnouncer.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useAriaAnnouncer.js","sources":["../src/aria-announcer/useAriaAnnouncer.ts"],"sourcesContent":["import { useCallback, useContext, useEffect, useMemo, useRef } from \"react\";\nimport { debounce } from \"../utils\";\nimport { AriaAnnouncer, AriaAnnouncerContext } from \"./AriaAnnouncerContext\";\n\nexport type useAnnouncerOptions = {\n debounce?: number;\n};\nexport type useAriaAnnouncerHook = (\n options?: useAnnouncerOptions\n) => AriaAnnouncer;\n\nlet warnedOnce = false;\n\nexport const useAriaAnnouncer: useAriaAnnouncerHook = ({\n debounce: debounceInterval = 0,\n} = {}) => {\n const context = useContext(AriaAnnouncerContext);\n const mountedRef = useRef(true);\n const baseAnnounce = useCallback(\n (announcement: string, delay?: number) => {\n const isReactAnnouncerInstalled = context && context.announce;\n\n if (process.env.NODE_ENV !== \"production\") {\n if (isReactAnnouncerInstalled && warnedOnce) {\n console.warn(\n \"useAriaAnnouncer is being used without an AriaAnnouncerProvider. Your application should be wrapped in an AriaAnnouncerProvider\"\n );\n warnedOnce = true;\n }\n }\n\n function makeAnnouncement() {\n if (mountedRef.current) {\n if (isReactAnnouncerInstalled) {\n context.announce(announcement);\n }\n }\n }\n\n if (delay) {\n setTimeout(makeAnnouncement, delay);\n } else {\n makeAnnouncement();\n }\n },\n [context]\n );\n\n const announce = useMemo(\n () =>\n debounceInterval > 0\n ? debounce(baseAnnounce, debounceInterval)\n : baseAnnounce,\n [baseAnnounce, debounceInterval]\n );\n\n const ariaAnnouncer = useMemo(\n () => ({\n ...context,\n announce,\n }),\n [context, announce]\n );\n\n useEffect(\n () => () => {\n mountedRef.current = false;\n },\n []\n );\n\n return ariaAnnouncer;\n};\n"],"names":["useContext","AriaAnnouncerContext","useRef","useCallback","useMemo","debounce","useEffect"],"mappings":";;;;;;;;;;;AAWA,IAAI,UAAa,GAAA,KAAA,CAAA;AAEV,MAAM,mBAAyC,CAAC;AAAA,EACrD,UAAU,gBAAmB,GAAA,CAAA;AAC/B,CAAA,GAAI,EAAO,KAAA;AACT,EAAM,MAAA,OAAA,GAAUA,iBAAWC,yCAAoB,CAAA,CAAA;AAC/C,EAAM,MAAA,UAAA,GAAaC,aAAO,IAAI,CAAA,CAAA;AAC9B,EAAA,MAAM,YAAe,GAAAC,iBAAA;AAAA,IACnB,CAAC,cAAsB,KAAmB,KAAA;AACxC,MAAM,MAAA,yBAAA,GAA4B,WAAW,OAAQ,CAAA,QAAA,CAAA;AAErD,MAAI,IAAA,OAAA,CAAQ,GAAI,CAAA,QAAA,KAAa,YAAc,EAAA;AACzC,QAAA,IAAI,6BAA6B,UAAY,EAAA;AAC3C,UAAQ,OAAA,CAAA,IAAA;AAAA,YACN,iIAAA;AAAA,WACF,CAAA;AACA,UAAa,UAAA,GAAA,IAAA,CAAA;AAAA,SACf;AAAA,OACF;AAEA,MAAA,SAAS,gBAAmB,GAAA;AAC1B,QAAA,IAAI,WAAW,OAAS,EAAA;AACtB,UAAA,IAAI,yBAA2B,EAAA;AAC7B,YAAA,OAAA,CAAQ,SAAS,YAAY,CAAA,CAAA;AAAA,WAC/B;AAAA,SACF;AAAA,OACF;AAEA,MAAA,IAAI,KAAO,EAAA;AACT,QAAA,UAAA,CAAW,kBAAkB,KAAK,CAAA,CAAA;AAAA,OAC7B,MAAA;AACL,QAAiB,gBAAA,EAAA,CAAA;AAAA,OACnB;AAAA,KACF;AAAA,IACA,CAAC,OAAO,CAAA;AAAA,GACV,CAAA;AAEA,EAAA,MAAM,QAAW,GAAAC,aAAA;AAAA,IACf,MACE,gBAAmB,GAAA,CAAA,GACfC,iBAAS,CAAA,YAAA,EAAc,gBAAgB,CACvC,GAAA,YAAA;AAAA,IACN,CAAC,cAAc,gBAAgB,CAAA;AAAA,GACjC,CAAA;AAEA,EAAA,MAAM,aAAgB,GAAAD,aAAA;AAAA,IACpB,OAAO;AAAA,MACL,GAAG,OAAA;AAAA,MACH,QAAA;AAAA,KACF,CAAA;AAAA,IACA,CAAC,SAAS,QAAQ,CAAA;AAAA,GACpB,CAAA;AAEA,EAAAE,eAAA;AAAA,IACE,MAAM,MAAM;AACV,MAAA,UAAA,CAAW,OAAU,GAAA,KAAA,CAAA;AAAA,KACvB;AAAA,IACA,EAAC;AAAA,GACH,CAAA;AAEA,EAAO,OAAA,aAAA,CAAA;AACT;;;;"}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var styleInject_es = require('../../../../node_modules/style-inject/dist/style-inject.es.js');
|
|
4
|
+
|
|
5
|
+
var css_248z = "/* Style applied to BorderItem when `sticky` positioning is on */\n.saltBorderItem-sticky {\n position: sticky;\n overflow: auto;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n}\n";
|
|
6
|
+
styleInject_es(css_248z);
|
|
7
|
+
|
|
8
|
+
module.exports = css_248z;
|
|
9
|
+
//# sourceMappingURL=BorderItem.css.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"BorderItem.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;"}
|
|
@@ -0,0 +1,54 @@
|
|
|
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 cx = require('classnames');
|
|
8
|
+
var GridItem = require('../grid-item/GridItem.js');
|
|
9
|
+
require('./BorderItem.css.js');
|
|
10
|
+
var makePrefixer = require('../utils/makePrefixer.js');
|
|
11
|
+
require('../utils/useId.js');
|
|
12
|
+
require('../salt-provider/SaltProvider.js');
|
|
13
|
+
require('../viewport/ViewportProvider.js');
|
|
14
|
+
|
|
15
|
+
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
16
|
+
|
|
17
|
+
var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
|
|
18
|
+
|
|
19
|
+
const BORDER_POSITION = [
|
|
20
|
+
"north",
|
|
21
|
+
"west",
|
|
22
|
+
"center",
|
|
23
|
+
"east",
|
|
24
|
+
"south"
|
|
25
|
+
];
|
|
26
|
+
const withBaseName = makePrefixer.makePrefixer("saltBorderItem");
|
|
27
|
+
const BorderItem = React.forwardRef(
|
|
28
|
+
({
|
|
29
|
+
children,
|
|
30
|
+
className,
|
|
31
|
+
position,
|
|
32
|
+
sticky = false,
|
|
33
|
+
style,
|
|
34
|
+
...rest
|
|
35
|
+
}, ref) => {
|
|
36
|
+
const gridItemStyles = {
|
|
37
|
+
...style,
|
|
38
|
+
"--gridItem-gridArea": position
|
|
39
|
+
};
|
|
40
|
+
return /* @__PURE__ */ jsxRuntime.jsx(GridItem.GridItem, {
|
|
41
|
+
ref,
|
|
42
|
+
className: cx__default["default"](withBaseName(), className, "saltGridItem-area", {
|
|
43
|
+
[withBaseName("sticky")]: sticky
|
|
44
|
+
}),
|
|
45
|
+
style: gridItemStyles,
|
|
46
|
+
...rest,
|
|
47
|
+
children
|
|
48
|
+
});
|
|
49
|
+
}
|
|
50
|
+
);
|
|
51
|
+
|
|
52
|
+
exports.BORDER_POSITION = BORDER_POSITION;
|
|
53
|
+
exports.BorderItem = BorderItem;
|
|
54
|
+
//# sourceMappingURL=BorderItem.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"BorderItem.js","sources":["../src/border-item/BorderItem.tsx"],"sourcesContent":["import { forwardRef, ElementType, ReactElement } from \"react\";\nimport cx from \"classnames\";\nimport { GridItem, GridItemProps } from \"../grid-item\";\nimport \"./BorderItem.css\";\nimport {\n makePrefixer,\n PolymorphicComponentPropWithRef,\n PolymorphicRef,\n} from \"../utils\";\n\nexport const BORDER_POSITION = [\n \"north\",\n \"west\",\n \"center\",\n \"east\",\n \"south\",\n] as const;\n\nexport type BorderPosition = typeof BORDER_POSITION[number];\n\nexport type BorderItemProps<T extends ElementType> =\n PolymorphicComponentPropWithRef<\n T,\n {\n /**\n * Aligns a grid item inside a cell along the inline (row) axis. Defaults to \"stretch\"\n */\n horizontalAlignment?: GridItemProps<T>[\"horizontalAlignment\"];\n /**\n * Aligns a grid item inside a cell along the block (column) axis. Defaults to \"stretch\"\n */\n verticalAlignment?: GridItemProps<T>[\"verticalAlignment\"];\n /**\n * Position in the border layout\n */\n position: BorderPosition;\n /**\n * Defines if the item should stick to the edges of its container. Defaults to \"false\"\n */\n sticky?: boolean;\n }\n >;\n\nconst withBaseName = makePrefixer(\"saltBorderItem\");\n\ntype BorderItemComponent = <T extends ElementType = \"div\">(\n props: BorderItemProps<T>\n) => ReactElement | null;\n\nexport const BorderItem: BorderItemComponent = forwardRef(\n <T extends ElementType>(\n {\n children,\n className,\n position,\n sticky = false,\n style,\n ...rest\n }: BorderItemProps<T>,\n ref?: PolymorphicRef<T>\n ) => {\n const gridItemStyles = {\n ...style,\n \"--gridItem-gridArea\": position,\n };\n\n return (\n <GridItem\n ref={ref}\n className={cx(withBaseName(), className, \"saltGridItem-area\", {\n [withBaseName(\"sticky\")]: sticky,\n })}\n style={gridItemStyles}\n {...rest}\n >\n {children}\n </GridItem>\n );\n }\n);\n"],"names":["makePrefixer","forwardRef","jsx","GridItem","cx"],"mappings":";;;;;;;;;;;;;;;;;;AAUO,MAAM,eAAkB,GAAA;AAAA,EAC7B,OAAA;AAAA,EACA,MAAA;AAAA,EACA,QAAA;AAAA,EACA,MAAA;AAAA,EACA,OAAA;AACF,EAAA;AA2BA,MAAM,YAAA,GAAeA,0BAAa,gBAAgB,CAAA,CAAA;AAM3C,MAAM,UAAkC,GAAAC,gBAAA;AAAA,EAC7C,CACE;AAAA,IACE,QAAA;AAAA,IACA,SAAA;AAAA,IACA,QAAA;AAAA,IACA,MAAS,GAAA,KAAA;AAAA,IACT,KAAA;AAAA,IACG,GAAA,IAAA;AAAA,KAEL,GACG,KAAA;AACH,IAAA,MAAM,cAAiB,GAAA;AAAA,MACrB,GAAG,KAAA;AAAA,MACH,qBAAuB,EAAA,QAAA;AAAA,KACzB,CAAA;AAEA,IAAA,uBACGC,cAAA,CAAAC,iBAAA,EAAA;AAAA,MACC,GAAA;AAAA,MACA,SAAW,EAAAC,sBAAA,CAAG,YAAa,EAAA,EAAG,WAAW,mBAAqB,EAAA;AAAA,QAC5D,CAAC,YAAa,CAAA,QAAQ,CAAI,GAAA,MAAA;AAAA,OAC3B,CAAA;AAAA,MACD,KAAO,EAAA,cAAA;AAAA,MACN,GAAG,IAAA;AAAA,MAEH,QAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;;"}
|
|
@@ -0,0 +1,59 @@
|
|
|
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 cx = require('classnames');
|
|
8
|
+
var GridLayout = require('../grid-layout/GridLayout.js');
|
|
9
|
+
var makePrefixer = require('../utils/makePrefixer.js');
|
|
10
|
+
require('../utils/useId.js');
|
|
11
|
+
require('../salt-provider/SaltProvider.js');
|
|
12
|
+
require('../viewport/ViewportProvider.js');
|
|
13
|
+
|
|
14
|
+
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
15
|
+
|
|
16
|
+
var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
|
|
17
|
+
|
|
18
|
+
const withBaseName = makePrefixer.makePrefixer("saltBorderLayout");
|
|
19
|
+
const numberOfColumns = 3;
|
|
20
|
+
const BorderLayout = React.forwardRef(
|
|
21
|
+
({ children, className, gap, style, ...rest }, ref) => {
|
|
22
|
+
const borderAreas = React.Children.map(
|
|
23
|
+
children,
|
|
24
|
+
(child) => child.props.position
|
|
25
|
+
);
|
|
26
|
+
const topSection = borderAreas.includes("north") ? "north ".repeat(numberOfColumns) : "none ".repeat(numberOfColumns);
|
|
27
|
+
const leftSection = borderAreas.includes("west") ? "west" : "center";
|
|
28
|
+
const rightSection = borderAreas.includes("east") ? "east" : "center";
|
|
29
|
+
const midSection = `${leftSection} center ${rightSection}`;
|
|
30
|
+
const bottomSection = borderAreas.includes("south") ? "south ".repeat(numberOfColumns) : "none ".repeat(numberOfColumns);
|
|
31
|
+
const gridTemplateAreas = `"${topSection}" "${midSection}" "${bottomSection}"`;
|
|
32
|
+
const hasMainSection = borderAreas.includes("center");
|
|
33
|
+
React.useEffect(() => {
|
|
34
|
+
if (process.env.NODE_ENV !== "production") {
|
|
35
|
+
if (!hasMainSection) {
|
|
36
|
+
console.warn(
|
|
37
|
+
"No main section has been found. A main section should be provided."
|
|
38
|
+
);
|
|
39
|
+
}
|
|
40
|
+
}
|
|
41
|
+
}, [hasMainSection]);
|
|
42
|
+
const borderLayoutStyles = {
|
|
43
|
+
...style,
|
|
44
|
+
"--gridLayout-gridTemplate": gridTemplateAreas
|
|
45
|
+
};
|
|
46
|
+
return /* @__PURE__ */ jsxRuntime.jsx(GridLayout.GridLayout, {
|
|
47
|
+
className: cx__default["default"](withBaseName(), className, "saltGridLayout-area"),
|
|
48
|
+
columns: numberOfColumns,
|
|
49
|
+
gap: gap || 0,
|
|
50
|
+
style: borderLayoutStyles,
|
|
51
|
+
ref,
|
|
52
|
+
...rest,
|
|
53
|
+
children
|
|
54
|
+
});
|
|
55
|
+
}
|
|
56
|
+
);
|
|
57
|
+
|
|
58
|
+
exports.BorderLayout = BorderLayout;
|
|
59
|
+
//# sourceMappingURL=BorderLayout.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"BorderLayout.js","sources":["../src/border-layout/BorderLayout.tsx"],"sourcesContent":["import {\n Children,\n forwardRef,\n ReactElement,\n useEffect,\n ElementType,\n} from \"react\";\nimport cx from \"classnames\";\n\nimport { GridLayout, GridLayoutProps } from \"../grid-layout\";\nimport {\n makePrefixer,\n PolymorphicRef,\n PolymorphicComponentPropWithRef,\n} from \"../utils\";\nimport { BorderItemProps } from \"../border-item\";\n\nexport type BorderLayoutProps<T extends ElementType> =\n PolymorphicComponentPropWithRef<\n T,\n {\n /**\n * Defines the size of the gutter between the columns and the rows by setting a density multiplier. Defaults to 0\n */\n gap?: GridLayoutProps<T>[\"gap\"];\n /**\n * Defines the size of the gutter between the columns by setting a density multiplier. Defaults to 0\n */\n columnGap?: GridLayoutProps<T>[\"columnGap\"];\n /**\n * Defines the size of the gutter between the rows by setting a density multiplier. Defaults to 0\n */\n rowGap?: GridLayoutProps<T>[\"rowGap\"];\n /**\n * Border item components to be rendered.\n */\n children: ReactElement<BorderItemProps<T>>[];\n }\n >;\n\nconst withBaseName = makePrefixer(\"saltBorderLayout\");\n\nconst numberOfColumns = 3;\n\ntype BorderLayoutComponent = <T extends ElementType = \"div\">(\n props: BorderLayoutProps<T>\n) => ReactElement | null;\n\nexport const BorderLayout: BorderLayoutComponent = forwardRef(\n <T extends ElementType>(\n { children, className, gap, style, ...rest }: BorderLayoutProps<T>,\n ref?: PolymorphicRef<T>\n ) => {\n const borderAreas = Children.map(\n children,\n (child: ReactElement<BorderItemProps<T>>) => child.props.position\n );\n\n const topSection = borderAreas.includes(\"north\")\n ? \"north \".repeat(numberOfColumns)\n : \"none \".repeat(numberOfColumns);\n\n const leftSection = borderAreas.includes(\"west\") ? \"west\" : \"center\";\n\n const rightSection = borderAreas.includes(\"east\") ? \"east\" : \"center\";\n\n const midSection = `${leftSection} center ${rightSection}`;\n\n const bottomSection = borderAreas.includes(\"south\")\n ? \"south \".repeat(numberOfColumns)\n : \"none \".repeat(numberOfColumns);\n\n const gridTemplateAreas = `\"${topSection}\" \"${midSection}\" \"${bottomSection}\"`;\n\n const hasMainSection = borderAreas.includes(\"center\");\n\n useEffect(() => {\n if (process.env.NODE_ENV !== \"production\") {\n if (!hasMainSection) {\n console.warn(\n \"No main section has been found. A main section should be provided.\"\n );\n }\n }\n }, [hasMainSection]);\n\n const borderLayoutStyles = {\n ...style,\n \"--gridLayout-gridTemplate\": gridTemplateAreas,\n };\n\n return (\n <GridLayout\n className={cx(withBaseName(), className, \"saltGridLayout-area\")}\n columns={numberOfColumns}\n gap={gap || 0}\n style={borderLayoutStyles}\n ref={ref}\n {...rest}\n >\n {children}\n </GridLayout>\n );\n }\n);\n"],"names":["makePrefixer","forwardRef","Children","useEffect","jsx","GridLayout","cx"],"mappings":";;;;;;;;;;;;;;;;;AAwCA,MAAM,YAAA,GAAeA,0BAAa,kBAAkB,CAAA,CAAA;AAEpD,MAAM,eAAkB,GAAA,CAAA,CAAA;AAMjB,MAAM,YAAsC,GAAAC,gBAAA;AAAA,EACjD,CACE,EAAE,QAAU,EAAA,SAAA,EAAW,KAAK,KAAU,EAAA,GAAA,IAAA,IACtC,GACG,KAAA;AACH,IAAA,MAAM,cAAcC,cAAS,CAAA,GAAA;AAAA,MAC3B,QAAA;AAAA,MACA,CAAC,KAA4C,KAAA,KAAA,CAAM,KAAM,CAAA,QAAA;AAAA,KAC3D,CAAA;AAEA,IAAM,MAAA,UAAA,GAAa,WAAY,CAAA,QAAA,CAAS,OAAO,CAAA,GAC3C,QAAS,CAAA,MAAA,CAAO,eAAe,CAAA,GAC/B,OAAQ,CAAA,MAAA,CAAO,eAAe,CAAA,CAAA;AAElC,IAAA,MAAM,WAAc,GAAA,WAAA,CAAY,QAAS,CAAA,MAAM,IAAI,MAAS,GAAA,QAAA,CAAA;AAE5D,IAAA,MAAM,YAAe,GAAA,WAAA,CAAY,QAAS,CAAA,MAAM,IAAI,MAAS,GAAA,QAAA,CAAA;AAE7D,IAAM,MAAA,UAAA,GAAa,GAAG,WAAsB,CAAA,QAAA,EAAA,YAAA,CAAA,CAAA,CAAA;AAE5C,IAAM,MAAA,aAAA,GAAgB,WAAY,CAAA,QAAA,CAAS,OAAO,CAAA,GAC9C,QAAS,CAAA,MAAA,CAAO,eAAe,CAAA,GAC/B,OAAQ,CAAA,MAAA,CAAO,eAAe,CAAA,CAAA;AAElC,IAAM,MAAA,iBAAA,GAAoB,CAAI,CAAA,EAAA,UAAA,CAAA,GAAA,EAAgB,UAAgB,CAAA,GAAA,EAAA,aAAA,CAAA,CAAA,CAAA,CAAA;AAE9D,IAAM,MAAA,cAAA,GAAiB,WAAY,CAAA,QAAA,CAAS,QAAQ,CAAA,CAAA;AAEpD,IAAAC,eAAA,CAAU,MAAM;AACd,MAAI,IAAA,OAAA,CAAQ,GAAI,CAAA,QAAA,KAAa,YAAc,EAAA;AACzC,QAAA,IAAI,CAAC,cAAgB,EAAA;AACnB,UAAQ,OAAA,CAAA,IAAA;AAAA,YACN,oEAAA;AAAA,WACF,CAAA;AAAA,SACF;AAAA,OACF;AAAA,KACF,EAAG,CAAC,cAAc,CAAC,CAAA,CAAA;AAEnB,IAAA,MAAM,kBAAqB,GAAA;AAAA,MACzB,GAAG,KAAA;AAAA,MACH,2BAA6B,EAAA,iBAAA;AAAA,KAC/B,CAAA;AAEA,IAAA,uBACGC,cAAA,CAAAC,qBAAA,EAAA;AAAA,MACC,SAAW,EAAAC,sBAAA,CAAG,YAAa,EAAA,EAAG,WAAW,qBAAqB,CAAA;AAAA,MAC9D,OAAS,EAAA,eAAA;AAAA,MACT,KAAK,GAAO,IAAA,CAAA;AAAA,MACZ,KAAO,EAAA,kBAAA;AAAA,MACP,GAAA;AAAA,MACC,GAAG,IAAA;AAAA,MAEH,QAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
const breakpoints = {
|
|
6
|
+
xs: 0,
|
|
7
|
+
sm: 600,
|
|
8
|
+
md: 960,
|
|
9
|
+
lg: 1280,
|
|
10
|
+
xl: 1920
|
|
11
|
+
};
|
|
12
|
+
const DEFAULT_BREAKPOINTS = breakpoints;
|
|
13
|
+
|
|
14
|
+
exports.DEFAULT_BREAKPOINTS = DEFAULT_BREAKPOINTS;
|
|
15
|
+
//# sourceMappingURL=Breakpoints.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Breakpoints.js","sources":["../src/breakpoints/Breakpoints.tsx"],"sourcesContent":["export type Breakpoints = {\n xs: number;\n sm: number;\n md: number;\n lg: number;\n xl: number;\n};\n\nconst breakpoints: Breakpoints = {\n xs: 0,\n sm: 600,\n md: 960,\n lg: 1280,\n xl: 1920,\n};\n\nexport const DEFAULT_BREAKPOINTS = breakpoints;\n"],"names":[],"mappings":";;;;AAQA,MAAM,WAA2B,GAAA;AAAA,EAC/B,EAAI,EAAA,CAAA;AAAA,EACJ,EAAI,EAAA,GAAA;AAAA,EACJ,EAAI,EAAA,GAAA;AAAA,EACJ,EAAI,EAAA,IAAA;AAAA,EACJ,EAAI,EAAA,IAAA;AACN,CAAA,CAAA;AAEO,MAAM,mBAAsB,GAAA;;;;"}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var styleInject_es = require('../../../../node_modules/style-inject/dist/style-inject.es.js');
|
|
4
|
+
|
|
5
|
+
var css_248z = "/* Styles applied to the root element if variant=\"cta\" */\n.saltButton-cta {\n --button-background: var(--salt-actionable-cta-background);\n --button-background-active: var(--salt-actionable-cta-background-active);\n --button-background-disabled: var(--salt-actionable-cta-background-disabled);\n --button-background-hover: var(--salt-actionable-cta-background-hover);\n --button-fontWeight: var(--salt-actionable-cta-fontWeight);\n --button-text-color: var(--salt-actionable-cta-foreground);\n --button-text-color-active: var(--salt-actionable-cta-foreground-active);\n --button-text-color-disabled: var(--salt-actionable-cta-foreground-disabled);\n --button-text-color-hover: var(--salt-actionable-cta-foreground-hover);\n}\n\n/* Icon API in \"CTA\" variant @ignore */\n.saltButton-cta {\n --saltIcon-color: var(--salt-actionable-cta-foreground);\n}\n.saltButton-cta:hover {\n --saltIcon-color: var(--salt-actionable-cta-foreground-hover);\n}\n.saltButton-cta:active,\n.saltButton-cta.saltButton-active {\n --saltIcon-color: var(--salt-actionable-cta-foreground-active);\n}\n.saltButton-cta.saltButton-disabled {\n --saltIcon-color: var(--salt-actionable-cta-foreground-disabled);\n}\n\n/* Styles applied to the root element if variant=\"primary\" (or no variant specified) */\n.saltButton-primary {\n --button-background: var(--salt-actionable-primary-background);\n --button-background-active: var(--salt-actionable-primary-background-active);\n --button-background-disabled: var(--salt-actionable-primary-background-disabled);\n --button-background-hover: var(--salt-actionable-primary-background-hover);\n --button-fontWeight: var(--salt-actionable-primary-fontWeight);\n --button-text-color: var(--salt-actionable-primary-foreground);\n --button-text-color-active: var(--salt-actionable-primary-foreground-active);\n --button-text-color-disabled: var(--salt-actionable-primary-foreground-disabled);\n --button-text-color-hover: var(--salt-actionable-primary-foreground-hover);\n}\n\n/* Icon API in \"primary\" variant @ignore */\n.saltButton-primary {\n --saltIcon-color: var(--salt-actionable-primary-foreground);\n}\n.saltButton-primary:hover {\n --saltIcon-color: var(--salt-actionable-primary-foreground-hover);\n}\n.saltButton-primary:active,\n.saltButton-primary.saltButton-active {\n --saltIcon-color: var(--salt-actionable-primary-foreground-active);\n}\n.saltButton-primary.saltButton-disabled {\n --saltIcon-color: var(--salt-actionable-primary-foreground-disabled);\n}\n\n/* Styles applied to the root element if variant=\"secondary\" */\n.saltButton-secondary {\n --button-background: var(--salt-actionable-secondary-background);\n --button-background-active: var(--salt-actionable-secondary-background-active);\n --button-background-disabled: var(--salt-actionable-secondary-background-disabled);\n --button-background-hover: var(--salt-actionable-secondary-background-hover);\n --button-fontWeight: var(--salt-actionable-secondary-fontWeight);\n --button-text-color: var(--salt-actionable-secondary-foreground);\n --button-text-color-active: var(--salt-actionable-secondary-foreground-active);\n --button-text-color-disabled: var(--salt-actionable-secondary-foreground-disabled);\n --button-text-color-hover: var(--salt-actionable-secondary-foreground-hover);\n}\n\n/* Icon API in \"secondary\" variant @ignore */\n.saltButton-secondary {\n --saltIcon-color: var(--salt-actionable-secondary-foreground);\n}\n\n.saltButton-secondary:hover {\n --saltIcon-color: var(--salt-actionable-secondary-foreground-hover);\n}\n.saltButton-secondary:active,\n.saltButton-secondary.saltButton-active {\n --saltIcon-color: var(--salt-actionable-secondary-foreground-active);\n}\n.saltButton-secondary.saltButton-disabled {\n --saltIcon-color: var(--salt-actionable-secondary-foreground-disabled);\n}\n\n.saltButton {\n align-items: var(--saltButton-alignItems, center);\n appearance: none;\n background: var(--saltButton-background, var(--button-background));\n border-color: var(--saltButton-borderColor, transparent);\n border-style: var(--saltButton-borderStyle, solid);\n border-width: var(--saltButton-borderWidth, 0);\n border-radius: var(--saltButton-borderRadius, 0);\n color: var(--saltButton-text-color, var(--button-text-color));\n cursor: var(--saltButton-cursor, pointer);\n display: inline-flex;\n justify-content: var(--saltButton-justifyContent, center);\n font-size: var(--saltButton-fontSize, var(--salt-text-fontSize));\n font-family: var(--saltButton-fontFamily, var(--salt-text-fontFamily));\n line-height: var(--saltButton-lineHeight, var(--salt-text-lineHeight));\n letter-spacing: var(--saltButton-letterSpacing, var(--salt-actionable-letterSpacing));\n text-transform: var(--saltButton-textTransform, var(--salt-actionable-textTransform));\n padding: 0 var(--saltButton-padding, var(--salt-size-unit));\n margin: var(--saltButton-margin, 0);\n height: var(--saltButton-height, var(--salt-size-base));\n min-width: var(--saltButton-minWidth, unset);\n min-height: 0;\n position: relative;\n text-align: var(--saltButton-textAlign, var(--salt-actionable-textAlign));\n text-decoration: none;\n transition: none;\n user-select: none;\n width: var(--saltButton-width, auto);\n -webkit-appearance: none;\n -webkit-tap-highlight-color: transparent;\n /* Styles applied to align children*/\n font-weight: var(--saltButton-fontWeight, var(--button-fontWeight));\n white-space: pre;\n}\n\n/* Pseudo-class applied to the root element on focus */\n.saltButton:focus-visible {\n outline-style: var(--salt-focused-outlineStyle);\n outline-width: var(--salt-focused-outlineWidth);\n outline-color: var(--salt-focused-outlineColor);\n outline-offset: var(--salt-focused-outlineOffset);\n background: var(--saltButton-background-hover, var(--button-background-hover));\n color: var(--saltButton-text-color-hover, var(--button-text-color-hover));\n}\n\n/* Pseudo-class applied to the root element on focus when Button is active */\n.saltButton.saltButton-active:focus-visible,\n.saltButton:focus-visible(:active) {\n background: var(--saltButton-background-active-hover, var(--button-background));\n color: var(--saltButton-text-color-active-hover, var(--button-text-color));\n}\n\n/* Pseudo-class applied to the root element on hover when Button is not active or disabled */\n.saltButton:hover {\n background: var(--saltButton-background-hover, var(--button-background-hover));\n color: var(--saltButton-text-color-hover, var(--button-text-color-hover));\n}\n\n/* Pseudo-class applied to the root element when Button is active and not disabled */\n.saltButton:active,\n.saltButton.saltButton-active {\n background: var(--saltButton-background-active, var(--button-background-active));\n color: var(--saltButton-text-color-active, var(--button-text-color-active));\n}\n\n/* Pseudo-class applied to the root element if disabled={true} */\n.saltButton:disabled,\n.saltButton-disabled,\n /* Overrides to apply the disabled style when the button is focusable while also disabled */\n.saltButton-disabled:active,\n.saltButton-disabled:focus-visible,\n.saltButton-disabled:hover {\n background: var(--saltButton-background-disabled, var(--button-background-disabled));\n color: var(--saltButton-text-color-disabled, var(--button-text-color-disabled));\n cursor: var(--saltButton-cursor-disabled, var(--salt-actionable-cursor-disabled));\n}\n\n.saltButton[href] {\n display: inline-flex;\n}\n";
|
|
6
|
+
styleInject_es(css_248z);
|
|
7
|
+
|
|
8
|
+
module.exports = css_248z;
|
|
9
|
+
//# sourceMappingURL=Button.css.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Button.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;"}
|
|
@@ -0,0 +1,60 @@
|
|
|
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 cx = require('classnames');
|
|
8
|
+
var makePrefixer = require('../utils/makePrefixer.js');
|
|
9
|
+
require('../utils/useId.js');
|
|
10
|
+
require('../salt-provider/SaltProvider.js');
|
|
11
|
+
require('../viewport/ViewportProvider.js');
|
|
12
|
+
require('./Button.css.js');
|
|
13
|
+
var useButton = require('./useButton.js');
|
|
14
|
+
|
|
15
|
+
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
16
|
+
|
|
17
|
+
var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
|
|
18
|
+
|
|
19
|
+
const withBaseName = makePrefixer.makePrefixer("saltButton");
|
|
20
|
+
const ButtonVariantValues = ["primary", "secondary", "cta"];
|
|
21
|
+
const Button = React.forwardRef(
|
|
22
|
+
function Button2({
|
|
23
|
+
children,
|
|
24
|
+
className,
|
|
25
|
+
disabled,
|
|
26
|
+
focusableWhenDisabled,
|
|
27
|
+
onKeyUp,
|
|
28
|
+
onKeyDown,
|
|
29
|
+
onBlur,
|
|
30
|
+
onClick,
|
|
31
|
+
type = "button",
|
|
32
|
+
variant = "primary",
|
|
33
|
+
...restProps
|
|
34
|
+
}, ref) {
|
|
35
|
+
const { active, buttonProps } = useButton.useButton({
|
|
36
|
+
disabled,
|
|
37
|
+
focusableWhenDisabled,
|
|
38
|
+
onKeyUp,
|
|
39
|
+
onKeyDown,
|
|
40
|
+
onBlur,
|
|
41
|
+
onClick
|
|
42
|
+
});
|
|
43
|
+
const { tabIndex, ...restButtonProps } = buttonProps;
|
|
44
|
+
return /* @__PURE__ */ jsxRuntime.jsx("button", {
|
|
45
|
+
...restButtonProps,
|
|
46
|
+
className: cx__default["default"](withBaseName(), className, withBaseName(variant), {
|
|
47
|
+
[withBaseName("disabled")]: disabled,
|
|
48
|
+
[withBaseName("active")]: active
|
|
49
|
+
}),
|
|
50
|
+
...restProps,
|
|
51
|
+
ref,
|
|
52
|
+
type,
|
|
53
|
+
children
|
|
54
|
+
});
|
|
55
|
+
}
|
|
56
|
+
);
|
|
57
|
+
|
|
58
|
+
exports.Button = Button;
|
|
59
|
+
exports.ButtonVariantValues = ButtonVariantValues;
|
|
60
|
+
//# sourceMappingURL=Button.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Button.js","sources":["../src/button/Button.tsx"],"sourcesContent":["import { ComponentPropsWithoutRef, forwardRef, ReactElement } from \"react\";\nimport cx from \"classnames\";\nimport { makePrefixer } from \"../utils\";\n\nimport \"./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 // 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={cx(withBaseName(), className, withBaseName(variant), {\n [withBaseName(\"disabled\")]: disabled,\n [withBaseName(\"active\")]: active,\n })}\n {...restProps}\n ref={ref}\n type={type}\n >\n {children}\n </button>\n );\n }\n);\n"],"names":["makePrefixer","forwardRef","Button","useButton","jsx","cx"],"mappings":";;;;;;;;;;;;;;;;;;AAOA,MAAM,YAAA,GAAeA,0BAAa,YAAY,CAAA,CAAA;AAEvC,MAAM,mBAAsB,GAAA,CAAC,SAAW,EAAA,WAAA,EAAa,KAAK,EAAA;AAmB1D,MAAM,MAAS,GAAAC,gBAAA;AAAA,EACpB,SAASC,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,GAAIC,mBAAU,CAAA;AAAA,MACxC,QAAA;AAAA,MACA,qBAAA;AAAA,MACA,OAAA;AAAA,MACA,SAAA;AAAA,MACA,MAAA;AAAA,MACA,OAAA;AAAA,KACD,CAAA,CAAA;AAGD,IAAM,MAAA,EAAE,QAAa,EAAA,GAAA,eAAA,EAAoB,GAAA,WAAA,CAAA;AACzC,IAAA,uBACGC,cAAA,CAAA,QAAA,EAAA;AAAA,MACE,GAAG,eAAA;AAAA,MACJ,WAAWC,sBAAG,CAAA,YAAA,IAAgB,SAAW,EAAA,YAAA,CAAa,OAAO,CAAG,EAAA;AAAA,QAC9D,CAAC,YAAa,CAAA,UAAU,CAAI,GAAA,QAAA;AAAA,QAC5B,CAAC,YAAa,CAAA,QAAQ,CAAI,GAAA,MAAA;AAAA,OAC3B,CAAA;AAAA,MACA,GAAG,SAAA;AAAA,MACJ,GAAA;AAAA,MACA,IAAA;AAAA,MAEC,QAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;;"}
|
|
@@ -0,0 +1,65 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
var React = require('react');
|
|
6
|
+
|
|
7
|
+
const useButton = ({
|
|
8
|
+
disabled,
|
|
9
|
+
focusableWhenDisabled,
|
|
10
|
+
onKeyUp,
|
|
11
|
+
onKeyDown,
|
|
12
|
+
onClick,
|
|
13
|
+
onBlur
|
|
14
|
+
}) => {
|
|
15
|
+
const [keyIsDown, setkeyIsDown] = React.useState("");
|
|
16
|
+
const [active, setActive] = React.useState(false);
|
|
17
|
+
const enter = "Enter";
|
|
18
|
+
const space = " ";
|
|
19
|
+
React.useEffect(() => {
|
|
20
|
+
const t = setTimeout(() => {
|
|
21
|
+
if (keyIsDown !== enter && keyIsDown !== space) {
|
|
22
|
+
setActive(false);
|
|
23
|
+
}
|
|
24
|
+
}, 0);
|
|
25
|
+
return () => {
|
|
26
|
+
clearTimeout(t);
|
|
27
|
+
};
|
|
28
|
+
}, [active, keyIsDown]);
|
|
29
|
+
const handleKeyUp = (event) => {
|
|
30
|
+
setkeyIsDown("");
|
|
31
|
+
setActive(false);
|
|
32
|
+
onKeyUp == null ? void 0 : onKeyUp(event);
|
|
33
|
+
};
|
|
34
|
+
const handleClick = (event) => {
|
|
35
|
+
setActive(true);
|
|
36
|
+
onClick == null ? void 0 : onClick(event);
|
|
37
|
+
};
|
|
38
|
+
const handleBlur = (event) => {
|
|
39
|
+
setActive(false);
|
|
40
|
+
onBlur == null ? void 0 : onBlur(event);
|
|
41
|
+
};
|
|
42
|
+
const handleKeyDown = (event) => {
|
|
43
|
+
if (event.key === enter || event.key === space) {
|
|
44
|
+
setkeyIsDown(event.key);
|
|
45
|
+
setActive(true);
|
|
46
|
+
}
|
|
47
|
+
onKeyDown == null ? void 0 : onKeyDown(event);
|
|
48
|
+
};
|
|
49
|
+
const buttonProps = {
|
|
50
|
+
"aria-disabled": disabled && focusableWhenDisabled ? true : void 0,
|
|
51
|
+
disabled: disabled && !focusableWhenDisabled,
|
|
52
|
+
tabIndex: disabled && !focusableWhenDisabled ? -1 : 0,
|
|
53
|
+
onBlur: handleBlur,
|
|
54
|
+
onClick: !disabled ? handleClick : void 0,
|
|
55
|
+
onKeyDown: handleKeyDown,
|
|
56
|
+
onKeyUp: handleKeyUp
|
|
57
|
+
};
|
|
58
|
+
return {
|
|
59
|
+
active,
|
|
60
|
+
buttonProps
|
|
61
|
+
};
|
|
62
|
+
};
|
|
63
|
+
|
|
64
|
+
exports.useButton = useButton;
|
|
65
|
+
//# sourceMappingURL=useButton.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useButton.js","sources":["../src/button/useButton.ts"],"sourcesContent":["import {\n FocusEvent,\n KeyboardEvent,\n MouseEvent,\n useEffect,\n useState,\n} from \"react\";\n\nexport interface ButtonHookProps<T extends Element> {\n disabled?: boolean;\n focusableWhenDisabled?: boolean;\n onKeyUp?: (event: KeyboardEvent<T>) => void;\n onKeyDown?: (event: KeyboardEvent<T>) => void;\n onClick?: (event: MouseEvent<T>) => void;\n onBlur?: (event: FocusEvent<T>) => void;\n}\n\nexport interface ButtonHookResult<T extends Element> {\n active: boolean;\n buttonProps: {\n \"aria-disabled\"?: boolean;\n disabled?: boolean;\n tabIndex: number;\n onBlur: (event: FocusEvent<T>) => void;\n onClick?: (event: MouseEvent<T>) => void;\n onKeyDown: (event: KeyboardEvent<T>) => void;\n onKeyUp: (event: KeyboardEvent<T>) => void;\n };\n}\n\nexport const useButton = <T extends Element>({\n disabled,\n focusableWhenDisabled,\n onKeyUp,\n onKeyDown,\n onClick,\n onBlur,\n}: ButtonHookProps<T>): ButtonHookResult<T> => {\n const [keyIsDown, setkeyIsDown] = useState(\"\");\n const [active, setActive] = useState(false);\n\n const enter = \"Enter\";\n const space = \" \";\n\n useEffect(() => {\n const t = setTimeout(() => {\n // This key state check is to stop continual visual state change when using Enter Key, which the browser treats as both key and click events on a Button\n // This key state check also fixes Firefox Button where Space key is pressed but button fails to be in active state\n if (keyIsDown !== enter && keyIsDown !== space) {\n setActive(false);\n }\n }, 0);\n\n return () => {\n clearTimeout(t);\n };\n }, [active, keyIsDown]);\n\n const handleKeyUp = (event: KeyboardEvent<T>) => {\n setkeyIsDown(\"\");\n setActive(false);\n onKeyUp?.(event);\n };\n\n const handleClick = (event: MouseEvent<T>) => {\n setActive(true);\n onClick?.(event);\n };\n\n const handleBlur = (event: FocusEvent<T>) => {\n setActive(false);\n onBlur?.(event);\n };\n\n const handleKeyDown = (event: KeyboardEvent<T>) => {\n if (event.key === enter || event.key === space) {\n setkeyIsDown(event.key);\n setActive(true);\n }\n\n onKeyDown?.(event);\n };\n\n const buttonProps = {\n \"aria-disabled\": disabled && focusableWhenDisabled ? true : undefined,\n disabled: disabled && !focusableWhenDisabled,\n tabIndex: disabled && !focusableWhenDisabled ? -1 : 0,\n onBlur: handleBlur,\n onClick: !disabled ? handleClick : undefined,\n onKeyDown: handleKeyDown,\n onKeyUp: handleKeyUp,\n };\n\n return {\n active,\n buttonProps,\n };\n};\n"],"names":["useState","useEffect"],"mappings":";;;;;;AA8BO,MAAM,YAAY,CAAoB;AAAA,EAC3C,QAAA;AAAA,EACA,qBAAA;AAAA,EACA,OAAA;AAAA,EACA,SAAA;AAAA,EACA,OAAA;AAAA,EACA,MAAA;AACF,CAA+C,KAAA;AAC7C,EAAA,MAAM,CAAC,SAAA,EAAW,YAAY,CAAA,GAAIA,eAAS,EAAE,CAAA,CAAA;AAC7C,EAAA,MAAM,CAAC,MAAA,EAAQ,SAAS,CAAA,GAAIA,eAAS,KAAK,CAAA,CAAA;AAE1C,EAAA,MAAM,KAAQ,GAAA,OAAA,CAAA;AACd,EAAA,MAAM,KAAQ,GAAA,GAAA,CAAA;AAEd,EAAAC,eAAA,CAAU,MAAM;AACd,IAAM,MAAA,CAAA,GAAI,WAAW,MAAM;AAGzB,MAAI,IAAA,SAAA,KAAc,KAAS,IAAA,SAAA,KAAc,KAAO,EAAA;AAC9C,QAAA,SAAA,CAAU,KAAK,CAAA,CAAA;AAAA,OACjB;AAAA,OACC,CAAC,CAAA,CAAA;AAEJ,IAAA,OAAO,MAAM;AACX,MAAA,YAAA,CAAa,CAAC,CAAA,CAAA;AAAA,KAChB,CAAA;AAAA,GACC,EAAA,CAAC,MAAQ,EAAA,SAAS,CAAC,CAAA,CAAA;AAEtB,EAAM,MAAA,WAAA,GAAc,CAAC,KAA4B,KAAA;AAC/C,IAAA,YAAA,CAAa,EAAE,CAAA,CAAA;AACf,IAAA,SAAA,CAAU,KAAK,CAAA,CAAA;AACf,IAAU,OAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,OAAA,CAAA,KAAA,CAAA,CAAA;AAAA,GACZ,CAAA;AAEA,EAAM,MAAA,WAAA,GAAc,CAAC,KAAyB,KAAA;AAC5C,IAAA,SAAA,CAAU,IAAI,CAAA,CAAA;AACd,IAAU,OAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,OAAA,CAAA,KAAA,CAAA,CAAA;AAAA,GACZ,CAAA;AAEA,EAAM,MAAA,UAAA,GAAa,CAAC,KAAyB,KAAA;AAC3C,IAAA,SAAA,CAAU,KAAK,CAAA,CAAA;AACf,IAAS,MAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,MAAA,CAAA,KAAA,CAAA,CAAA;AAAA,GACX,CAAA;AAEA,EAAM,MAAA,aAAA,GAAgB,CAAC,KAA4B,KAAA;AACjD,IAAA,IAAI,KAAM,CAAA,GAAA,KAAQ,KAAS,IAAA,KAAA,CAAM,QAAQ,KAAO,EAAA;AAC9C,MAAA,YAAA,CAAa,MAAM,GAAG,CAAA,CAAA;AACtB,MAAA,SAAA,CAAU,IAAI,CAAA,CAAA;AAAA,KAChB;AAEA,IAAY,SAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,SAAA,CAAA,KAAA,CAAA,CAAA;AAAA,GACd,CAAA;AAEA,EAAA,MAAM,WAAc,GAAA;AAAA,IAClB,eAAA,EAAiB,QAAY,IAAA,qBAAA,GAAwB,IAAO,GAAA,KAAA,CAAA;AAAA,IAC5D,QAAA,EAAU,YAAY,CAAC,qBAAA;AAAA,IACvB,QAAU,EAAA,QAAA,IAAY,CAAC,qBAAA,GAAwB,CAAK,CAAA,GAAA,CAAA;AAAA,IACpD,MAAQ,EAAA,UAAA;AAAA,IACR,OAAA,EAAS,CAAC,QAAA,GAAW,WAAc,GAAA,KAAA,CAAA;AAAA,IACnC,SAAW,EAAA,aAAA;AAAA,IACX,OAAS,EAAA,WAAA;AAAA,GACX,CAAA;AAEA,EAAO,OAAA;AAAA,IACL,MAAA;AAAA,IACA,WAAA;AAAA,GACF,CAAA;AACF;;;;"}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var styleInject_es = require('../../../../node_modules/style-inject/dist/style-inject.es.js');
|
|
4
|
+
|
|
5
|
+
var css_248z = "/* Default variables applied to the root element */\n.saltFlexItem {\n --saltFlexItem-alignment: auto;\n --saltFlexItem-shrink: 1;\n --saltFlexItem-grow: 0;\n}\n\n/* Style applied to the root element */\n.saltFlexItem {\n position: relative;\n align-self: var(--saltFlexItem-alignment);\n flex-grow: var(--saltFlexItem-grow);\n flex-shrink: var(--saltFlexItem-shrink);\n}\n\n.saltFlexItem-stacked {\n flex-grow: 2;\n}\n";
|
|
6
|
+
styleInject_es(css_248z);
|
|
7
|
+
|
|
8
|
+
module.exports = css_248z;
|
|
9
|
+
//# sourceMappingURL=FlexItem.css.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"FlexItem.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;"}
|