@salt-ds/core 1.4.0 → 1.6.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/dist-cjs/packages/core/src/aria-announcer/useAriaAnnouncer.js +1 -0
- package/dist-cjs/packages/core/src/aria-announcer/useAriaAnnouncer.js.map +1 -1
- package/dist-cjs/packages/core/src/avatar/Avatar.css.js +1 -1
- package/dist-cjs/packages/core/src/avatar/Avatar.js +11 -3
- package/dist-cjs/packages/core/src/avatar/Avatar.js.map +1 -1
- package/dist-cjs/packages/core/src/avatar/useAvatarImage.js +39 -0
- package/dist-cjs/packages/core/src/avatar/useAvatarImage.js.map +1 -0
- package/dist-cjs/packages/core/src/card/Card.css.js +1 -1
- package/dist-cjs/packages/core/src/card/Card.js +1 -1
- package/dist-cjs/packages/core/src/card/Card.js.map +1 -1
- package/dist-cjs/packages/core/src/card/InteractableCard.css.js +9 -0
- package/dist-cjs/packages/core/src/card/InteractableCard.css.js.map +1 -0
- package/dist-cjs/packages/core/src/card/InteractableCard.js +57 -0
- package/dist-cjs/packages/core/src/card/InteractableCard.js.map +1 -0
- package/dist-cjs/packages/core/src/card/useInteractableCard.js +63 -0
- package/dist-cjs/packages/core/src/card/useInteractableCard.js.map +1 -0
- package/dist-cjs/packages/core/src/checkbox/Checkbox.css.js +9 -0
- package/dist-cjs/packages/core/src/checkbox/Checkbox.css.js.map +1 -0
- package/dist-cjs/packages/core/src/checkbox/Checkbox.js +95 -0
- package/dist-cjs/packages/core/src/checkbox/Checkbox.js.map +1 -0
- package/dist-cjs/packages/core/src/checkbox/CheckboxGroup.css.js +9 -0
- package/dist-cjs/packages/core/src/checkbox/CheckboxGroup.css.js.map +1 -0
- package/dist-cjs/packages/core/src/checkbox/CheckboxGroup.js +62 -0
- package/dist-cjs/packages/core/src/checkbox/CheckboxGroup.js.map +1 -0
- package/dist-cjs/packages/core/src/checkbox/CheckboxIcon.css.js +9 -0
- package/dist-cjs/packages/core/src/checkbox/CheckboxIcon.css.js.map +1 -0
- package/dist-cjs/packages/core/src/checkbox/CheckboxIcon.js +48 -0
- package/dist-cjs/packages/core/src/checkbox/CheckboxIcon.js.map +1 -0
- package/dist-cjs/packages/core/src/checkbox/assets/CheckboxCheckedIcon.js +33 -0
- package/dist-cjs/packages/core/src/checkbox/assets/CheckboxCheckedIcon.js.map +1 -0
- package/dist-cjs/packages/core/src/checkbox/assets/CheckboxCheckedIconHD.js +32 -0
- package/dist-cjs/packages/core/src/checkbox/assets/CheckboxCheckedIconHD.js.map +1 -0
- package/dist-cjs/packages/core/src/checkbox/assets/CheckboxIndeterminateIcon.js +37 -0
- package/dist-cjs/packages/core/src/checkbox/assets/CheckboxIndeterminateIcon.js.map +1 -0
- package/dist-cjs/packages/core/src/checkbox/assets/CheckboxUncheckedIcon.js +26 -0
- package/dist-cjs/packages/core/src/checkbox/assets/CheckboxUncheckedIcon.js.map +1 -0
- package/dist-cjs/packages/core/src/checkbox/internal/CheckboxGroupContext.js +13 -0
- package/dist-cjs/packages/core/src/checkbox/internal/CheckboxGroupContext.js.map +1 -0
- package/dist-cjs/packages/core/src/checkbox/internal/useCheckboxGroup.js +13 -0
- package/dist-cjs/packages/core/src/checkbox/internal/useCheckboxGroup.js.map +1 -0
- package/dist-cjs/packages/core/src/flex-item/FlexItem.js +1 -1
- package/dist-cjs/packages/core/src/index.js +20 -0
- package/dist-cjs/packages/core/src/index.js.map +1 -1
- package/dist-cjs/packages/core/src/link/Link.css.js +1 -1
- package/dist-cjs/packages/core/src/link/Link.js +1 -1
- package/dist-cjs/packages/core/src/link/Link.js.map +1 -1
- package/dist-cjs/packages/core/src/panel/Panel.css.js +1 -1
- package/dist-cjs/packages/core/src/radio-button/RadioButton.css.js +9 -0
- package/dist-cjs/packages/core/src/radio-button/RadioButton.css.js.map +1 -0
- package/dist-cjs/packages/core/src/radio-button/RadioButton.js +86 -0
- package/dist-cjs/packages/core/src/radio-button/RadioButton.js.map +1 -0
- package/dist-cjs/packages/core/src/radio-button/RadioButtonGroup.css.js +9 -0
- package/dist-cjs/packages/core/src/radio-button/RadioButtonGroup.css.js.map +1 -0
- package/dist-cjs/packages/core/src/radio-button/RadioButtonGroup.js +61 -0
- package/dist-cjs/packages/core/src/radio-button/RadioButtonGroup.js.map +1 -0
- package/dist-cjs/packages/core/src/radio-button/RadioButtonIcon.css.js +9 -0
- package/dist-cjs/packages/core/src/radio-button/RadioButtonIcon.css.js.map +1 -0
- package/dist-cjs/packages/core/src/radio-button/RadioButtonIcon.js +48 -0
- package/dist-cjs/packages/core/src/radio-button/RadioButtonIcon.js.map +1 -0
- package/dist-cjs/packages/core/src/radio-button/internal/RadioGroupContext.js +19 -0
- package/dist-cjs/packages/core/src/radio-button/internal/RadioGroupContext.js.map +1 -0
- package/dist-cjs/packages/core/src/radio-button/internal/useRadioGroup.js +13 -0
- package/dist-cjs/packages/core/src/radio-button/internal/useRadioGroup.js.map +1 -0
- package/dist-cjs/packages/core/src/spinner/svgSpinners/SpinnerSVG.js +1 -0
- package/dist-cjs/packages/core/src/spinner/svgSpinners/SpinnerSVG.js.map +1 -1
- package/dist-cjs/packages/core/src/text/Text.css.js +1 -1
- package/dist-cjs/packages/core/src/tooltip/Tooltip.css.js +1 -1
- package/dist-cjs/packages/core/src/tooltip/Tooltip.js +40 -24
- package/dist-cjs/packages/core/src/tooltip/Tooltip.js.map +1 -1
- package/dist-cjs/packages/core/src/tooltip/useAriaAnnounce.js +1 -0
- package/dist-cjs/packages/core/src/tooltip/useAriaAnnounce.js.map +1 -1
- package/dist-cjs/packages/core/src/tooltip/useTooltip.js +7 -4
- package/dist-cjs/packages/core/src/tooltip/useTooltip.js.map +1 -1
- package/dist-cjs/packages/core/src/utils/capitalize.js +10 -0
- package/dist-cjs/packages/core/src/utils/capitalize.js.map +1 -0
- package/dist-cjs/packages/core/src/utils/mergeProps.js +25 -0
- package/dist-cjs/packages/core/src/utils/mergeProps.js.map +1 -0
- package/dist-cjs/packages/core/src/utils/useFloatingUI.js.map +1 -1
- package/dist-cjs/packages/core/src/viewport/ViewportProvider.js +1 -0
- package/dist-cjs/packages/core/src/viewport/ViewportProvider.js.map +1 -1
- package/dist-es/packages/core/src/aria-announcer/useAriaAnnouncer.js +1 -0
- package/dist-es/packages/core/src/aria-announcer/useAriaAnnouncer.js.map +1 -1
- package/dist-es/packages/core/src/avatar/Avatar.css.js +1 -1
- package/dist-es/packages/core/src/avatar/Avatar.js +11 -3
- package/dist-es/packages/core/src/avatar/Avatar.js.map +1 -1
- package/dist-es/packages/core/src/avatar/useAvatarImage.js +35 -0
- package/dist-es/packages/core/src/avatar/useAvatarImage.js.map +1 -0
- package/dist-es/packages/core/src/card/Card.css.js +1 -1
- package/dist-es/packages/core/src/card/Card.js +1 -1
- package/dist-es/packages/core/src/card/Card.js.map +1 -1
- package/dist-es/packages/core/src/card/InteractableCard.css.js +7 -0
- package/dist-es/packages/core/src/card/InteractableCard.css.js.map +1 -0
- package/dist-es/packages/core/src/card/InteractableCard.js +53 -0
- package/dist-es/packages/core/src/card/InteractableCard.js.map +1 -0
- package/dist-es/packages/core/src/card/useInteractableCard.js +59 -0
- package/dist-es/packages/core/src/card/useInteractableCard.js.map +1 -0
- package/dist-es/packages/core/src/checkbox/Checkbox.css.js +7 -0
- package/dist-es/packages/core/src/checkbox/Checkbox.css.js.map +1 -0
- package/dist-es/packages/core/src/checkbox/Checkbox.js +91 -0
- package/dist-es/packages/core/src/checkbox/Checkbox.js.map +1 -0
- package/dist-es/packages/core/src/checkbox/CheckboxGroup.css.js +7 -0
- package/dist-es/packages/core/src/checkbox/CheckboxGroup.css.js.map +1 -0
- package/dist-es/packages/core/src/checkbox/CheckboxGroup.js +58 -0
- package/dist-es/packages/core/src/checkbox/CheckboxGroup.js.map +1 -0
- package/dist-es/packages/core/src/checkbox/CheckboxIcon.css.js +7 -0
- package/dist-es/packages/core/src/checkbox/CheckboxIcon.css.js.map +1 -0
- package/dist-es/packages/core/src/checkbox/CheckboxIcon.js +44 -0
- package/dist-es/packages/core/src/checkbox/CheckboxIcon.js.map +1 -0
- package/dist-es/packages/core/src/checkbox/assets/CheckboxCheckedIcon.js +29 -0
- package/dist-es/packages/core/src/checkbox/assets/CheckboxCheckedIcon.js.map +1 -0
- package/dist-es/packages/core/src/checkbox/assets/CheckboxCheckedIconHD.js +28 -0
- package/dist-es/packages/core/src/checkbox/assets/CheckboxCheckedIconHD.js.map +1 -0
- package/dist-es/packages/core/src/checkbox/assets/CheckboxIndeterminateIcon.js +33 -0
- package/dist-es/packages/core/src/checkbox/assets/CheckboxIndeterminateIcon.js.map +1 -0
- package/dist-es/packages/core/src/checkbox/assets/CheckboxUncheckedIcon.js +22 -0
- package/dist-es/packages/core/src/checkbox/assets/CheckboxUncheckedIcon.js.map +1 -0
- package/dist-es/packages/core/src/checkbox/internal/CheckboxGroupContext.js +9 -0
- package/dist-es/packages/core/src/checkbox/internal/CheckboxGroupContext.js.map +1 -0
- package/dist-es/packages/core/src/checkbox/internal/useCheckboxGroup.js +9 -0
- package/dist-es/packages/core/src/checkbox/internal/useCheckboxGroup.js.map +1 -0
- package/dist-es/packages/core/src/flex-item/FlexItem.js +1 -1
- package/dist-es/packages/core/src/index.js +10 -0
- package/dist-es/packages/core/src/index.js.map +1 -1
- package/dist-es/packages/core/src/link/Link.css.js +1 -1
- package/dist-es/packages/core/src/link/Link.js +1 -1
- package/dist-es/packages/core/src/link/Link.js.map +1 -1
- package/dist-es/packages/core/src/panel/Panel.css.js +1 -1
- package/dist-es/packages/core/src/radio-button/RadioButton.css.js +7 -0
- package/dist-es/packages/core/src/radio-button/RadioButton.css.js.map +1 -0
- package/dist-es/packages/core/src/radio-button/RadioButton.js +82 -0
- package/dist-es/packages/core/src/radio-button/RadioButton.js.map +1 -0
- package/dist-es/packages/core/src/radio-button/RadioButtonGroup.css.js +7 -0
- package/dist-es/packages/core/src/radio-button/RadioButtonGroup.css.js.map +1 -0
- package/dist-es/packages/core/src/radio-button/RadioButtonGroup.js +57 -0
- package/dist-es/packages/core/src/radio-button/RadioButtonGroup.js.map +1 -0
- package/dist-es/packages/core/src/radio-button/RadioButtonIcon.css.js +7 -0
- package/dist-es/packages/core/src/radio-button/RadioButtonIcon.css.js.map +1 -0
- package/dist-es/packages/core/src/radio-button/RadioButtonIcon.js +44 -0
- package/dist-es/packages/core/src/radio-button/RadioButtonIcon.js.map +1 -0
- package/dist-es/packages/core/src/radio-button/internal/RadioGroupContext.js +15 -0
- package/dist-es/packages/core/src/radio-button/internal/RadioGroupContext.js.map +1 -0
- package/dist-es/packages/core/src/radio-button/internal/useRadioGroup.js +9 -0
- package/dist-es/packages/core/src/radio-button/internal/useRadioGroup.js.map +1 -0
- package/dist-es/packages/core/src/spinner/svgSpinners/SpinnerSVG.js +1 -0
- package/dist-es/packages/core/src/spinner/svgSpinners/SpinnerSVG.js.map +1 -1
- package/dist-es/packages/core/src/text/Text.css.js +1 -1
- package/dist-es/packages/core/src/tooltip/Tooltip.css.js +1 -1
- package/dist-es/packages/core/src/tooltip/Tooltip.js +40 -24
- package/dist-es/packages/core/src/tooltip/Tooltip.js.map +1 -1
- package/dist-es/packages/core/src/tooltip/useAriaAnnounce.js +1 -0
- package/dist-es/packages/core/src/tooltip/useAriaAnnounce.js.map +1 -1
- package/dist-es/packages/core/src/tooltip/useTooltip.js +7 -4
- package/dist-es/packages/core/src/tooltip/useTooltip.js.map +1 -1
- package/dist-es/packages/core/src/utils/capitalize.js +6 -0
- package/dist-es/packages/core/src/utils/capitalize.js.map +1 -0
- package/dist-es/packages/core/src/utils/mergeProps.js +21 -0
- package/dist-es/packages/core/src/utils/mergeProps.js.map +1 -0
- package/dist-es/packages/core/src/utils/useFloatingUI.js.map +1 -1
- package/dist-es/packages/core/src/viewport/ViewportProvider.js +1 -0
- package/dist-es/packages/core/src/viewport/ViewportProvider.js.map +1 -1
- package/dist-types/avatar/index.d.ts +1 -0
- package/dist-types/avatar/useAvatarImage.d.ts +2 -0
- package/dist-types/card/Card.d.ts +4 -4
- package/dist-types/card/InteractableCard.d.ts +14 -0
- package/dist-types/card/index.d.ts +1 -0
- package/dist-types/card/useInteractableCard.d.ts +21 -0
- package/dist-types/checkbox/Checkbox.d.ts +56 -0
- package/dist-types/checkbox/CheckboxGroup.d.ts +30 -0
- package/dist-types/checkbox/CheckboxIcon.d.ts +10 -0
- package/dist-types/checkbox/assets/CheckboxCheckedIcon.d.ts +4 -0
- package/dist-types/checkbox/assets/CheckboxCheckedIconHD.d.ts +4 -0
- package/dist-types/checkbox/assets/CheckboxIndeterminateIcon.d.ts +4 -0
- package/dist-types/checkbox/assets/CheckboxUncheckedIcon.d.ts +4 -0
- package/dist-types/checkbox/assets/index.d.ts +4 -0
- package/dist-types/checkbox/index.d.ts +3 -0
- package/dist-types/checkbox/internal/CheckboxGroupContext.d.ts +9 -0
- package/dist-types/checkbox/internal/useCheckboxGroup.d.ts +2 -0
- package/dist-types/index.d.ts +2 -0
- package/dist-types/link/Link.d.ts +1 -1
- package/dist-types/radio-button/RadioButton.d.ts +45 -0
- package/dist-types/radio-button/RadioButtonGroup.d.ts +29 -0
- package/dist-types/radio-button/RadioButtonIcon.d.ts +11 -0
- package/dist-types/radio-button/index.d.ts +3 -0
- package/dist-types/radio-button/internal/RadioGroupContext.d.ts +7 -0
- package/dist-types/radio-button/internal/useRadioGroup.d.ts +1 -0
- package/dist-types/tooltip/Tooltip.d.ts +10 -10
- package/dist-types/tooltip/useTooltip.d.ts +23 -3
- package/dist-types/utils/capitalize.d.ts +1 -0
- package/dist-types/utils/index.d.ts +2 -0
- package/dist-types/utils/mergeProps.d.ts +12 -0
- package/dist-types/utils/useFloatingUI.d.ts +3 -3
- package/package.json +3 -3
- package/dist-cjs/packages/core/src/avatar/internal/useLoaded.js +0 -30
- package/dist-cjs/packages/core/src/avatar/internal/useLoaded.js.map +0 -1
- package/dist-es/packages/core/src/avatar/internal/useLoaded.js +0 -26
- package/dist-es/packages/core/src/avatar/internal/useLoaded.js.map +0 -1
- package/dist-types/avatar/internal/useLoaded.d.ts +0 -2
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
2
|
+
|
|
3
|
+
function CheckboxCheckedIconHD({
|
|
4
|
+
className
|
|
5
|
+
}) {
|
|
6
|
+
return /* @__PURE__ */ jsx("svg", {
|
|
7
|
+
"aria-hidden": "true",
|
|
8
|
+
className,
|
|
9
|
+
focusable: "false",
|
|
10
|
+
shapeRendering: "geometricPrecision",
|
|
11
|
+
viewBox: "0 0 12 12",
|
|
12
|
+
children: /* @__PURE__ */ jsxs("g", {
|
|
13
|
+
fillRule: "evenodd",
|
|
14
|
+
children: [
|
|
15
|
+
/* @__PURE__ */ jsx("rect", {
|
|
16
|
+
className: `saltCheckboxIcon-box`
|
|
17
|
+
}),
|
|
18
|
+
/* @__PURE__ */ jsx("path", {
|
|
19
|
+
className: `saltCheckboxIcon-tick`,
|
|
20
|
+
d: "m10 3.70547L4.83651 9.27702L2 6.6259L2.70868 5.86766L4.78375 7.8071L9.23877 3L10 3.70547z"
|
|
21
|
+
})
|
|
22
|
+
]
|
|
23
|
+
})
|
|
24
|
+
});
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
export { CheckboxCheckedIconHD };
|
|
28
|
+
//# sourceMappingURL=CheckboxCheckedIconHD.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"CheckboxCheckedIconHD.js","sources":["../src/checkbox/assets/CheckboxCheckedIconHD.tsx"],"sourcesContent":["// This icon is used for the high density checkbox\nexport function CheckboxCheckedIconHD({\n className,\n}: {\n className: string;\n}): JSX.Element {\n return (\n <svg\n aria-hidden=\"true\"\n className={className}\n focusable=\"false\"\n shapeRendering=\"geometricPrecision\"\n viewBox=\"0 0 12 12\"\n >\n <g fillRule=\"evenodd\">\n <rect className={`saltCheckboxIcon-box`} />\n <path\n className={`saltCheckboxIcon-tick`}\n d=\"m10 3.70547L4.83651 9.27702L2 6.6259L2.70868 5.86766L4.78375 7.8071L9.23877 3L10 3.70547z\"\n />\n </g>\n </svg>\n );\n}\n"],"names":[],"mappings":";;AACO,SAAS,qBAAsB,CAAA;AAAA,EACpC,SAAA;AACF,CAEgB,EAAA;AACd,EAAA,uBACG,GAAA,CAAA,KAAA,EAAA;AAAA,IACC,aAAY,EAAA,MAAA;AAAA,IACZ,SAAA;AAAA,IACA,SAAU,EAAA,OAAA;AAAA,IACV,cAAe,EAAA,oBAAA;AAAA,IACf,OAAQ,EAAA,WAAA;AAAA,IAER,QAAC,kBAAA,IAAA,CAAA,GAAA,EAAA;AAAA,MAAE,QAAS,EAAA,SAAA;AAAA,MACV,QAAA,EAAA;AAAA,wBAAC,GAAA,CAAA,MAAA,EAAA;AAAA,UAAK,SAAW,EAAA,CAAA,oBAAA,CAAA;AAAA,SAAwB,CAAA;AAAA,wBACxC,GAAA,CAAA,MAAA,EAAA;AAAA,UACC,SAAW,EAAA,CAAA,qBAAA,CAAA;AAAA,UACX,CAAE,EAAA,2FAAA;AAAA,SACJ,CAAA;AAAA,OAAA;AAAA,KACF,CAAA;AAAA,GACF,CAAA,CAAA;AAEJ;;;;"}
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
2
|
+
|
|
3
|
+
function CheckboxIndeterminateIcon({
|
|
4
|
+
className
|
|
5
|
+
}) {
|
|
6
|
+
return /* @__PURE__ */ jsx("svg", {
|
|
7
|
+
"aria-hidden": "true",
|
|
8
|
+
className,
|
|
9
|
+
focusable: "false",
|
|
10
|
+
shapeRendering: "geometricPrecision",
|
|
11
|
+
viewBox: "0 0 14 14",
|
|
12
|
+
children: /* @__PURE__ */ jsxs("g", {
|
|
13
|
+
fillRule: "evenodd",
|
|
14
|
+
strokeWidth: "1",
|
|
15
|
+
children: [
|
|
16
|
+
/* @__PURE__ */ jsx("rect", {
|
|
17
|
+
className: `saltCheckboxIcon-box`
|
|
18
|
+
}),
|
|
19
|
+
/* @__PURE__ */ jsx("rect", {
|
|
20
|
+
className: `saltCheckboxIcon-tick`,
|
|
21
|
+
height: "2",
|
|
22
|
+
strokeWidth: "0",
|
|
23
|
+
width: "8",
|
|
24
|
+
x: "3",
|
|
25
|
+
y: "6"
|
|
26
|
+
})
|
|
27
|
+
]
|
|
28
|
+
})
|
|
29
|
+
});
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
export { CheckboxIndeterminateIcon };
|
|
33
|
+
//# sourceMappingURL=CheckboxIndeterminateIcon.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"CheckboxIndeterminateIcon.js","sources":["../src/checkbox/assets/CheckboxIndeterminateIcon.tsx"],"sourcesContent":["export function CheckboxIndeterminateIcon({\n className,\n}: {\n className: string;\n}): JSX.Element {\n return (\n <svg\n aria-hidden=\"true\"\n className={className}\n focusable=\"false\"\n shapeRendering=\"geometricPrecision\"\n viewBox=\"0 0 14 14\"\n >\n <g fillRule=\"evenodd\" strokeWidth=\"1\">\n <rect className={`saltCheckboxIcon-box`} />\n <rect\n className={`saltCheckboxIcon-tick`}\n height=\"2\"\n strokeWidth=\"0\"\n width=\"8\"\n x=\"3\"\n y=\"6\"\n />\n </g>\n </svg>\n );\n}\n"],"names":[],"mappings":";;AAAO,SAAS,yBAA0B,CAAA;AAAA,EACxC,SAAA;AACF,CAEgB,EAAA;AACd,EAAA,uBACG,GAAA,CAAA,KAAA,EAAA;AAAA,IACC,aAAY,EAAA,MAAA;AAAA,IACZ,SAAA;AAAA,IACA,SAAU,EAAA,OAAA;AAAA,IACV,cAAe,EAAA,oBAAA;AAAA,IACf,OAAQ,EAAA,WAAA;AAAA,IAER,QAAC,kBAAA,IAAA,CAAA,GAAA,EAAA;AAAA,MAAE,QAAS,EAAA,SAAA;AAAA,MAAU,WAAY,EAAA,GAAA;AAAA,MAChC,QAAA,EAAA;AAAA,wBAAC,GAAA,CAAA,MAAA,EAAA;AAAA,UAAK,SAAW,EAAA,CAAA,oBAAA,CAAA;AAAA,SAAwB,CAAA;AAAA,wBACxC,GAAA,CAAA,MAAA,EAAA;AAAA,UACC,SAAW,EAAA,CAAA,qBAAA,CAAA;AAAA,UACX,MAAO,EAAA,GAAA;AAAA,UACP,WAAY,EAAA,GAAA;AAAA,UACZ,KAAM,EAAA,GAAA;AAAA,UACN,CAAE,EAAA,GAAA;AAAA,UACF,CAAE,EAAA,GAAA;AAAA,SACJ,CAAA;AAAA,OAAA;AAAA,KACF,CAAA;AAAA,GACF,CAAA,CAAA;AAEJ;;;;"}
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import { jsx } from 'react/jsx-runtime';
|
|
2
|
+
|
|
3
|
+
function CheckboxUncheckedIcon({
|
|
4
|
+
className
|
|
5
|
+
}) {
|
|
6
|
+
return /* @__PURE__ */ jsx("svg", {
|
|
7
|
+
"aria-hidden": "true",
|
|
8
|
+
className,
|
|
9
|
+
focusable: "false",
|
|
10
|
+
shapeRendering: "geometricPrecision",
|
|
11
|
+
viewBox: "0 0 14 14",
|
|
12
|
+
children: /* @__PURE__ */ jsx("g", {
|
|
13
|
+
fillRule: "evenodd",
|
|
14
|
+
children: /* @__PURE__ */ jsx("rect", {
|
|
15
|
+
className: `saltCheckboxIcon-box`
|
|
16
|
+
})
|
|
17
|
+
})
|
|
18
|
+
});
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
export { CheckboxUncheckedIcon };
|
|
22
|
+
//# sourceMappingURL=CheckboxUncheckedIcon.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"CheckboxUncheckedIcon.js","sources":["../src/checkbox/assets/CheckboxUncheckedIcon.tsx"],"sourcesContent":["export function CheckboxUncheckedIcon({\n className,\n}: {\n className: string;\n}): JSX.Element {\n return (\n <svg\n aria-hidden=\"true\"\n className={className}\n focusable=\"false\"\n shapeRendering=\"geometricPrecision\"\n viewBox=\"0 0 14 14\"\n >\n <g fillRule=\"evenodd\">\n <rect className={`saltCheckboxIcon-box`} />\n </g>\n </svg>\n );\n}\n"],"names":[],"mappings":";;AAAO,SAAS,qBAAsB,CAAA;AAAA,EACpC,SAAA;AACF,CAEgB,EAAA;AACd,EAAA,uBACG,GAAA,CAAA,KAAA,EAAA;AAAA,IACC,aAAY,EAAA,MAAA;AAAA,IACZ,SAAA;AAAA,IACA,SAAU,EAAA,OAAA;AAAA,IACV,cAAe,EAAA,oBAAA;AAAA,IACf,OAAQ,EAAA,WAAA;AAAA,IAER,QAAC,kBAAA,GAAA,CAAA,GAAA,EAAA;AAAA,MAAE,QAAS,EAAA,SAAA;AAAA,MACV,QAAC,kBAAA,GAAA,CAAA,MAAA,EAAA;AAAA,QAAK,SAAW,EAAA,CAAA,oBAAA,CAAA;AAAA,OAAwB,CAAA;AAAA,KAC3C,CAAA;AAAA,GACF,CAAA,CAAA;AAEJ;;;;"}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { createContext } from 'react';
|
|
2
|
+
|
|
3
|
+
const CheckboxGroupContext = createContext({});
|
|
4
|
+
if (process.env.NODE_ENV !== "production") {
|
|
5
|
+
CheckboxGroupContext.displayName = "CheckboxGroupContext";
|
|
6
|
+
}
|
|
7
|
+
|
|
8
|
+
export { CheckboxGroupContext };
|
|
9
|
+
//# sourceMappingURL=CheckboxGroupContext.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"CheckboxGroupContext.js","sources":["../src/checkbox/internal/CheckboxGroupContext.ts"],"sourcesContent":["import { createContext } from \"react\";\nimport { CheckboxGroupProps } from \"../CheckboxGroup\";\n\nexport interface CheckboxGroupState {\n name?: CheckboxGroupProps[\"name\"];\n onChange?: CheckboxGroupProps[\"onChange\"];\n checkedValues?: CheckboxGroupProps[\"checkedValues\"];\n}\n\nconst CheckboxGroupContext = createContext<CheckboxGroupState>({});\n\nif (process.env.NODE_ENV !== \"production\") {\n CheckboxGroupContext.displayName = \"CheckboxGroupContext\";\n}\n\nexport { CheckboxGroupContext };\n"],"names":[],"mappings":";;AASM,MAAA,oBAAA,GAAuB,aAAkC,CAAA,EAAE,EAAA;AAEjE,IAAI,OAAA,CAAQ,GAAI,CAAA,QAAA,KAAa,YAAc,EAAA;AACzC,EAAA,oBAAA,CAAqB,WAAc,GAAA,sBAAA,CAAA;AACrC;;;;"}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { useContext } from 'react';
|
|
2
|
+
import { CheckboxGroupContext } from './CheckboxGroupContext.js';
|
|
3
|
+
|
|
4
|
+
function useCheckboxGroup() {
|
|
5
|
+
return useContext(CheckboxGroupContext);
|
|
6
|
+
}
|
|
7
|
+
|
|
8
|
+
export { useCheckboxGroup };
|
|
9
|
+
//# sourceMappingURL=useCheckboxGroup.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useCheckboxGroup.js","sources":["../src/checkbox/internal/useCheckboxGroup.ts"],"sourcesContent":["import { useContext } from \"react\";\nimport {\n CheckboxGroupContext,\n CheckboxGroupState,\n} from \"./CheckboxGroupContext\";\n\nexport function useCheckboxGroup(): CheckboxGroupState {\n return useContext(CheckboxGroupContext);\n}\n"],"names":[],"mappings":";;;AAMO,SAAS,gBAAuC,GAAA;AACrD,EAAA,OAAO,WAAW,oBAAoB,CAAA,CAAA;AACxC;;;;"}
|
|
@@ -4,8 +4,8 @@ import { makePrefixer } from '../utils/makePrefixer.js';
|
|
|
4
4
|
import '../utils/useFloatingUI.js';
|
|
5
5
|
import '../utils/useId.js';
|
|
6
6
|
import { useResponsiveProp } from '../utils/useResponsiveProp.js';
|
|
7
|
-
import './FlexItem.css.js';
|
|
8
7
|
import { clsx } from 'clsx';
|
|
8
|
+
import './FlexItem.css.js';
|
|
9
9
|
|
|
10
10
|
const withBaseName = makePrefixer("saltFlexItem");
|
|
11
11
|
const FLEX_ITEM_ALIGNMENTS = [
|
|
@@ -3,12 +3,17 @@ export { AriaAnnounce } from './aria-announcer/AriaAnnounce.js';
|
|
|
3
3
|
export { ARIA_ANNOUNCE_DELAY, AriaAnnouncerProvider } from './aria-announcer/AriaAnnouncerProvider.js';
|
|
4
4
|
export { useAriaAnnouncer } from './aria-announcer/useAriaAnnouncer.js';
|
|
5
5
|
export { Avatar } from './avatar/Avatar.js';
|
|
6
|
+
export { useAvatarImage } from './avatar/useAvatarImage.js';
|
|
6
7
|
export { BORDER_POSITION, BorderItem } from './border-item/BorderItem.js';
|
|
7
8
|
export { BorderLayout } from './border-layout/BorderLayout.js';
|
|
8
9
|
export { DEFAULT_BREAKPOINTS } from './breakpoints/Breakpoints.js';
|
|
9
10
|
export { Button, ButtonVariantValues } from './button/Button.js';
|
|
10
11
|
export { useButton } from './button/useButton.js';
|
|
11
12
|
export { Card } from './card/Card.js';
|
|
13
|
+
export { InteractableCard } from './card/InteractableCard.js';
|
|
14
|
+
export { Checkbox } from './checkbox/Checkbox.js';
|
|
15
|
+
export { CheckboxGroup } from './checkbox/CheckboxGroup.js';
|
|
16
|
+
export { CheckboxIcon } from './checkbox/CheckboxIcon.js';
|
|
12
17
|
export { FLEX_ITEM_ALIGNMENTS, FlexItem } from './flex-item/FlexItem.js';
|
|
13
18
|
export { FLEX_ALIGNMENT_BASE, FLEX_CONTENT_ALIGNMENT_BASE, FlexLayout } from './flex-layout/FlexLayout.js';
|
|
14
19
|
export { FlowLayout } from './flow-layout/FlowLayout.js';
|
|
@@ -16,6 +21,9 @@ export { GRID_ALIGNMENT_BASE, GridItem } from './grid-item/GridItem.js';
|
|
|
16
21
|
export { GridLayout } from './grid-layout/GridLayout.js';
|
|
17
22
|
export { Link } from './link/Link.js';
|
|
18
23
|
export { Panel } from './panel/Panel.js';
|
|
24
|
+
export { RadioButton } from './radio-button/RadioButton.js';
|
|
25
|
+
export { RadioButtonGroup } from './radio-button/RadioButtonGroup.js';
|
|
26
|
+
export { RadioButtonIcon } from './radio-button/RadioButtonIcon.js';
|
|
19
27
|
export { Spinner, SpinnerSizeValues } from './spinner/Spinner.js';
|
|
20
28
|
export { StackLayout } from './stack-layout/StackLayout.js';
|
|
21
29
|
export { StatusIndicator } from './status-indicator/StatusIndicator.js';
|
|
@@ -31,6 +39,7 @@ export { BreakpointContext, DEFAULT_DENSITY, DensityContext, SaltProvider, Theme
|
|
|
31
39
|
export { SplitLayout } from './split-layout/SplitLayout.js';
|
|
32
40
|
export { Tooltip } from './tooltip/Tooltip.js';
|
|
33
41
|
export { useTooltip } from './tooltip/useTooltip.js';
|
|
42
|
+
export { capitalize } from './utils/capitalize.js';
|
|
34
43
|
export { createChainedFunction } from './utils/createChainedFunction.js';
|
|
35
44
|
export { createContext } from './utils/createContext.js';
|
|
36
45
|
export { debounce } from './utils/debounce.js';
|
|
@@ -47,5 +56,6 @@ export { teardown, useIsFocusVisible } from './utils/useIsFocusVisible.js';
|
|
|
47
56
|
export { useIsomorphicLayoutEffect } from './utils/useIsomorphicLayoutEffect.js';
|
|
48
57
|
export { usePrevious } from './utils/usePrevious.js';
|
|
49
58
|
export { getCurrentBreakpoint, useCurrentBreakpoint, useOrderedBreakpoints, useResponsiveProp } from './utils/useResponsiveProp.js';
|
|
59
|
+
export { mergeProps } from './utils/mergeProps.js';
|
|
50
60
|
export { ViewportContext, ViewportProvider, useViewport } from './viewport/ViewportProvider.js';
|
|
51
61
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import styleInject from '../../../../node_modules/style-inject/dist/style-inject.es.js';
|
|
2
2
|
|
|
3
|
-
var css_248z = ".saltLink {\n --link-color-hover: var(--saltLink-color-hover, var(--salt-text-link-foreground-hover));\n --link-color-active: var(--saltLink-color-active, var(--salt-text-link-foreground-active));\n --link-color-visited: var(--saltLink-color-visited, var(--salt-text-link-foreground-visited));\n /* When focused, we also want hover style */\n --link-color-focus: var(--saltLink-color-focus, var(--link-color-hover));\n\n --link-textDecoration: var(--salt-text-link-textDecoration);\n --link-textDecoration-hover: var(--salt-text-link-textDecoration-hover);\n\n --link-fontFamily: var(--salt-text-fontFamily);\n --link-focus-outline: var(--salt-focused-outline);\n}\n\n/* Main css class */\n.saltLink {\n color: var(--link-color);\n letter-spacing: 0px;\n text-decoration: var(--link-textDecoration);\n font-family: var(--link-fontFamily);\n}\n\n/* Primary variant */\n.saltText-primary {\n --link-color: var(--salt-text-primary-foreground);\n}\n\n/* Secondary variant */\n.saltText-secondary {\n --link-color: var(--salt-text-secondary-foreground);\n}\n\n/* External link's icon */\n.saltLink-icon {\n margin-left:
|
|
3
|
+
var css_248z = ".saltLink {\n --link-color-hover: var(--saltLink-color-hover, var(--salt-text-link-foreground-hover));\n --link-color-active: var(--saltLink-color-active, var(--salt-text-link-foreground-active));\n --link-color-visited: var(--saltLink-color-visited, var(--salt-text-link-foreground-visited));\n /* When focused, we also want hover style */\n --link-color-focus: var(--saltLink-color-focus, var(--link-color-hover));\n\n --link-textDecoration: var(--salt-text-link-textDecoration);\n --link-textDecoration-hover: var(--salt-text-link-textDecoration-hover);\n\n --link-fontFamily: var(--salt-text-fontFamily);\n --link-focus-outline: var(--salt-focused-outline);\n}\n\n/* Main css class */\n.saltLink {\n color: var(--link-color);\n letter-spacing: 0px;\n text-decoration: var(--link-textDecoration);\n font-family: var(--link-fontFamily);\n}\n\n/* Primary variant */\n.saltText-primary {\n --link-color: var(--salt-text-primary-foreground);\n}\n\n/* Secondary variant */\n.saltText-secondary {\n --link-color: var(--salt-text-secondary-foreground);\n}\n\n/* External link's icon */\n.saltLink-icon {\n margin-left: var(--salt-size-adornmentGap);\n margin-bottom: -2px;\n}\n\n/* Set color for visited link */\n.saltLink:visited {\n --saltIcon-color: var(--link-color-visited);\n color: var(--link-color-visited);\n}\n\n/* Set color for hovered link */\n.saltLink:hover {\n --saltIcon-color: var(--link-color-hover);\n color: var(--link-color-hover);\n text-decoration: var(--link-textDecoration-hover);\n}\n\n/* Set color for active link */\n.saltLink:active {\n --saltIcon-color: var(--link-color-active);\n color: var(--link-color-active);\n}\n\n/* Set color for focused link */\n.saltLink:focus {\n --saltIcon-color: var(--link-color-focus);\n outline: var(--link-focus-outline);\n color: var(--link-color-focus);\n text-decoration: var(--link-textDecoration-hover);\n}\n\n/* Class for ADA content */\n.saltLink-externalLinkADA {\n display: block;\n position: absolute;\n width: 1px;\n height: 1px;\n overflow: hidden;\n top: 0px;\n left: 0px;\n opacity: 0;\n}\n";
|
|
4
4
|
styleInject(css_248z);
|
|
5
5
|
|
|
6
6
|
export { css_248z as default };
|
|
@@ -35,7 +35,7 @@ const Link = forwardRef(function Link2({
|
|
|
35
35
|
children,
|
|
36
36
|
target === "_blank" && /* @__PURE__ */ jsxs(Fragment, {
|
|
37
37
|
children: [
|
|
38
|
-
/* @__PURE__ */ jsx(IconComponent, {
|
|
38
|
+
IconComponent && /* @__PURE__ */ jsx(IconComponent, {
|
|
39
39
|
className: withBaseName("icon"),
|
|
40
40
|
"aria-hidden": true
|
|
41
41
|
}),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Link.js","sources":["../src/link/Link.tsx"],"sourcesContent":["import { ComponentType, forwardRef, ReactElement } from \"react\";\nimport { clsx } from \"clsx\";\nimport { IconProps, TearOutIcon } from \"@salt-ds/icons\";\nimport { makePrefixer } from \"../utils\";\nimport { Text, TextProps } from \"../text\";\n\nimport \"./Link.css\";\n\nconst withBaseName = makePrefixer(\"saltLink\");\n\n/**\n * Links are a fundamental navigation element. When clicked, they take the user to an entirely different page.\n *\n * @example\n * <LinkExample to=\"#link\">Action</LinkExample>\n */\nexport interface LinkProps extends Omit<TextProps<\"a\">, \"as\" | \"disabled\"> {\n IconComponent?: ComponentType<IconProps
|
|
1
|
+
{"version":3,"file":"Link.js","sources":["../src/link/Link.tsx"],"sourcesContent":["import { ComponentType, forwardRef, ReactElement } from \"react\";\nimport { clsx } from \"clsx\";\nimport { IconProps, TearOutIcon } from \"@salt-ds/icons\";\nimport { makePrefixer } from \"../utils\";\nimport { Text, TextProps } from \"../text\";\n\nimport \"./Link.css\";\n\nconst withBaseName = makePrefixer(\"saltLink\");\n\n/**\n * Links are a fundamental navigation element. When clicked, they take the user to an entirely different page.\n *\n * @example\n * <LinkExample to=\"#link\">Action</LinkExample>\n */\nexport interface LinkProps extends Omit<TextProps<\"a\">, \"as\" | \"disabled\"> {\n IconComponent?: ComponentType<IconProps> | null;\n}\n\nexport const Link = forwardRef<HTMLAnchorElement, LinkProps>(function Link(\n {\n IconComponent = TearOutIcon,\n href,\n className,\n children,\n variant = \"primary\",\n target = \"_self\",\n ...rest\n },\n ref\n): ReactElement<LinkProps> {\n return (\n <Text\n as=\"a\"\n className={clsx(withBaseName(), className)}\n href={href}\n ref={ref}\n target={target}\n variant={variant}\n {...rest}\n >\n {children}\n {target === \"_blank\" && (\n <>\n {IconComponent && (\n <IconComponent className={withBaseName(\"icon\")} aria-hidden />\n )}\n <span className={withBaseName(\"externalLinkADA\")}>External Link</span>\n </>\n )}\n </Text>\n );\n});\n"],"names":["Link"],"mappings":";;;;;;;;;;;;;;;AAQA,MAAM,YAAA,GAAe,aAAa,UAAU,CAAA,CAAA;AAY/B,MAAA,IAAA,GAAO,UAAyC,CAAA,SAASA,KACpE,CAAA;AAAA,EACE,aAAgB,GAAA,WAAA;AAAA,EAChB,IAAA;AAAA,EACA,SAAA;AAAA,EACA,QAAA;AAAA,EACA,OAAU,GAAA,SAAA;AAAA,EACV,MAAS,GAAA,OAAA;AAAA,EACN,GAAA,IAAA;AACL,CAAA,EACA,GACyB,EAAA;AACzB,EAAA,uBACG,IAAA,CAAA,IAAA,EAAA;AAAA,IACC,EAAG,EAAA,GAAA;AAAA,IACH,SAAW,EAAA,IAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,IACzC,IAAA;AAAA,IACA,GAAA;AAAA,IACA,MAAA;AAAA,IACA,OAAA;AAAA,IACC,GAAG,IAAA;AAAA,IAEH,QAAA,EAAA;AAAA,MAAA,QAAA;AAAA,MACA,WAAW,QACV,oBAAA,IAAA,CAAA,QAAA,EAAA;AAAA,QACG,QAAA,EAAA;AAAA,UAAA,aAAA,oBACE,GAAA,CAAA,aAAA,EAAA;AAAA,YAAc,SAAA,EAAW,aAAa,MAAM,CAAA;AAAA,YAAG,aAAW,EAAA,IAAA;AAAA,WAAC,CAAA;AAAA,0BAE7D,GAAA,CAAA,MAAA,EAAA;AAAA,YAAK,SAAA,EAAW,aAAa,iBAAiB,CAAA;AAAA,YAAG,QAAA,EAAA,eAAA;AAAA,WAAa,CAAA;AAAA,SAAA;AAAA,OACjE,CAAA;AAAA,KAAA;AAAA,GAEJ,CAAA,CAAA;AAEJ,CAAC;;;;"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import styleInject from '../../../../node_modules/style-inject/dist/style-inject.es.js';
|
|
2
2
|
|
|
3
|
-
var css_248z = "/* Styles applied to the root element when variant=\"primary\" */\n.saltPanel-primary.saltPanel {\n --panel-background: var(--salt-container-primary-background);\n}\n\n/* Styles applied to the root element when variant=\"secondary\" */\n.saltPanel-secondary.saltPanel {\n --panel-background: var(--salt-container-secondary-background);\n}\n\n/* Styles applied to the root element */\n.saltPanel {\n background: var(--saltPanel-background, var(--panel-background));\n color: var(--saltPanel-color,
|
|
3
|
+
var css_248z = "/* Styles applied to the root element when variant=\"primary\" */\n.saltPanel-primary.saltPanel {\n --panel-background: var(--salt-container-primary-background);\n}\n\n/* Styles applied to the root element when variant=\"secondary\" */\n.saltPanel-secondary.saltPanel {\n --panel-background: var(--salt-container-secondary-background);\n}\n\n/* Styles applied to the root element */\n.saltPanel {\n background: var(--saltPanel-background, var(--panel-background));\n color: var(--saltPanel-color, initial);\n height: var(--saltPanel-height, 100%);\n overflow: auto;\n padding: var(--saltPanel-padding, var(--salt-size-container-spacing));\n width: var(--saltPanel-width, 100%);\n}\n";
|
|
4
4
|
styleInject(css_248z);
|
|
5
5
|
|
|
6
6
|
export { css_248z as default };
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import styleInject from '../../../../node_modules/style-inject/dist/style-inject.es.js';
|
|
2
|
+
|
|
3
|
+
var css_248z = "/* Styles applied to RadioButton container */\n.saltRadioButton {\n display: flex;\n gap: var(--salt-size-adornmentGap);\n position: relative;\n user-select: none;\n cursor: pointer;\n}\n\n/* Styles applied when RadioButton is disabled */\n.saltRadioButton-disabled {\n color: var(--salt-text-primary-foreground-disabled);\n cursor: var(--salt-selectable-cursor-disabled);\n pointer-events: visible;\n}\n\n/* Styles applied to input component */\n.saltRadioButton-input {\n cursor: inherit;\n position: absolute;\n opacity: 0;\n top: 0;\n left: 0;\n margin: 0;\n padding: 0;\n z-index: var(--salt-zIndex-default);\n}\n\n/* Styles applied to icon when :focus-visible */\n.saltRadioButton-input:focus-visible + .saltRadioButtonIcon {\n outline: var(--salt-focused-outline);\n outline-offset: var(--salt-focused-outlineOffset);\n}\n";
|
|
4
|
+
styleInject(css_248z);
|
|
5
|
+
|
|
6
|
+
export { css_248z as default };
|
|
7
|
+
//# sourceMappingURL=RadioButton.css.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"RadioButton.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;"}
|
|
@@ -0,0 +1,82 @@
|
|
|
1
|
+
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { clsx } from 'clsx';
|
|
3
|
+
import { forwardRef } from 'react';
|
|
4
|
+
import { makePrefixer } from '../utils/makePrefixer.js';
|
|
5
|
+
import { useControlled } from '../utils/useControlled.js';
|
|
6
|
+
import '../utils/useFloatingUI.js';
|
|
7
|
+
import '../utils/useId.js';
|
|
8
|
+
import '../salt-provider/SaltProvider.js';
|
|
9
|
+
import '../viewport/ViewportProvider.js';
|
|
10
|
+
import { useRadioGroup } from './internal/useRadioGroup.js';
|
|
11
|
+
import { RadioButtonIcon } from './RadioButtonIcon.js';
|
|
12
|
+
import './RadioButton.css.js';
|
|
13
|
+
|
|
14
|
+
const withBaseName = makePrefixer("saltRadioButton");
|
|
15
|
+
const RadioButton = forwardRef(
|
|
16
|
+
function RadioButton2(props, ref) {
|
|
17
|
+
const {
|
|
18
|
+
checked: checkedProp,
|
|
19
|
+
className,
|
|
20
|
+
disabled,
|
|
21
|
+
error,
|
|
22
|
+
inputProps,
|
|
23
|
+
label,
|
|
24
|
+
name: nameProp,
|
|
25
|
+
onFocus,
|
|
26
|
+
onBlur,
|
|
27
|
+
onChange,
|
|
28
|
+
value,
|
|
29
|
+
...rest
|
|
30
|
+
} = props;
|
|
31
|
+
const radioGroup = useRadioGroup();
|
|
32
|
+
const radioGroupChecked = radioGroup.value != null && value != null ? radioGroup.value === value : checkedProp;
|
|
33
|
+
const name = nameProp != null ? nameProp : radioGroup.name;
|
|
34
|
+
const [checked, setCheckedState] = useControlled({
|
|
35
|
+
controlled: radioGroupChecked,
|
|
36
|
+
default: Boolean(checkedProp),
|
|
37
|
+
name: "RadioBase",
|
|
38
|
+
state: "checked"
|
|
39
|
+
});
|
|
40
|
+
const handleChange = (event) => {
|
|
41
|
+
var _a;
|
|
42
|
+
const newChecked = event.target.checked;
|
|
43
|
+
setCheckedState(newChecked);
|
|
44
|
+
onChange == null ? void 0 : onChange(event);
|
|
45
|
+
(_a = radioGroup.onChange) == null ? void 0 : _a.call(radioGroup, event);
|
|
46
|
+
};
|
|
47
|
+
return /* @__PURE__ */ jsxs("label", {
|
|
48
|
+
className: clsx(
|
|
49
|
+
withBaseName(),
|
|
50
|
+
{
|
|
51
|
+
[withBaseName("disabled")]: disabled
|
|
52
|
+
},
|
|
53
|
+
className
|
|
54
|
+
),
|
|
55
|
+
ref,
|
|
56
|
+
...rest,
|
|
57
|
+
children: [
|
|
58
|
+
/* @__PURE__ */ jsx("input", {
|
|
59
|
+
className: withBaseName("input"),
|
|
60
|
+
...inputProps,
|
|
61
|
+
checked,
|
|
62
|
+
disabled,
|
|
63
|
+
name,
|
|
64
|
+
value,
|
|
65
|
+
onBlur,
|
|
66
|
+
onChange: handleChange,
|
|
67
|
+
onFocus,
|
|
68
|
+
type: "radio"
|
|
69
|
+
}),
|
|
70
|
+
/* @__PURE__ */ jsx(RadioButtonIcon, {
|
|
71
|
+
checked,
|
|
72
|
+
error,
|
|
73
|
+
disabled
|
|
74
|
+
}),
|
|
75
|
+
label
|
|
76
|
+
]
|
|
77
|
+
});
|
|
78
|
+
}
|
|
79
|
+
);
|
|
80
|
+
|
|
81
|
+
export { RadioButton };
|
|
82
|
+
//# sourceMappingURL=RadioButton.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"RadioButton.js","sources":["../src/radio-button/RadioButton.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n ChangeEventHandler,\n FocusEventHandler,\n forwardRef,\n HTMLAttributes,\n InputHTMLAttributes,\n ReactNode,\n} from \"react\";\nimport { makePrefixer, useControlled } from \"../utils\";\nimport { useRadioGroup } from \"./internal/useRadioGroup\";\nimport { RadioButtonIcon } from \"./RadioButtonIcon\";\n\nimport \"./RadioButton.css\";\n\nconst withBaseName = makePrefixer(\"saltRadioButton\");\n\nexport interface RadioButtonProps\n extends Omit<\n HTMLAttributes<HTMLLabelElement>,\n \"onChange\" | \"onBlur\" | \"onFocus\"\n > {\n /**\n * Set the default selected radio button in the group\n */\n checked?: boolean;\n /**\n * Set the disabled state\n */\n disabled?: boolean;\n /**\n * Set the error state\n */\n error?: boolean;\n /**\n * Props to be passed to the radio input\n */\n inputProps?: Partial<InputHTMLAttributes<HTMLInputElement>>;\n /**\n * The label to be shown next to the radio icon\n */\n label?: ReactNode;\n /**\n * Name of the radio group\n */\n name?: string;\n /**\n * Callback for blur event\n */\n onBlur?: FocusEventHandler<HTMLInputElement>;\n /**\n * Callback for change event\n */\n onChange?: ChangeEventHandler<HTMLInputElement>;\n /**\n * Callback for focus event\n */\n onFocus?: FocusEventHandler<HTMLInputElement>;\n /**\n * Value of radio button\n */\n value?: string;\n}\n\nexport const RadioButton = forwardRef<HTMLLabelElement, RadioButtonProps>(\n function RadioButton(props, ref) {\n const {\n checked: checkedProp,\n className,\n disabled,\n error,\n inputProps,\n label,\n name: nameProp,\n onFocus,\n onBlur,\n onChange,\n value,\n ...rest\n } = props;\n\n const radioGroup = useRadioGroup();\n\n const radioGroupChecked =\n radioGroup.value != null && value != null\n ? radioGroup.value === value\n : checkedProp;\n const name = nameProp ?? radioGroup.name;\n\n const [checked, setCheckedState] = useControlled({\n controlled: radioGroupChecked,\n default: Boolean(checkedProp),\n name: \"RadioBase\",\n state: \"checked\",\n });\n\n const handleChange: ChangeEventHandler<HTMLInputElement> = (event) => {\n const newChecked = event.target.checked;\n setCheckedState(newChecked);\n\n onChange?.(event);\n radioGroup.onChange?.(event);\n };\n\n return (\n <label\n className={clsx(\n withBaseName(),\n {\n [withBaseName(\"disabled\")]: disabled,\n },\n className\n )}\n ref={ref}\n {...rest}\n >\n <input\n className={withBaseName(\"input\")}\n {...inputProps}\n checked={checked}\n disabled={disabled}\n name={name}\n value={value}\n onBlur={onBlur}\n onChange={handleChange}\n onFocus={onFocus}\n type=\"radio\"\n />\n <RadioButtonIcon checked={checked} error={error} disabled={disabled} />\n {label}\n </label>\n );\n }\n);\n"],"names":["RadioButton"],"mappings":";;;;;;;;;;;;;AAeA,MAAM,YAAA,GAAe,aAAa,iBAAiB,CAAA,CAAA;AAiD5C,MAAM,WAAc,GAAA,UAAA;AAAA,EACzB,SAASA,YAAY,CAAA,KAAA,EAAO,GAAK,EAAA;AAC/B,IAAM,MAAA;AAAA,MACJ,OAAS,EAAA,WAAA;AAAA,MACT,SAAA;AAAA,MACA,QAAA;AAAA,MACA,KAAA;AAAA,MACA,UAAA;AAAA,MACA,KAAA;AAAA,MACA,IAAM,EAAA,QAAA;AAAA,MACN,OAAA;AAAA,MACA,MAAA;AAAA,MACA,QAAA;AAAA,MACA,KAAA;AAAA,MACG,GAAA,IAAA;AAAA,KACD,GAAA,KAAA,CAAA;AAEJ,IAAA,MAAM,aAAa,aAAc,EAAA,CAAA;AAEjC,IAAM,MAAA,iBAAA,GACJ,WAAW,KAAS,IAAA,IAAA,IAAQ,SAAS,IACjC,GAAA,UAAA,CAAW,UAAU,KACrB,GAAA,WAAA,CAAA;AACN,IAAM,MAAA,IAAA,GAAO,8BAAY,UAAW,CAAA,IAAA,CAAA;AAEpC,IAAA,MAAM,CAAC,OAAA,EAAS,eAAe,CAAA,GAAI,aAAc,CAAA;AAAA,MAC/C,UAAY,EAAA,iBAAA;AAAA,MACZ,OAAA,EAAS,QAAQ,WAAW,CAAA;AAAA,MAC5B,IAAM,EAAA,WAAA;AAAA,MACN,KAAO,EAAA,SAAA;AAAA,KACR,CAAA,CAAA;AAED,IAAM,MAAA,YAAA,GAAqD,CAAC,KAAU,KAAA;AAhG1E,MAAA,IAAA,EAAA,CAAA;AAiGM,MAAM,MAAA,UAAA,GAAa,MAAM,MAAO,CAAA,OAAA,CAAA;AAChC,MAAA,eAAA,CAAgB,UAAU,CAAA,CAAA;AAE1B,MAAW,QAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,QAAA,CAAA,KAAA,CAAA,CAAA;AACX,MAAA,CAAA,EAAA,GAAA,UAAA,CAAW,aAAX,IAAsB,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,IAAA,CAAA,UAAA,EAAA,KAAA,CAAA,CAAA;AAAA,KACxB,CAAA;AAEA,IAAA,uBACG,IAAA,CAAA,OAAA,EAAA;AAAA,MACC,SAAW,EAAA,IAAA;AAAA,QACT,YAAa,EAAA;AAAA,QACb;AAAA,UACE,CAAC,YAAa,CAAA,UAAU,CAAI,GAAA,QAAA;AAAA,SAC9B;AAAA,QACA,SAAA;AAAA,OACF;AAAA,MACA,GAAA;AAAA,MACC,GAAG,IAAA;AAAA,MAEJ,QAAA,EAAA;AAAA,wBAAC,GAAA,CAAA,OAAA,EAAA;AAAA,UACC,SAAA,EAAW,aAAa,OAAO,CAAA;AAAA,UAC9B,GAAG,UAAA;AAAA,UACJ,OAAA;AAAA,UACA,QAAA;AAAA,UACA,IAAA;AAAA,UACA,KAAA;AAAA,UACA,MAAA;AAAA,UACA,QAAU,EAAA,YAAA;AAAA,UACV,OAAA;AAAA,UACA,IAAK,EAAA,OAAA;AAAA,SACP,CAAA;AAAA,wBACC,GAAA,CAAA,eAAA,EAAA;AAAA,UAAgB,OAAA;AAAA,UAAkB,KAAA;AAAA,UAAc,QAAA;AAAA,SAAoB,CAAA;AAAA,QACpE,KAAA;AAAA,OAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import styleInject from '../../../../node_modules/style-inject/dist/style-inject.es.js';
|
|
2
|
+
|
|
3
|
+
var css_248z = "/* Styles applied to root element */\n.saltRadioButtonGroup {\n border: none;\n margin: 0;\n padding: 0;\n}\n\n/* Styles applied when direction is vertical */\n.saltRadioButtonGroup-vertical {\n display: flex;\n gap: var(--salt-size-unit);\n flex-direction: column;\n}\n\n/* Styles applied when direction is horizontal */\n.saltRadioButtonGroup-horizontal {\n display: flex;\n gap: var(--salt-size-unit);\n flex-direction: row;\n flex-wrap: wrap;\n}\n\n.saltRadioButtonGroup-noWrap {\n flex-wrap: nowrap;\n}\n.saltRadioButtonGroup-noWrap .saltRadioButton {\n white-space: break-spaces;\n}\n\n/* Styles applied to radio group's legend */\n.saltRadioButtonGroup-legend {\n display: inline-block;\n font-size: var(--formField-label-fontSize);\n color: var(--salt-text-primary-foreground);\n margin-bottom: calc(var(--salt-size-unit) * 2);\n}\n";
|
|
4
|
+
styleInject(css_248z);
|
|
5
|
+
|
|
6
|
+
export { css_248z as default };
|
|
7
|
+
//# sourceMappingURL=RadioButtonGroup.css.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"RadioButtonGroup.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;"}
|
|
@@ -0,0 +1,57 @@
|
|
|
1
|
+
import { jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { clsx } from 'clsx';
|
|
3
|
+
import { forwardRef } from 'react';
|
|
4
|
+
import { makePrefixer } from '../utils/makePrefixer.js';
|
|
5
|
+
import { useControlled } from '../utils/useControlled.js';
|
|
6
|
+
import '../utils/useFloatingUI.js';
|
|
7
|
+
import { useId } from '../utils/useId.js';
|
|
8
|
+
import '../salt-provider/SaltProvider.js';
|
|
9
|
+
import '../viewport/ViewportProvider.js';
|
|
10
|
+
import { RadioGroupContext } from './internal/RadioGroupContext.js';
|
|
11
|
+
import './RadioButtonGroup.css.js';
|
|
12
|
+
|
|
13
|
+
const withBaseName = makePrefixer("saltRadioButtonGroup");
|
|
14
|
+
const RadioButtonGroup = forwardRef(function RadioButtonGroup2(props, ref) {
|
|
15
|
+
const {
|
|
16
|
+
children,
|
|
17
|
+
className,
|
|
18
|
+
defaultValue,
|
|
19
|
+
direction = "vertical",
|
|
20
|
+
wrap = true,
|
|
21
|
+
name: nameProp,
|
|
22
|
+
onChange,
|
|
23
|
+
value: valueProp,
|
|
24
|
+
...rest
|
|
25
|
+
} = props;
|
|
26
|
+
const [value, setStateValue] = useControlled({
|
|
27
|
+
controlled: valueProp,
|
|
28
|
+
default: defaultValue,
|
|
29
|
+
state: "value",
|
|
30
|
+
name: "RadioButtonGroup"
|
|
31
|
+
});
|
|
32
|
+
const handleChange = (event) => {
|
|
33
|
+
setStateValue(event.target.value);
|
|
34
|
+
onChange == null ? void 0 : onChange(event);
|
|
35
|
+
};
|
|
36
|
+
const name = useId(nameProp);
|
|
37
|
+
return /* @__PURE__ */ jsx("fieldset", {
|
|
38
|
+
className: clsx(
|
|
39
|
+
withBaseName(),
|
|
40
|
+
withBaseName(direction),
|
|
41
|
+
{
|
|
42
|
+
[withBaseName("noWrap")]: !wrap
|
|
43
|
+
},
|
|
44
|
+
className
|
|
45
|
+
),
|
|
46
|
+
"data-testid": "radio-button-group",
|
|
47
|
+
ref,
|
|
48
|
+
...rest,
|
|
49
|
+
children: /* @__PURE__ */ jsx(RadioGroupContext.Provider, {
|
|
50
|
+
value: { name, onChange: handleChange, value },
|
|
51
|
+
children
|
|
52
|
+
})
|
|
53
|
+
});
|
|
54
|
+
});
|
|
55
|
+
|
|
56
|
+
export { RadioButtonGroup };
|
|
57
|
+
//# sourceMappingURL=RadioButtonGroup.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"RadioButtonGroup.js","sources":["../src/radio-button/RadioButtonGroup.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n ChangeEventHandler,\n ComponentPropsWithoutRef,\n forwardRef,\n} from \"react\";\nimport { makePrefixer, useControlled, useId } from \"../utils\";\nimport { RadioGroupContext } from \"./internal/RadioGroupContext\";\n\nimport \"./RadioButtonGroup.css\";\n\nconst withBaseName = makePrefixer(\"saltRadioButtonGroup\");\n\nexport interface RadioButtonGroupProps\n extends Omit<ComponentPropsWithoutRef<\"fieldset\">, \"onChange\"> {\n /**\n * Set the selected value when initialized.\n */\n defaultValue?: string;\n /**\n * Set the group direction.\n */\n direction?: \"horizontal\" | \"vertical\";\n /**\n * Only for horizontal direction. When `true` the text in radio button label will wrap to fit within the container. Otherwise the radio buttons will wrap onto the next line.\n */\n wrap?: boolean;\n /**\n * The name to be set on each radio button within the group. If not set, then one will be generated for you.\n */\n name?: string;\n /**\n * Callback for change event.\n */\n onChange?: ChangeEventHandler<HTMLInputElement>;\n /**\n * The value of the radio group, required for a controlled component.\n */\n value?: string;\n}\n\nexport const RadioButtonGroup = forwardRef<\n HTMLFieldSetElement,\n RadioButtonGroupProps\n>(function RadioButtonGroup(props, ref) {\n const {\n children,\n className,\n defaultValue,\n direction = \"vertical\",\n wrap = true,\n name: nameProp,\n onChange,\n value: valueProp,\n ...rest\n } = props;\n\n const [value, setStateValue] = useControlled({\n controlled: valueProp,\n default: defaultValue,\n state: \"value\",\n name: \"RadioButtonGroup\",\n });\n\n const handleChange: ChangeEventHandler<HTMLInputElement> = (event) => {\n setStateValue(event.target.value);\n onChange?.(event);\n };\n\n const name = useId(nameProp);\n\n return (\n <fieldset\n className={clsx(\n withBaseName(),\n withBaseName(direction),\n {\n [withBaseName(\"noWrap\")]: !wrap,\n },\n className\n )}\n data-testid=\"radio-button-group\"\n ref={ref}\n {...rest}\n >\n <RadioGroupContext.Provider\n value={{ name, onChange: handleChange, value }}\n >\n {children}\n </RadioGroupContext.Provider>\n </fieldset>\n );\n});\n"],"names":["RadioButtonGroup"],"mappings":";;;;;;;;;;;;AAWA,MAAM,YAAA,GAAe,aAAa,sBAAsB,CAAA,CAAA;AA8BjD,MAAM,gBAAmB,GAAA,UAAA,CAG9B,SAASA,iBAAAA,CAAiB,OAAO,GAAK,EAAA;AACtC,EAAM,MAAA;AAAA,IACJ,QAAA;AAAA,IACA,SAAA;AAAA,IACA,YAAA;AAAA,IACA,SAAY,GAAA,UAAA;AAAA,IACZ,IAAO,GAAA,IAAA;AAAA,IACP,IAAM,EAAA,QAAA;AAAA,IACN,QAAA;AAAA,IACA,KAAO,EAAA,SAAA;AAAA,IACJ,GAAA,IAAA;AAAA,GACD,GAAA,KAAA,CAAA;AAEJ,EAAA,MAAM,CAAC,KAAA,EAAO,aAAa,CAAA,GAAI,aAAc,CAAA;AAAA,IAC3C,UAAY,EAAA,SAAA;AAAA,IACZ,OAAS,EAAA,YAAA;AAAA,IACT,KAAO,EAAA,OAAA;AAAA,IACP,IAAM,EAAA,kBAAA;AAAA,GACP,CAAA,CAAA;AAED,EAAM,MAAA,YAAA,GAAqD,CAAC,KAAU,KAAA;AACpE,IAAc,aAAA,CAAA,KAAA,CAAM,OAAO,KAAK,CAAA,CAAA;AAChC,IAAW,QAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,QAAA,CAAA,KAAA,CAAA,CAAA;AAAA,GACb,CAAA;AAEA,EAAM,MAAA,IAAA,GAAO,MAAM,QAAQ,CAAA,CAAA;AAE3B,EAAA,uBACG,GAAA,CAAA,UAAA,EAAA;AAAA,IACC,SAAW,EAAA,IAAA;AAAA,MACT,YAAa,EAAA;AAAA,MACb,aAAa,SAAS,CAAA;AAAA,MACtB;AAAA,QACE,CAAC,YAAA,CAAa,QAAQ,CAAA,GAAI,CAAC,IAAA;AAAA,OAC7B;AAAA,MACA,SAAA;AAAA,KACF;AAAA,IACA,aAAY,EAAA,oBAAA;AAAA,IACZ,GAAA;AAAA,IACC,GAAG,IAAA;AAAA,IAEJ,QAAA,kBAAA,GAAA,CAAC,kBAAkB,QAAlB,EAAA;AAAA,MACC,KAAO,EAAA,EAAE,IAAM,EAAA,QAAA,EAAU,cAAc,KAAM,EAAA;AAAA,MAE5C,QAAA;AAAA,KACH,CAAA;AAAA,GACF,CAAA,CAAA;AAEJ,CAAC;;;;"}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import styleInject from '../../../../node_modules/style-inject/dist/style-inject.es.js';
|
|
2
|
+
|
|
3
|
+
var css_248z = "/* Styles applied to radio button icon */\n.saltRadioButtonIcon {\n width: var(--salt-size-selectable);\n height: var(--salt-size-selectable);\n border-radius: 50%;\n flex: none;\n margin-top: var(--salt-size-border);\n}\n\n/* Styles applied to radio button icon circle */\n.saltRadioButtonIcon-circle {\n fill: var(--saltRadioButton-icon-fill, var(--salt-container-primary-background));\n stroke: var(--saltRadioButton-icon-stroke, var(--salt-selectable-foreground));\n stroke-width: var(--salt-size-border);\n}\n\n/* Styles applied to radio button icon on hover */\n.saltRadioButton:hover .saltRadioButtonIcon-circle {\n fill: var(--saltRadioButton-icon-hover-fill, var(--salt-selectable-background-hover));\n stroke: var(--saltRadioButton-icon-stroke-hover, var(--salt-selectable-foreground-hover));\n}\n\n/* Styles applied to radio button icon if checked */\n.saltRadioButtonIcon-checked .saltRadioButtonIcon-circle,\n.saltRadioButton:hover .saltRadioButtonIcon-checked .saltRadioButtonIcon-circle {\n fill: var(--saltRadioButton-icon-checked-fill, var(--salt-selectable-foreground-selected));\n stroke: var(--saltRadioButton-icon-checked-stroke, var(--salt-selectable-foreground-selected));\n}\n\n/* Styles applied to radio button icon if disabled */\n.saltRadioButtonIcon-disabled .saltRadioButtonIcon-circle,\n.saltRadioButton:hover .saltRadioButtonIcon-disabled .saltRadioButtonIcon-circle {\n fill: var(--saltRadioButton-icon-disabled-fill, var(--salt-selectable-background));\n stroke: var(--saltRadioButton-icon-disabled-stroke, var(--salt-selectable-foreground-disabled));\n}\n\n/* Styles applied to radio button icon if checked and disabled */\n.saltRadioButtonIcon-disabled.saltRadioButtonIcon-checked .saltRadioButtonIcon-circle,\n.saltRadioButton:hover .saltRadioButtonIcon-disabled.saltRadioButtonIcon-checked .saltRadioButtonIcon-circle {\n fill: var(--saltRadioButton-icon-checked-disabled-fill, var(--salt-container-primary-background-disabled));\n stroke: var(--saltRadioButton-icon-checked-disabled-stroke, var(--salt-selectable-foreground-selectedDisabled));\n stroke-width: calc(var(--salt-size-border) * 6.5);\n}\n\n/* Styles applied to radio button icon with error */\n.saltRadioButtonIcon-error .saltRadioButtonIcon-circle,\n.saltRadioButton:hover .saltRadioButtonIcon-error .saltRadioButtonIcon-circle {\n stroke: var(--saltRadioButton-icon-error-stroke, var(--salt-status-error-foreground));\n}\n\n.saltRadioButton:hover .saltRadioButtonIcon-error .saltRadioButtonIcon-circle {\n fill: var(--saltRadioButton-icon-error-hover-fill, var(--salt-status-error-background));\n}\n\n/* Styles applied to radio button icon with error and disabled */\n.saltRadioButtonIcon-error.saltRadioButtonIcon-disabled .saltRadioButtonIcon-circle,\n.saltRadioButton:hover .saltRadioButtonIcon-error.saltRadioButtonIcon-disabled .saltRadioButtonIcon-circle {\n fill: var(--saltRadioButton-icon-error-disabled-fill, var(--salt-selectable-background));\n stroke: var(--saltRadioButton-icon-error-disabled-stroke, var(--salt-status-error-foreground-disabled));\n}\n\n/* Styles applied to radio button icon when checked and with error */\n.saltRadioButtonIcon-checked.saltRadioButtonIcon-error .saltRadioButtonIcon-circle,\n.saltRadioButton:hover .saltRadioButtonIcon-checked.saltRadioButtonIcon-error .saltRadioButtonIcon-circle {\n fill: var(--saltRadioButton-icon-error-fill, var(--salt-status-error-foreground));\n stroke: var(--saltRadioButton-icon-error-stroke, var(--salt-status-error-foreground));\n}\n\n/* Styles applied to radio button icon when checked and with error and disabled */\n.saltRadioButtonIcon-disabled.saltRadioButtonIcon-checked.saltRadioButtonIcon-error .saltRadioButtonIcon-circle,\n.saltRadioButton:hover .saltRadioButtonIcon-disabled.saltRadioButtonIcon-checked.saltRadioButtonIcon-error .saltRadioButtonIcon-circle {\n fill: var(--saltRadioButton-icon-error-disabled-fill, var(--salt-container-primary-background-disabled));\n stroke: var(--saltRadioButton-icon-error-disabled-stroke, var(--salt-status-error-foreground-disabled));\n}\n\n/* Styles applied to checked inner circle */\n.saltRadioButtonIcon-checked-circle {\n fill: var(--saltRadioButton-icon-inner-fill, var(--salt-container-primary-background));\n}\n\n/* Styles applied to checked inner circle when disabled */\n.saltRadioButtonIcon-disabled .saltRadioButtonIcon-checked-circle {\n fill: var(--saltRadioButton-icon-inner-disabled-fill, var(--salt-container-primary-background-disabled));\n}\n";
|
|
4
|
+
styleInject(css_248z);
|
|
5
|
+
|
|
6
|
+
export { css_248z as default };
|
|
7
|
+
//# sourceMappingURL=RadioButtonIcon.css.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"RadioButtonIcon.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;"}
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
+
import 'react';
|
|
3
|
+
import { makePrefixer } from '../utils/makePrefixer.js';
|
|
4
|
+
import '../utils/useFloatingUI.js';
|
|
5
|
+
import '../utils/useId.js';
|
|
6
|
+
import '../salt-provider/SaltProvider.js';
|
|
7
|
+
import '../viewport/ViewportProvider.js';
|
|
8
|
+
import { clsx } from 'clsx';
|
|
9
|
+
import './RadioButtonIcon.css.js';
|
|
10
|
+
|
|
11
|
+
const withBaseName = makePrefixer("saltRadioButtonIcon");
|
|
12
|
+
const RadioButtonIcon = ({
|
|
13
|
+
checked,
|
|
14
|
+
error,
|
|
15
|
+
disabled
|
|
16
|
+
}) => {
|
|
17
|
+
return /* @__PURE__ */ jsxs("svg", {
|
|
18
|
+
className: clsx(withBaseName(), {
|
|
19
|
+
[withBaseName("checked")]: checked,
|
|
20
|
+
[withBaseName("error")]: error,
|
|
21
|
+
[withBaseName("disabled")]: disabled
|
|
22
|
+
}),
|
|
23
|
+
height: "14",
|
|
24
|
+
viewBox: "0 0 14 14",
|
|
25
|
+
width: "14",
|
|
26
|
+
children: [
|
|
27
|
+
/* @__PURE__ */ jsx("circle", {
|
|
28
|
+
className: withBaseName("circle"),
|
|
29
|
+
cx: "7",
|
|
30
|
+
cy: "7",
|
|
31
|
+
r: "6.5"
|
|
32
|
+
}),
|
|
33
|
+
checked && /* @__PURE__ */ jsx("circle", {
|
|
34
|
+
className: withBaseName("checked-circle"),
|
|
35
|
+
cx: "7",
|
|
36
|
+
cy: "7",
|
|
37
|
+
r: "3.2"
|
|
38
|
+
})
|
|
39
|
+
]
|
|
40
|
+
});
|
|
41
|
+
};
|
|
42
|
+
|
|
43
|
+
export { RadioButtonIcon };
|
|
44
|
+
//# sourceMappingURL=RadioButtonIcon.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"RadioButtonIcon.js","sources":["../src/radio-button/RadioButtonIcon.tsx"],"sourcesContent":["import { makePrefixer } from \"../utils\";\nimport { clsx } from \"clsx\";\nimport \"./RadioButtonIcon.css\";\n\nconst withBaseName = makePrefixer(\"saltRadioButtonIcon\");\n\nexport interface RadioButtonIconProps {\n checked?: boolean;\n error?: boolean;\n disabled?: boolean;\n}\n\n/**\n * Default radio icon\n */\nexport const RadioButtonIcon = ({\n checked,\n error,\n disabled,\n}: RadioButtonIconProps) => {\n return (\n <svg\n className={clsx(withBaseName(), {\n [withBaseName(\"checked\")]: checked,\n [withBaseName(\"error\")]: error,\n [withBaseName(\"disabled\")]: disabled,\n })}\n height=\"14\"\n viewBox=\"0 0 14 14\"\n width=\"14\"\n >\n <circle className={withBaseName(\"circle\")} cx=\"7\" cy=\"7\" r=\"6.5\" />\n {checked && (\n <circle\n className={withBaseName(\"checked-circle\")}\n cx=\"7\"\n cy=\"7\"\n r=\"3.2\"\n />\n )}\n </svg>\n );\n};\n"],"names":[],"mappings":";;;;;;;;;;AAIA,MAAM,YAAA,GAAe,aAAa,qBAAqB,CAAA,CAAA;AAWhD,MAAM,kBAAkB,CAAC;AAAA,EAC9B,OAAA;AAAA,EACA,KAAA;AAAA,EACA,QAAA;AACF,CAA4B,KAAA;AAC1B,EAAA,uBACG,IAAA,CAAA,KAAA,EAAA;AAAA,IACC,SAAA,EAAW,IAAK,CAAA,YAAA,EAAgB,EAAA;AAAA,MAC9B,CAAC,YAAa,CAAA,SAAS,CAAI,GAAA,OAAA;AAAA,MAC3B,CAAC,YAAa,CAAA,OAAO,CAAI,GAAA,KAAA;AAAA,MACzB,CAAC,YAAa,CAAA,UAAU,CAAI,GAAA,QAAA;AAAA,KAC7B,CAAA;AAAA,IACD,MAAO,EAAA,IAAA;AAAA,IACP,OAAQ,EAAA,WAAA;AAAA,IACR,KAAM,EAAA,IAAA;AAAA,IAEN,QAAA,EAAA;AAAA,sBAAC,GAAA,CAAA,QAAA,EAAA;AAAA,QAAO,SAAA,EAAW,aAAa,QAAQ,CAAA;AAAA,QAAG,EAAG,EAAA,GAAA;AAAA,QAAI,EAAG,EAAA,GAAA;AAAA,QAAI,CAAE,EAAA,KAAA;AAAA,OAAM,CAAA;AAAA,MAChE,2BACE,GAAA,CAAA,QAAA,EAAA;AAAA,QACC,SAAA,EAAW,aAAa,gBAAgB,CAAA;AAAA,QACxC,EAAG,EAAA,GAAA;AAAA,QACH,EAAG,EAAA,GAAA;AAAA,QACH,CAAE,EAAA,KAAA;AAAA,OACJ,CAAA;AAAA,KAAA;AAAA,GAEJ,CAAA,CAAA;AAEJ;;;;"}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { createContext } from '../../utils/createContext.js';
|
|
2
|
+
import 'react';
|
|
3
|
+
import '../../utils/useFloatingUI.js';
|
|
4
|
+
import '../../utils/useId.js';
|
|
5
|
+
import '../../salt-provider/SaltProvider.js';
|
|
6
|
+
import '../../viewport/ViewportProvider.js';
|
|
7
|
+
import 'clsx';
|
|
8
|
+
|
|
9
|
+
const RadioGroupContext = createContext(
|
|
10
|
+
"RadioGroupContext",
|
|
11
|
+
{}
|
|
12
|
+
);
|
|
13
|
+
|
|
14
|
+
export { RadioGroupContext };
|
|
15
|
+
//# sourceMappingURL=RadioGroupContext.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"RadioGroupContext.js","sources":["../src/radio-button/internal/RadioGroupContext.tsx"],"sourcesContent":["import { ChangeEventHandler } from \"react\";\nimport { createContext } from \"../../utils\";\n\nexport interface RadioGroupContextValue {\n name?: string;\n value?: string;\n onChange?: ChangeEventHandler<HTMLElement>;\n}\n\nexport const RadioGroupContext = createContext<RadioGroupContextValue>(\n \"RadioGroupContext\",\n {}\n);\n"],"names":[],"mappings":";;;;;;;;AASO,MAAM,iBAAoB,GAAA,aAAA;AAAA,EAC/B,mBAAA;AAAA,EACA,EAAC;AACH;;;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useRadioGroup.js","sources":["../src/radio-button/internal/useRadioGroup.ts"],"sourcesContent":["import { useContext } from \"react\";\nimport { RadioGroupContext } from \"./RadioGroupContext\";\n\nexport function useRadioGroup() {\n return useContext(RadioGroupContext);\n}\n"],"names":[],"mappings":";;;AAGO,SAAS,aAAgB,GAAA;AAC9B,EAAA,OAAO,WAAW,iBAAiB,CAAA,CAAA;AACrC;;;;"}
|
|
@@ -5,6 +5,7 @@ import '../../utils/useFloatingUI.js';
|
|
|
5
5
|
import '../../utils/useId.js';
|
|
6
6
|
import '../../salt-provider/SaltProvider.js';
|
|
7
7
|
import '../../viewport/ViewportProvider.js';
|
|
8
|
+
import 'clsx';
|
|
8
9
|
|
|
9
10
|
const withBaseName = makePrefixer("saltSpinner");
|
|
10
11
|
const SpinnerSVG = (props) => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SpinnerSVG.js","sources":["../src/spinner/svgSpinners/SpinnerSVG.tsx"],"sourcesContent":["import { SVGAttributes } from \"react\";\nimport { makePrefixer } from \"../../utils\";\n\nconst withBaseName = makePrefixer(\"saltSpinner\");\n\n/* SVG based on MD, do not change viewbox attribute */\nexport const SpinnerSVG = (props: {\n id?: string;\n rest?: Omit<SVGAttributes<SVGSVGElement>, \"id\">;\n}) => {\n const { id: idProp, rest } = props;\n const id = idProp || \"svg-spinner\";\n\n return (\n <svg\n className={withBaseName(\"spinner\")}\n viewBox=\"0 0 28 28\"\n id={id}\n {...rest}\n >\n <defs>\n <linearGradient id={`${id}-1`} x1=\"100%\" x2=\"0%\" y1=\"78%\" y2=\"78%\">\n <stop className={withBaseName(\"gradientStop\")} offset=\"0%\" />\n <stop className={withBaseName(\"gradientStop\")} offset=\"100%\" />\n </linearGradient>\n <linearGradient id={`${id}-2`} x1=\"13%\" x2=\"100%\" y1=\"0%\" y2=\"87%\">\n <stop className={withBaseName(\"gradientStop\")} offset=\"0%\" />\n <stop\n className={withBaseName(\"gradientStop\")}\n offset=\"100%\"\n stopOpacity=\"0\"\n />\n </linearGradient>\n </defs>\n <g fill=\"none\" fillRule=\"evenodd\">\n <path\n d=\"M28 14H24C24 8.47715 19.5228 4 14 4C8.47715 4 4 8.47715 4 14 H 0 C0 6.26801 6.26801 0 14 0C21.732 0 28 6.26801 28 14Z\"\n fill={`url(#${id}-1)`}\n />\n <path\n d=\"M4 14 C4 19.5228 8.47715 24 14 24V28C6.26801 28 0 21.732 0 14 Z\"\n fill={`url(#${id}-2)`}\n />\n </g>\n </svg>\n );\n};\n"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"SpinnerSVG.js","sources":["../src/spinner/svgSpinners/SpinnerSVG.tsx"],"sourcesContent":["import { SVGAttributes } from \"react\";\nimport { makePrefixer } from \"../../utils\";\n\nconst withBaseName = makePrefixer(\"saltSpinner\");\n\n/* SVG based on MD, do not change viewbox attribute */\nexport const SpinnerSVG = (props: {\n id?: string;\n rest?: Omit<SVGAttributes<SVGSVGElement>, \"id\">;\n}) => {\n const { id: idProp, rest } = props;\n const id = idProp || \"svg-spinner\";\n\n return (\n <svg\n className={withBaseName(\"spinner\")}\n viewBox=\"0 0 28 28\"\n id={id}\n {...rest}\n >\n <defs>\n <linearGradient id={`${id}-1`} x1=\"100%\" x2=\"0%\" y1=\"78%\" y2=\"78%\">\n <stop className={withBaseName(\"gradientStop\")} offset=\"0%\" />\n <stop className={withBaseName(\"gradientStop\")} offset=\"100%\" />\n </linearGradient>\n <linearGradient id={`${id}-2`} x1=\"13%\" x2=\"100%\" y1=\"0%\" y2=\"87%\">\n <stop className={withBaseName(\"gradientStop\")} offset=\"0%\" />\n <stop\n className={withBaseName(\"gradientStop\")}\n offset=\"100%\"\n stopOpacity=\"0\"\n />\n </linearGradient>\n </defs>\n <g fill=\"none\" fillRule=\"evenodd\">\n <path\n d=\"M28 14H24C24 8.47715 19.5228 4 14 4C8.47715 4 4 8.47715 4 14 H 0 C0 6.26801 6.26801 0 14 0C21.732 0 28 6.26801 28 14Z\"\n fill={`url(#${id}-1)`}\n />\n <path\n d=\"M4 14 C4 19.5228 8.47715 24 14 24V28C6.26801 28 0 21.732 0 14 Z\"\n fill={`url(#${id}-2)`}\n />\n </g>\n </svg>\n );\n};\n"],"names":[],"mappings":";;;;;;;;;AAGA,MAAM,YAAA,GAAe,aAAa,aAAa,CAAA,CAAA;AAGlC,MAAA,UAAA,GAAa,CAAC,KAGrB,KAAA;AACJ,EAAA,MAAM,EAAE,EAAA,EAAI,MAAQ,EAAA,IAAA,EAAS,GAAA,KAAA,CAAA;AAC7B,EAAA,MAAM,KAAK,MAAU,IAAA,aAAA,CAAA;AAErB,EAAA,uBACG,IAAA,CAAA,KAAA,EAAA;AAAA,IACC,SAAA,EAAW,aAAa,SAAS,CAAA;AAAA,IACjC,OAAQ,EAAA,WAAA;AAAA,IACR,EAAA;AAAA,IACC,GAAG,IAAA;AAAA,IAEJ,QAAA,EAAA;AAAA,sBAAC,IAAA,CAAA,MAAA,EAAA;AAAA,QACC,QAAA,EAAA;AAAA,0BAAC,IAAA,CAAA,gBAAA,EAAA;AAAA,YAAe,IAAI,CAAG,EAAA,EAAA,CAAA,EAAA,CAAA;AAAA,YAAQ,EAAG,EAAA,MAAA;AAAA,YAAO,EAAG,EAAA,IAAA;AAAA,YAAK,EAAG,EAAA,KAAA;AAAA,YAAM,EAAG,EAAA,KAAA;AAAA,YAC3D,QAAA,EAAA;AAAA,8BAAC,GAAA,CAAA,MAAA,EAAA;AAAA,gBAAK,SAAA,EAAW,aAAa,cAAc,CAAA;AAAA,gBAAG,MAAO,EAAA,IAAA;AAAA,eAAK,CAAA;AAAA,8BAC1D,GAAA,CAAA,MAAA,EAAA;AAAA,gBAAK,SAAA,EAAW,aAAa,cAAc,CAAA;AAAA,gBAAG,MAAO,EAAA,MAAA;AAAA,eAAO,CAAA;AAAA,aAAA;AAAA,WAC/D,CAAA;AAAA,0BACC,IAAA,CAAA,gBAAA,EAAA;AAAA,YAAe,IAAI,CAAG,EAAA,EAAA,CAAA,EAAA,CAAA;AAAA,YAAQ,EAAG,EAAA,KAAA;AAAA,YAAM,EAAG,EAAA,MAAA;AAAA,YAAO,EAAG,EAAA,IAAA;AAAA,YAAK,EAAG,EAAA,KAAA;AAAA,YAC3D,QAAA,EAAA;AAAA,8BAAC,GAAA,CAAA,MAAA,EAAA;AAAA,gBAAK,SAAA,EAAW,aAAa,cAAc,CAAA;AAAA,gBAAG,MAAO,EAAA,IAAA;AAAA,eAAK,CAAA;AAAA,8BAC1D,GAAA,CAAA,MAAA,EAAA;AAAA,gBACC,SAAA,EAAW,aAAa,cAAc,CAAA;AAAA,gBACtC,MAAO,EAAA,MAAA;AAAA,gBACP,WAAY,EAAA,GAAA;AAAA,eACd,CAAA;AAAA,aAAA;AAAA,WACF,CAAA;AAAA,SAAA;AAAA,OACF,CAAA;AAAA,sBACC,IAAA,CAAA,GAAA,EAAA;AAAA,QAAE,IAAK,EAAA,MAAA;AAAA,QAAO,QAAS,EAAA,SAAA;AAAA,QACtB,QAAA,EAAA;AAAA,0BAAC,GAAA,CAAA,MAAA,EAAA;AAAA,YACC,CAAE,EAAA,uHAAA;AAAA,YACF,MAAM,CAAQ,KAAA,EAAA,EAAA,CAAA,GAAA,CAAA;AAAA,WAChB,CAAA;AAAA,0BACC,GAAA,CAAA,MAAA,EAAA;AAAA,YACC,CAAE,EAAA,iEAAA;AAAA,YACF,MAAM,CAAQ,KAAA,EAAA,EAAA,CAAA,GAAA,CAAA;AAAA,WAChB,CAAA;AAAA,SAAA;AAAA,OACF,CAAA;AAAA,KAAA;AAAA,GACF,CAAA,CAAA;AAEJ;;;;"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import styleInject from '../../../../node_modules/style-inject/dist/style-inject.es.js';
|
|
2
2
|
|
|
3
|
-
var css_248z = "/* Main css class. Style for body text */\n.saltText {\n color: var(--saltText-color, var(--text-color));\n}\n\n.saltText::selection {\n background: var(--saltText-highlight, var(--salt-text-background-selected));\n}\n\n/* Allows truncation */\n.saltText-lineClamp {\n display: -webkit-box;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: var(--text-max-rows, 0);\n overflow: hidden;\n word-break: break-word;\n}\n\n/* Primary variant */\n.saltText-primary {\n --text-color: var(--salt-text-primary-foreground);\n}\n\n/* Disabled primary variant */\n.saltText-primary.saltText-disabled {\n --text-color: var(--salt-text-primary-foreground-disabled);\n}\n\n/* Secondary variant */\n.saltText-secondary {\n --text-color: var(--salt-text-secondary-foreground);\n}\n\n/* Disabled secondary variant */\n.saltText-secondary.saltText-disabled {\n --text-color: var(--salt-text-secondary-foreground-disabled);\n}\n\n/* Body emphasis strong */\n.saltText strong {\n font-weight: var(--salt-text-fontWeight-strong);\n}\n/* Body emphasis small */\n.saltText small {\n font-size: inherit;\n font-weight: var(--salt-text-fontWeight-small);\n}\n\n/* Display 1 */\n.saltText-display1.saltText {\n font-size: var(--salt-text-display1-fontSize);\n font-weight: var(--salt-text-display1-fontWeight);\n line-height: var(--salt-text-display1-lineHeight);\n}\n\n/* Display 2 */\n.saltText-display2.saltText {\n font-size: var(--salt-text-display2-fontSize);\n font-weight: var(--salt-text-display2-fontWeight);\n line-height: var(--salt-text-display2-lineHeight);\n}\n\n/* Display 3 */\n.saltText-display3.saltText {\n font-size: var(--salt-text-display3-fontSize);\n font-weight: var(--salt-text-display3-fontWeight);\n line-height: var(--salt-text-display3-lineHeight);\n}\n\n/* Heading 1 */\nh1.saltText,\n.saltText-h1.saltText {\n font-size: var(--salt-text-h1-fontSize);\n font-weight: var(--salt-text-h1-fontWeight);\n line-height: var(--salt-text-h1-lineHeight);\n}\n\n/* H1 emphasis strong */\nh1.saltText strong,\n.saltText-h1.saltText strong {\n font-weight: var(--salt-text-h1-fontWeight-strong);\n}\n/* H1 emphasis small */\nh1.saltText small,\n.saltText-h1.saltText small {\n font-size: inherit;\n font-weight: var(--salt-text-h1-fontWeight-small);\n}\n\n/* Heading 2 */\nh2.saltText,\n.saltText-h2.saltText {\n font-size: var(--salt-text-h2-fontSize);\n font-weight: var(--salt-text-h2-fontWeight);\n line-height: var(--salt-text-h2-lineHeight);\n}\n\n/* H2 emphasis strong */\nh2.saltText strong,\n.saltText-h2.saltText strong {\n font-weight: var(--salt-text-h2-fontWeight-strong);\n}\n/* H2 emphasis small */\nh2.saltText small,\n.saltText-h2.saltText small {\n font-size: inherit;\n font-weight: var(--salt-text-h2-fontWeight-small);\n}\n\n/* Heading 3 */\nh3.saltText,\n.saltText-h3.saltText {\n font-size: var(--salt-text-h3-fontSize);\n font-weight: var(--salt-text-h3-fontWeight);\n line-height: var(--salt-text-h3-lineHeight);\n}\n\n/* H3 emphasis strong */\nh3.saltText strong,\n.saltText-h3.saltText strong {\n font-weight: var(--salt-text-h3-fontWeight-strong);\n}\n/* H3 emphasis small */\nh3.saltText small,\n.saltText-h3.saltText small {\n font-size: inherit;\n font-weight: var(--salt-text-h3-fontWeight-small);\n}\n\n/* Heading 4 */\nh4.saltText,\n.saltText-h4.saltText {\n font-size: var(--salt-text-h4-fontSize);\n font-weight: var(--salt-text-h4-fontWeight);\n line-height: var(--salt-text-h4-lineHeight);\n}\n\n/* H4 emphasis strong */\nh4.saltText strong,\n.saltText-h4.saltText strong {\n font-weight: var(--salt-text-h4-fontWeight-strong);\n}\n/* H4 emphasis small */\nh4.saltText small,\n.saltText-h4.saltText small {\n font-size: inherit;\n font-weight: var(--salt-text-h4-fontWeight-small);\n}\n\n/* Label */\nlabel.saltText,\n.saltText-label.saltText {\n font-size: var(--salt-text-label-fontSize);\n line-height: var(--salt-text-label-lineHeight);\n font-weight: var(--salt-text-fontWeight);\n}\n\n/* Label emphasis strong */\nlabel.saltText strong,\n.saltText-label.saltText strong {\n font-weight: var(--salt-text-fontWeight-strong);\n}\n/* Label emphasis small */\nlabel.saltText small,\n.saltText-label.saltText small {\n font-size: inherit;\n font-weight: var(--salt-text-fontWeight-small);\n}\n";
|
|
3
|
+
var css_248z = "/* Main css class. Style for body text */\n.saltText {\n color: var(--saltText-color, var(--text-color));\n font-family: var(--saltText-fontFamily, var(--salt-text-fontFamily));\n}\n\n.saltText::selection {\n background: var(--saltText-highlight, var(--salt-text-background-selected));\n}\n\n/* Allows truncation */\n.saltText-lineClamp {\n display: -webkit-box;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: var(--text-max-rows, 0);\n overflow: hidden;\n word-break: break-word;\n}\n\n/* Primary variant */\n.saltText-primary {\n --text-color: var(--salt-text-primary-foreground);\n}\n\n/* Disabled primary variant */\n.saltText-primary.saltText-disabled {\n --text-color: var(--salt-text-primary-foreground-disabled);\n}\n\n/* Secondary variant */\n.saltText-secondary {\n --text-color: var(--salt-text-secondary-foreground);\n}\n\n/* Disabled secondary variant */\n.saltText-secondary.saltText-disabled {\n --text-color: var(--salt-text-secondary-foreground-disabled);\n}\n\n/* Body emphasis strong */\n.saltText strong {\n font-weight: var(--salt-text-fontWeight-strong);\n}\n/* Body emphasis small */\n.saltText small {\n font-size: inherit;\n font-weight: var(--salt-text-fontWeight-small);\n}\n\n/* Display 1 */\n.saltText-display1.saltText {\n font-family: var(--salt-text-display1-fontFamily);\n font-size: var(--salt-text-display1-fontSize);\n font-weight: var(--salt-text-display1-fontWeight);\n line-height: var(--salt-text-display1-lineHeight);\n}\n\n/* Display 2 */\n.saltText-display2.saltText {\n font-family: var(--salt-text-display2-fontFamily);\n font-size: var(--salt-text-display2-fontSize);\n font-weight: var(--salt-text-display2-fontWeight);\n line-height: var(--salt-text-display2-lineHeight);\n}\n\n/* Display 3 */\n.saltText-display3.saltText {\n font-family: var(--salt-text-display3-fontFamily);\n font-size: var(--salt-text-display3-fontSize);\n font-weight: var(--salt-text-display3-fontWeight);\n line-height: var(--salt-text-display3-lineHeight);\n}\n\n/* Heading 1 */\nh1.saltText,\n.saltText-h1.saltText {\n font-family: var(--salt-text-h1-fontFamily);\n font-size: var(--salt-text-h1-fontSize);\n font-weight: var(--salt-text-h1-fontWeight);\n line-height: var(--salt-text-h1-lineHeight);\n}\n\n/* H1 emphasis strong */\nh1.saltText strong,\n.saltText-h1.saltText strong {\n font-weight: var(--salt-text-h1-fontWeight-strong);\n}\n/* H1 emphasis small */\nh1.saltText small,\n.saltText-h1.saltText small {\n font-size: inherit;\n font-weight: var(--salt-text-h1-fontWeight-small);\n}\n\n/* Heading 2 */\nh2.saltText,\n.saltText-h2.saltText {\n font-family: var(--salt-text-h2-fontFamily);\n font-size: var(--salt-text-h2-fontSize);\n font-weight: var(--salt-text-h2-fontWeight);\n line-height: var(--salt-text-h2-lineHeight);\n}\n\n/* H2 emphasis strong */\nh2.saltText strong,\n.saltText-h2.saltText strong {\n font-weight: var(--salt-text-h2-fontWeight-strong);\n}\n/* H2 emphasis small */\nh2.saltText small,\n.saltText-h2.saltText small {\n font-size: inherit;\n font-weight: var(--salt-text-h2-fontWeight-small);\n}\n\n/* Heading 3 */\nh3.saltText,\n.saltText-h3.saltText {\n font-family: var(--salt-text-h3-fontFamily);\n font-size: var(--salt-text-h3-fontSize);\n font-weight: var(--salt-text-h3-fontWeight);\n line-height: var(--salt-text-h3-lineHeight);\n}\n\n/* H3 emphasis strong */\nh3.saltText strong,\n.saltText-h3.saltText strong {\n font-weight: var(--salt-text-h3-fontWeight-strong);\n}\n/* H3 emphasis small */\nh3.saltText small,\n.saltText-h3.saltText small {\n font-size: inherit;\n font-weight: var(--salt-text-h3-fontWeight-small);\n}\n\n/* Heading 4 */\nh4.saltText,\n.saltText-h4.saltText {\n font-family: var(--salt-text-h4-fontFamily);\n font-size: var(--salt-text-h4-fontSize);\n font-weight: var(--salt-text-h4-fontWeight);\n line-height: var(--salt-text-h4-lineHeight);\n}\n\n/* H4 emphasis strong */\nh4.saltText strong,\n.saltText-h4.saltText strong {\n font-weight: var(--salt-text-h4-fontWeight-strong);\n}\n/* H4 emphasis small */\nh4.saltText small,\n.saltText-h4.saltText small {\n font-size: inherit;\n font-weight: var(--salt-text-h4-fontWeight-small);\n}\n\n/* Label */\nlabel.saltText,\n.saltText-label.saltText {\n font-family: var(--salt-text-label-fontFamily);\n font-size: var(--salt-text-label-fontSize);\n line-height: var(--salt-text-label-lineHeight);\n font-weight: var(--salt-text-fontWeight);\n}\n\n/* Label emphasis strong */\nlabel.saltText strong,\n.saltText-label.saltText strong {\n font-weight: var(--salt-text-fontWeight-strong);\n}\n/* Label emphasis small */\nlabel.saltText small,\n.saltText-label.saltText small {\n font-size: inherit;\n font-weight: var(--salt-text-fontWeight-small);\n}\n";
|
|
4
4
|
styleInject(css_248z);
|
|
5
5
|
|
|
6
6
|
export { css_248z as default };
|