reshaped 2.3.1 → 2.4.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/CHANGELOG.md +8 -17
- package/bundle.css +1 -1
- package/bundle.d.ts +2 -0
- package/bundle.js +10 -10
- package/components/Autocomplete/Autocomplete.types.d.ts +0 -1
- package/components/Button/Button.module.css +1 -1
- package/components/Card/Card.module.css +1 -1
- package/components/Checkbox/Checkbox.js +2 -3
- package/components/Checkbox/Checkbox.module.css +1 -1
- package/components/Radio/Radio.js +1 -2
- package/components/Table/Table.d.ts +11 -0
- package/components/Table/Table.js +45 -0
- package/components/Table/Table.module.css +1 -0
- package/components/Table/Table.types.d.ts +38 -0
- package/components/Table/Table.types.js +1 -0
- package/components/Table/index.d.ts +2 -0
- package/components/Table/index.js +1 -0
- package/components/Table/tests/Table.stories.d.ts +10 -0
- package/components/Table/tests/Table.stories.js +194 -0
- package/components/Tabs/Tabs.types.d.ts +1 -0
- package/components/Tabs/TabsContext.d.ts +1 -0
- package/components/Tabs/TabsControlled.js +2 -0
- package/components/Tabs/TabsItem.js +17 -1
- package/components/Tabs/TabsList.js +2 -3
- package/components/Theme/GlobalColorMode.js +13 -6
- package/components/Theme/Theme.js +12 -3
- package/components/Toast/ToastContainer.js +0 -1
- package/components/View/View.module.css +1 -1
- package/components/View/View.types.d.ts +2 -2
- package/components/View/tests/View.stories.js +12 -0
- package/index.d.ts +2 -0
- package/index.js +1 -0
- package/package.json +1 -1
- package/styles/minWidth/index.d.ts +3 -0
- package/styles/minWidth/index.js +10 -0
- package/styles/minWidth/minWidth.module.css +1 -0
- package/themes/_generator/utilities/css.js +1 -1
- package/themes/figma/theme.css +1 -1
- package/themes/fragments/twitter/theme.css +1 -1
- package/themes/reshaped/theme.css +1 -1
- package/themes/slate/theme.css +1 -1
- package/utilities/helpers.d.ts +0 -1
|
@@ -7,6 +7,7 @@ import { useTheme, useGlobalColorMode } from "./useTheme.js";
|
|
|
7
7
|
import s from "./Theme.module.css";
|
|
8
8
|
const Theme = (props) => {
|
|
9
9
|
const { name, defaultName, colorMode, children, className } = props;
|
|
10
|
+
const [mounted, setMounted] = React.useState(false);
|
|
10
11
|
const [stateTheme, setStateTheme] = React.useState(defaultName);
|
|
11
12
|
const globalColorMode = useGlobalColorMode();
|
|
12
13
|
const parentTheme = useTheme();
|
|
@@ -19,14 +20,22 @@ const Theme = (props) => {
|
|
|
19
20
|
const setTheme = (theme) => {
|
|
20
21
|
setStateTheme(theme);
|
|
21
22
|
};
|
|
23
|
+
useIsomorphicLayoutEffect(() => {
|
|
24
|
+
setMounted(true);
|
|
25
|
+
}, []);
|
|
22
26
|
useIsomorphicLayoutEffect(() => {
|
|
23
27
|
if (!document || !isRootProvider)
|
|
24
28
|
return;
|
|
29
|
+
const hasColorModeApplied = document.documentElement.getAttribute("data-rs-color-mode");
|
|
25
30
|
document.documentElement.setAttribute("data-rs-theme", usedTheme);
|
|
26
|
-
|
|
31
|
+
if (!hasColorModeApplied) {
|
|
32
|
+
document.documentElement.setAttribute("data-rs-color-mode", usedColorMode);
|
|
33
|
+
}
|
|
27
34
|
return () => {
|
|
28
35
|
document.documentElement.removeAttribute("data-rs-theme");
|
|
29
|
-
|
|
36
|
+
if (!hasColorModeApplied) {
|
|
37
|
+
document.documentElement.removeAttribute("data-rs-color-mode");
|
|
38
|
+
}
|
|
30
39
|
};
|
|
31
40
|
}, [usedTheme, usedColorMode, isRootProvider]);
|
|
32
41
|
return (React.createElement(ThemeContext.Provider, { value: {
|
|
@@ -34,6 +43,6 @@ const Theme = (props) => {
|
|
|
34
43
|
colorMode: usedColorMode,
|
|
35
44
|
setTheme,
|
|
36
45
|
} },
|
|
37
|
-
React.createElement("div", { className: rootClassNames, "data-rs-theme": isRootProvider ? undefined : usedTheme, "data-rs-color-mode": isRootProvider ? undefined : usedColorMode }, children)));
|
|
46
|
+
React.createElement("div", { className: rootClassNames, "data-rs-theme": isRootProvider ? undefined : usedTheme, "data-rs-color-mode": isRootProvider || (!colorMode && !mounted) ? undefined : usedColorMode }, children)));
|
|
38
47
|
};
|
|
39
48
|
export default Theme;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.root{--rs-view-gaps-count-multiplier:1;--rs-view-z:auto;--rs-view-gap-value:calc(var(--rs-view-gap) * var(--rs-unit-x1));gap:var(--rs-view-gap-value);z-index:var(--rs-view-z)}.item{--rs-view-item-gap:calc(var(--rs-unit-x1) * var(--rs-view-item-gap-before) - var(--rs-view-gap-value));order:var(--rs-view-item-order)}.--padding{padding:calc(var(--rs-unit-x1) * var(--rs-view-p-vertical, var(--rs-view-p-top))) calc(var(--rs-unit-x1) * var(--rs-view-p-horizontal, var(--rs-view-p-start)))}.--padding-top{padding-top:calc(var(--rs-unit-x1) * var(--rs-view-p-top))}.--padding-bottom{padding-bottom:calc(var(--rs-unit-x1) * var(--rs-view-p-bottom))}.--padding-start{padding-inline-start:calc(var(--rs-unit-x1) * var(--rs-view-p-start))}.--padding-end{padding-inline-end:calc(var(--rs-unit-x1) * var(--rs-view-p-end))}.--animated{transition:var(--rs-duration-medium) var(--rs-easing-standard);transition-property:background-color,color,border-color}.--align-text-start{text-align:start}.--align-text-center{text-align:center}.--align-text-end{text-align:end}.--bg-neutral{background-color:var(--rs-color-background-neutral);color:var(--rs-color-on-background-neutral)}.--bg-positive{background-color:var(--rs-color-background-positive);color:var(--rs-color-on-background-positive)}.--bg-critical{background-color:var(--rs-color-background-critical);color:var(--rs-color-on-background-critical)}.--bg-primary{background-color:var(--rs-color-background-primary);color:var(--rs-color-on-background-primary)}.--bg-neutral-faded{background-color:var(--rs-color-background-neutral-faded);color:var(--rs-color-foreground-neutral)}.--bg-positive-faded{background-color:var(--rs-color-background-positive-faded);color:var(--rs-color-foreground-neutral)}.--bg-critical-faded{background-color:var(--rs-color-background-critical-faded);color:var(--rs-color-foreground-neutral)}.--bg-primary-faded{background-color:var(--rs-color-background-primary-faded)}.--bg-page,.--bg-primary-faded{color:var(--rs-color-foreground-neutral)}.--bg-page{background-color:var(--rs-color-background-page)}.--bg-page-faded{background-color:var(--rs-color-background-page-faded)}.--bg-disabled,.--bg-page-faded{color:var(--rs-color-foreground-neutral)}.--bg-disabled{background-color:var(--rs-color-background-disabled)}.--bg-disabled-faded{background-color:var(--rs-color-background-disabled-faded);color:var(--rs-color-foreground-neutral)}.--bg-elevation-base{background-color:var(--rs-color-background-elevation-base);color:var(--rs-color-foreground-neutral)}.--bg-elevation-raised{background-color:var(--rs-color-background-elevation-raised);color:var(--rs-color-foreground-neutral)}.--bg-elevation-overlay{background-color:var(--rs-color-background-elevation-overlay);color:var(--rs-color-foreground-neutral)}.--bg-white{background-color:var(--rs-color-white);color:var(--rs-color-black)}.--bg-black{background-color:var(--rs-color-black);color:var(--rs-color-white)}.--shadow-raised{box-shadow:var(--rs-shadow-raised)}.--shadow-overlay{box-shadow:var(--rs-shadow-overlay)}.--bd{border:1px solid var(--rs-view-border-color)}.--bd-neutral-faded{--rs-view-border-color:var(--rs-color-border-neutral-faded)}.--bd-neutral{--rs-view-border-color:var(--rs-color-border-neutral)}.--bd-positive{--rs-view-border-color:var(--rs-color-border-positive)}.--bd-positive-faded{--rs-view-border-color:var(--rs-color-border-positive-faded)}.--bd-critical{--rs-view-border-color:var(--rs-color-border-critical)}.--bd-critical-faded{--rs-view-border-color:var(--rs-color-border-critical-faded)}.--bd-primary{--rs-view-border-color:var(--rs-color-border-primary)}.--bd-primary-faded{--rs-view-border-color:var(--rs-color-border-primary-faded)}.--bd-transparent{--rs-view-border-color:transparent}.--overflow-hidden{overflow:hidden}.--divided{--rs-view-gaps-count-multiplier:2}.--flex{display:flex;flex-direction:column;justify-content:flex-start}.--direction-column{flex-direction:column;flex-wrap:nowrap}.--direction-column>.item--gap-before{margin-top:var(--rs-view-item-gap)}.--direction-column>.item--gap-auto{margin-top:auto}.--direction-column-reverse{flex-direction:column-reverse;flex-wrap:nowrap}.--direction-column-reverse>.item--gap-before{margin-top:var(--rs-view-item-gap)}.--direction-column-reverse>.item--gap-auto{margin-top:auto}.--direction-row{align-items:flex-start;flex-direction:row;flex-wrap:wrap}.--direction-row>.item--gap-before{margin-inline-start:var(--rs-view-item-gap)}.--direction-row>.item--gap-auto{margin-inline-start:auto}.--direction-row>button{width:auto!important}.--direction-row-reverse{align-items:flex-start;flex-direction:row-reverse;flex-wrap:wrap}.--direction-row-reverse>.item--gap-before{margin-inline-start:var(--rs-view-item-gap)}.--direction-row-reverse>.item--gap-auto{margin-inline-start:auto}.--direction-row-reverse>button{width:auto!important}.--nowrap{flex-wrap:nowrap}.--nowrap>*{flex-shrink:0}.--wrap{flex-wrap:wrap}@media (min-width:660px){.--nowrap-false--m,.--wrap-true--m{flex-wrap:wrap}.--nowrap-true--m,.--wrap-false--m{flex-wrap:nowrap}}@media (min-width:900px){.--nowrap-false--l,.--wrap-true--l{flex-wrap:wrap}.--nowrap-true--l,.--wrap-false--l{flex-wrap:nowrap}}@media (min-width:1280px){.--nowrap-false--xl,.--wrap-true--xl{flex-wrap:wrap}.--nowrap-true--xl,.--wrap-false--xl{flex-wrap:nowrap}}.--align-start{align-items:flex-start!important}.--align-end{align-items:flex-end!important}.--align-center{align-items:center!important}.--align-stretch{align-items:stretch!important}.--align-baseline{align-items:baseline!important}.--justify-start{justify-content:flex-start}.--justify-end{justify-content:flex-end}.--justify-center{justify-content:center}.divider{align-self:stretch}.item--grow{flex-basis:0;flex-grow:1;flex-shrink:1;min-width:0}.item--columns-1{--rs-view-columns-count:calc(12 / 1);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-1,.item--columns-2{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-2{--rs-view-columns-count:calc(12 / 2);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-3{--rs-view-columns-count:calc(12 / 3);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-3,.item--columns-4{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-4{--rs-view-columns-count:calc(12 / 4);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-5{--rs-view-columns-count:calc(12 / 5);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-5,.item--columns-6{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-6{--rs-view-columns-count:calc(12 / 6);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-7{--rs-view-columns-count:calc(12 / 7);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-7,.item--columns-8{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-8{--rs-view-columns-count:calc(12 / 8);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-9{--rs-view-columns-count:calc(12 / 9);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-10,.item--columns-9{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-10{--rs-view-columns-count:calc(12 / 10);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-11{--rs-view-columns-count:calc(12 / 11);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-11,.item--columns-12{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-12{--rs-view-columns-count:calc(12 / 12);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-auto{width:auto}@media (min-width:660px){.item--columns-1--m{--rs-view-columns-count:calc(12 / 1);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-1--m,.item--columns-2--m{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-2--m{--rs-view-columns-count:calc(12 / 2);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-3--m{--rs-view-columns-count:calc(12 / 3);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-3--m,.item--columns-4--m{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-4--m{--rs-view-columns-count:calc(12 / 4);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-5--m{--rs-view-columns-count:calc(12 / 5);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-5--m,.item--columns-6--m{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-6--m{--rs-view-columns-count:calc(12 / 6);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-7--m{--rs-view-columns-count:calc(12 / 7);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-7--m,.item--columns-8--m{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-8--m{--rs-view-columns-count:calc(12 / 8);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-9--m{--rs-view-columns-count:calc(12 / 9);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-10--m,.item--columns-9--m{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-10--m{--rs-view-columns-count:calc(12 / 10);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-11--m{--rs-view-columns-count:calc(12 / 11);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-11--m,.item--columns-12--m{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-12--m{--rs-view-columns-count:calc(12 / 12);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-auto--m{width:auto}}@media (min-width:900px){.item--columns-1--l{--rs-view-columns-count:calc(12 / 1);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-1--l,.item--columns-2--l{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-2--l{--rs-view-columns-count:calc(12 / 2);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-3--l{--rs-view-columns-count:calc(12 / 3);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-3--l,.item--columns-4--l{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-4--l{--rs-view-columns-count:calc(12 / 4);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-5--l{--rs-view-columns-count:calc(12 / 5);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-5--l,.item--columns-6--l{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-6--l{--rs-view-columns-count:calc(12 / 6);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-7--l{--rs-view-columns-count:calc(12 / 7);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-7--l,.item--columns-8--l{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-8--l{--rs-view-columns-count:calc(12 / 8);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-9--l{--rs-view-columns-count:calc(12 / 9);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-10--l,.item--columns-9--l{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-10--l{--rs-view-columns-count:calc(12 / 10);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-11--l{--rs-view-columns-count:calc(12 / 11);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-11--l,.item--columns-12--l{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-12--l{--rs-view-columns-count:calc(12 / 12);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-auto--l{width:auto}}@media (min-width:1280px){.item--columns-1--xl{--rs-view-columns-count:calc(12 / 1);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-1--xl,.item--columns-2--xl{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-2--xl{--rs-view-columns-count:calc(12 / 2);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-3--xl{--rs-view-columns-count:calc(12 / 3);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-3--xl,.item--columns-4--xl{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-4--xl{--rs-view-columns-count:calc(12 / 4);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-5--xl{--rs-view-columns-count:calc(12 / 5);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-5--xl,.item--columns-6--xl{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-6--xl{--rs-view-columns-count:calc(12 / 6);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-7--xl{--rs-view-columns-count:calc(12 / 7);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-7--xl,.item--columns-8--xl{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-8--xl{--rs-view-columns-count:calc(12 / 8);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-9--xl{--rs-view-columns-count:calc(12 / 9);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-10--xl,.item--columns-9--xl{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-10--xl{--rs-view-columns-count:calc(12 / 10);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-11--xl{--rs-view-columns-count:calc(12 / 11);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-11--xl,.item--columns-12--xl{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-12--xl{--rs-view-columns-count:calc(12 / 12);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-auto--xl{width:auto}}.--padding{--rs-view-p-vertical-s:0;--rs-view-p-vertical-m:var(--rs-view-p-vertical-s);--rs-view-p-vertical-l:var(--rs-view-p-vertical-m);--rs-view-p-vertical-xl:var(--rs-view-p-vertical-l);--rs-view-p-vertical:var(--rs-view-p-vertical-s);--rs-view-p-horizontal-s:0;--rs-view-p-horizontal-m:var(--rs-view-p-horizontal-s);--rs-view-p-horizontal-l:var(--rs-view-p-horizontal-m);--rs-view-p-horizontal-xl:var(--rs-view-p-horizontal-l);--rs-view-p-horizontal:var(--rs-view-p-horizontal-s)}.--padding-top{--rs-view-p-top-s:0;--rs-view-p-top-m:var(--rs-view-p-top-s);--rs-view-p-top-l:var(--rs-view-p-top-m);--rs-view-p-top-xl:var(--rs-view-p-top-l);--rs-view-p-top:var(--rs-view-p-top-s)}.--padding-bottom{--rs-view-p-bottom-s:0;--rs-view-p-bottom-m:var(--rs-view-p-bottom-s);--rs-view-p-bottom-l:var(--rs-view-p-bottom-m);--rs-view-p-bottom-xl:var(--rs-view-p-bottom-l);--rs-view-p-bottom:var(--rs-view-p-bottom-s)}.--padding-start{--rs-view-p-start-s:0;--rs-view-p-start-m:var(--rs-view-p-start-s);--rs-view-p-start-l:var(--rs-view-p-start-m);--rs-view-p-start-xl:var(--rs-view-p-start-l);--rs-view-p-start:var(--rs-view-p-start-s)}.--padding-end{--rs-view-p-end-s:0;--rs-view-p-end-m:var(--rs-view-p-end-s);--rs-view-p-end-l:var(--rs-view-p-end-m);--rs-view-p-end-xl:var(--rs-view-p-end-l);--rs-view-p-end:var(--rs-view-p-end-s)}.root{--rs-view-gap-s:0;--rs-view-gap-m:var(--rs-view-gap-s);--rs-view-gap-l:var(--rs-view-gap-m);--rs-view-gap-xl:var(--rs-view-gap-l);--rs-view-gap:var(--rs-view-gap-s)}.root>.item{--rs-view-item-order-s:0;--rs-view-item-order-m:var(--rs-view-item-order-s);--rs-view-item-order-l:var(--rs-view-item-order-m);--rs-view-item-order-xl:var(--rs-view-item-order-l);--rs-view-item-order:var(--rs-view-item-order-s);--rs-view-item-gap-before-s:initial;--rs-view-item-gap-before-m:var(--rs-view-item-gap-before-s);--rs-view-item-gap-before-l:var(--rs-view-item-gap-before-m);--rs-view-item-gap-before-xl:var(--rs-view-item-gap-before-l);--rs-view-item-gap-before:var(--rs-view-item-gap-before-s)}@media (min-width:660px){.--direction-column--m{flex-direction:column;flex-wrap:nowrap}.--direction-column--m>.item--gap-before{margin-top:var(--rs-view-item-gap)}.--direction-column--m>.item--gap-auto{margin-top:auto}.--direction-column-reverse--m{flex-direction:column-reverse;flex-wrap:nowrap}.--direction-column-reverse--m>.item--gap-before{margin-top:var(--rs-view-item-gap)}.--direction-column-reverse--m>.item--gap-auto{margin-top:auto}.--direction-row--m{align-items:flex-start;flex-direction:row;flex-wrap:wrap}.--direction-row--m>.item--gap-before{margin-inline-start:var(--rs-view-item-gap)}.--direction-row--m>.item--gap-auto{margin-inline-start:auto}.--direction-row--m>button{width:auto!important}.--direction-row-reverse--m{align-items:flex-start;flex-direction:row-reverse;flex-wrap:wrap}.--direction-row-reverse--m>.item--gap-before{margin-inline-start:var(--rs-view-item-gap)}.--direction-row-reverse--m>.item--gap-auto{margin-inline-start:auto}.--direction-row-reverse--m>button{width:auto!important}.--align-start--m{align-items:flex-start!important}.--align-end--m{align-items:flex-end!important}.--align-center--m{align-items:center!important}.--align-stretch--m{align-items:stretch!important}.--align-baseline--m{align-items:baseline!important}.--justify-start--m{justify-content:flex-start}.--justify-end--m{justify-content:flex-end}.--justify-center--m{justify-content:center}.item--grow-true--m{flex-basis:0;flex-grow:1;flex-shrink:1;min-width:0}.item--grow-false--m{flex-basis:auto;flex-grow:0;flex-shrink:0;min-width:auto}.--padding{--rs-view-p-vertical:var(--rs-view-p-vertical-m);--rs-view-p-horizontal:var(--rs-view-p-horizontal-m)}.--padding-top{--rs-view-p-top:var(--rs-view-p-top-m)}.--padding-bottom{--rs-view-p-bottom:var(--rs-view-p-bottom-m)}.--padding-start{--rs-view-p-start:var(--rs-view-p-start-m)}.--padding-end{--rs-view-p-end:var(--rs-view-p-end-m)}.root{--rs-view-gap:var(--rs-view-gap-m)}.root>.item{--rs-view-item-order:var(--rs-view-item-order-m);--rs-view-item-gap-before:var(--rs-view-item-gap-before-m)}}@media (min-width:900px){.--direction-column--l{flex-direction:column;flex-wrap:nowrap}.--direction-column--l>.item--gap-before{margin-top:var(--rs-view-item-gap)}.--direction-column--l>.item--gap-auto{margin-top:auto}.--direction-column-reverse--l{flex-direction:column-reverse;flex-wrap:nowrap}.--direction-column-reverse--l>.item--gap-before{margin-top:var(--rs-view-item-gap)}.--direction-column-reverse--l>.item--gap-auto{margin-top:auto}.--direction-row--l{align-items:flex-start;flex-direction:row;flex-wrap:wrap}.--direction-row--l>.item--gap-before{margin-inline-start:var(--rs-view-item-gap)}.--direction-row--l>.item--gap-auto{margin-inline-start:auto}.--direction-row--l>button{width:auto!important}.--direction-row-reverse--l{align-items:flex-start;flex-direction:row-reverse;flex-wrap:wrap}.--direction-row-reverse--l>.item--gap-before{margin-inline-start:var(--rs-view-item-gap)}.--direction-row-reverse--l>.item--gap-auto{margin-inline-start:auto}.--direction-row-reverse--l>button{width:auto!important}.--align-start--l{align-items:flex-start!important}.--align-end--l{align-items:flex-end!important}.--align-center--l{align-items:center!important}.--align-stretch--l{align-items:stretch!important}.--align-baseline--l{align-items:baseline!important}.--justify-start--l{justify-content:flex-start}.--justify-end--l{justify-content:flex-end}.--justify-center--l{justify-content:center}.item--grow-true--l{flex-basis:0;flex-grow:1;flex-shrink:1;min-width:0}.item--grow-false--l{flex-basis:auto;flex-grow:0;flex-shrink:0;min-width:auto}.--padding{--rs-view-p-vertical:var(--rs-view-p-vertical-l);--rs-view-p-horizontal:var(--rs-view-p-horizontal-l)}.--padding-top{--rs-view-p-top:var(--rs-view-p-top-l)}.--padding-bottom{--rs-view-p-bottom:var(--rs-view-p-bottom-l)}.--padding-start{--rs-view-p-start:var(--rs-view-p-start-l)}.--padding-end{--rs-view-p-end:var(--rs-view-p-end-l)}.root{--rs-view-gap:var(--rs-view-gap-l)}.root>.item{--rs-view-item-order:var(--rs-view-item-order-l);--rs-view-item-gap-before:var(--rs-view-item-gap-before-l)}}@media (min-width:1280px){.--direction-column--xl{flex-direction:column;flex-wrap:nowrap}.--direction-column--xl>.item--gap-before{margin-top:var(--rs-view-item-gap)}.--direction-column--xl>.item--gap-auto{margin-top:auto}.--direction-column-reverse--xl{flex-direction:column-reverse;flex-wrap:nowrap}.--direction-column-reverse--xl>.item--gap-before{margin-top:var(--rs-view-item-gap)}.--direction-column-reverse--xl>.item--gap-auto{margin-top:auto}.--direction-row--xl{align-items:flex-start;flex-direction:row;flex-wrap:wrap}.--direction-row--xl>.item--gap-before{margin-inline-start:var(--rs-view-item-gap)}.--direction-row--xl>.item--gap-auto{margin-inline-start:auto}.--direction-row--xl>button{width:auto!important}.--direction-row-reverse--xl{align-items:flex-start;flex-direction:row-reverse;flex-wrap:wrap}.--direction-row-reverse--xl>.item--gap-before{margin-inline-start:var(--rs-view-item-gap)}.--direction-row-reverse--xl>.item--gap-auto{margin-inline-start:auto}.--direction-row-reverse--xl>button{width:auto!important}.--align-start--xl{align-items:flex-start!important}.--align-end--xl{align-items:flex-end!important}.--align-center--xl{align-items:center!important}.--align-stretch--xl{align-items:stretch!important}.--align-baseline--xl{align-items:baseline!important}.--justify-start--xl{justify-content:flex-start}.--justify-end--xl{justify-content:flex-end}.--justify-center--xl{justify-content:center}.item--grow-true--xl{flex-basis:0;flex-grow:1;flex-shrink:1;min-width:0}.item--grow-false--xl{flex-basis:auto;flex-grow:0;flex-shrink:0;min-width:auto}.--padding{--rs-view-p-vertical:var(--rs-view-p-vertical-xl);--rs-view-p-horizontal:var(--rs-view-p-horizontal-xl)}.--padding-top{--rs-view-p-top:var(--rs-view-p-top-xl)}.--padding-bottom{--rs-view-p-bottom:var(--rs-view-p-bottom-xl)}.--padding-start{--rs-view-p-start:var(--rs-view-p-start-xl)}.--padding-end{--rs-view-p-end:var(--rs-view-p-end-xl)}.root{--rs-view-gap:var(--rs-view-gap-xl)}.root>.item{--rs-view-item-order:var(--rs-view-item-order-xl);--rs-view-item-gap-before:var(--rs-view-item-gap-before-xl)}}
|
|
1
|
+
.root{--rs-view-gaps-count-multiplier:1;--rs-view-z:auto;--rs-view-gap-value:calc(var(--rs-view-gap) * var(--rs-unit-x1));gap:var(--rs-view-gap-value);z-index:var(--rs-view-z)}.item{--rs-view-item-gap:calc(var(--rs-unit-x1) * var(--rs-view-item-gap-before) - var(--rs-view-gap-value));order:var(--rs-view-item-order)}.--padding{padding:calc(var(--rs-unit-x1) * var(--rs-view-p-vertical, var(--rs-view-p-top))) calc(var(--rs-unit-x1) * var(--rs-view-p-horizontal, var(--rs-view-p-start)))}.--padding-top{padding-top:calc(var(--rs-unit-x1) * var(--rs-view-p-top))}.--padding-bottom{padding-bottom:calc(var(--rs-unit-x1) * var(--rs-view-p-bottom))}.--padding-start{padding-inline-start:calc(var(--rs-unit-x1) * var(--rs-view-p-start))}.--padding-end{padding-inline-end:calc(var(--rs-unit-x1) * var(--rs-view-p-end))}.--animated{transition:var(--rs-duration-medium) var(--rs-easing-standard);transition-property:background-color,color,border-color}.--align-text-start{text-align:start}.--align-text-center{text-align:center}.--align-text-end{text-align:end}.--bg-neutral{background-color:var(--rs-color-background-neutral);color:var(--rs-color-on-background-neutral)}.--bg-positive{background-color:var(--rs-color-background-positive);color:var(--rs-color-on-background-positive)}.--bg-critical{background-color:var(--rs-color-background-critical);color:var(--rs-color-on-background-critical)}.--bg-primary{background-color:var(--rs-color-background-primary);color:var(--rs-color-on-background-primary)}.--bg-neutral-faded{background-color:var(--rs-color-background-neutral-faded);color:var(--rs-color-foreground-neutral)}.--bg-positive-faded{background-color:var(--rs-color-background-positive-faded);color:var(--rs-color-foreground-neutral)}.--bg-critical-faded{background-color:var(--rs-color-background-critical-faded);color:var(--rs-color-foreground-neutral)}.--bg-primary-faded{background-color:var(--rs-color-background-primary-faded)}.--bg-page,.--bg-primary-faded{color:var(--rs-color-foreground-neutral)}.--bg-page{background-color:var(--rs-color-background-page)}.--bg-page-faded{background-color:var(--rs-color-background-page-faded)}.--bg-disabled,.--bg-page-faded{color:var(--rs-color-foreground-neutral)}.--bg-disabled{background-color:var(--rs-color-background-disabled)}.--bg-disabled-faded{background-color:var(--rs-color-background-disabled-faded);color:var(--rs-color-foreground-neutral)}.--bg-elevation-base{background-color:var(--rs-color-background-elevation-base);color:var(--rs-color-foreground-neutral)}.--bg-elevation-raised{background-color:var(--rs-color-background-elevation-raised);color:var(--rs-color-foreground-neutral)}.--bg-elevation-overlay{background-color:var(--rs-color-background-elevation-overlay);color:var(--rs-color-foreground-neutral)}.--bg-white{background-color:var(--rs-color-white);color:var(--rs-color-black)}.--bg-black{background-color:var(--rs-color-black);color:var(--rs-color-white)}.--shadow-raised{box-shadow:var(--rs-shadow-raised)}.--shadow-overlay{box-shadow:var(--rs-shadow-overlay)}.--bd{border:1px solid var(--rs-view-border-color)}.--bd-neutral-faded{--rs-view-border-color:var(--rs-color-border-neutral-faded)}.--bd-neutral{--rs-view-border-color:var(--rs-color-border-neutral)}.--bd-positive{--rs-view-border-color:var(--rs-color-border-positive)}.--bd-positive-faded{--rs-view-border-color:var(--rs-color-border-positive-faded)}.--bd-critical{--rs-view-border-color:var(--rs-color-border-critical)}.--bd-critical-faded{--rs-view-border-color:var(--rs-color-border-critical-faded)}.--bd-primary{--rs-view-border-color:var(--rs-color-border-primary)}.--bd-primary-faded{--rs-view-border-color:var(--rs-color-border-primary-faded)}.--bd-disabled{--rs-view-border-color:var(--rs-color-border-disabled)}.--bd-transparent{--rs-view-border-color:transparent}.--overflow-hidden{overflow:hidden}.--divided{--rs-view-gaps-count-multiplier:2}.--flex{display:flex;flex-direction:column;justify-content:flex-start}.--direction-column{flex-direction:column;flex-wrap:nowrap}.--direction-column>.item--gap-before{margin-top:var(--rs-view-item-gap)}.--direction-column>.item--gap-auto{margin-top:auto}.--direction-column-reverse{flex-direction:column-reverse;flex-wrap:nowrap}.--direction-column-reverse>.item--gap-before{margin-top:var(--rs-view-item-gap)}.--direction-column-reverse>.item--gap-auto{margin-top:auto}.--direction-row{align-items:flex-start;flex-direction:row;flex-wrap:wrap}.--direction-row>.item--gap-before{margin-inline-start:var(--rs-view-item-gap)}.--direction-row>.item--gap-auto{margin-inline-start:auto}.--direction-row>button{width:auto!important}.--direction-row-reverse{align-items:flex-start;flex-direction:row-reverse;flex-wrap:wrap}.--direction-row-reverse>.item--gap-before{margin-inline-start:var(--rs-view-item-gap)}.--direction-row-reverse>.item--gap-auto{margin-inline-start:auto}.--direction-row-reverse>button{width:auto!important}.--nowrap{flex-wrap:nowrap}.--nowrap>*{flex-shrink:0}.--wrap{flex-wrap:wrap}@media (min-width:660px){.--nowrap-false--m,.--wrap-true--m{flex-wrap:wrap}.--nowrap-true--m,.--wrap-false--m{flex-wrap:nowrap}}@media (min-width:900px){.--nowrap-false--l,.--wrap-true--l{flex-wrap:wrap}.--nowrap-true--l,.--wrap-false--l{flex-wrap:nowrap}}@media (min-width:1280px){.--nowrap-false--xl,.--wrap-true--xl{flex-wrap:wrap}.--nowrap-true--xl,.--wrap-false--xl{flex-wrap:nowrap}}.--align-start{align-items:flex-start!important}.--align-end{align-items:flex-end!important}.--align-center{align-items:center!important}.--align-stretch{align-items:stretch!important}.--align-baseline{align-items:baseline!important}.--justify-start{justify-content:flex-start}.--justify-end{justify-content:flex-end}.--justify-center{justify-content:center}.--justify-space-between{justify-content:space-between}.divider{align-self:stretch}.item--grow{flex-basis:0;flex-grow:1;flex-shrink:1;min-width:0}.item--columns-1{--rs-view-columns-count:calc(12 / 1);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-1,.item--columns-2{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-2{--rs-view-columns-count:calc(12 / 2);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-3{--rs-view-columns-count:calc(12 / 3);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-3,.item--columns-4{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-4{--rs-view-columns-count:calc(12 / 4);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-5{--rs-view-columns-count:calc(12 / 5);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-5,.item--columns-6{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-6{--rs-view-columns-count:calc(12 / 6);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-7{--rs-view-columns-count:calc(12 / 7);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-7,.item--columns-8{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-8{--rs-view-columns-count:calc(12 / 8);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-9{--rs-view-columns-count:calc(12 / 9);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-10,.item--columns-9{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-10{--rs-view-columns-count:calc(12 / 10);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-11{--rs-view-columns-count:calc(12 / 11);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-11,.item--columns-12{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-12{--rs-view-columns-count:calc(12 / 12);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-auto{width:auto}@media (min-width:660px){.item--columns-1--m{--rs-view-columns-count:calc(12 / 1);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-1--m,.item--columns-2--m{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-2--m{--rs-view-columns-count:calc(12 / 2);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-3--m{--rs-view-columns-count:calc(12 / 3);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-3--m,.item--columns-4--m{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-4--m{--rs-view-columns-count:calc(12 / 4);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-5--m{--rs-view-columns-count:calc(12 / 5);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-5--m,.item--columns-6--m{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-6--m{--rs-view-columns-count:calc(12 / 6);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-7--m{--rs-view-columns-count:calc(12 / 7);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-7--m,.item--columns-8--m{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-8--m{--rs-view-columns-count:calc(12 / 8);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-9--m{--rs-view-columns-count:calc(12 / 9);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-10--m,.item--columns-9--m{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-10--m{--rs-view-columns-count:calc(12 / 10);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-11--m{--rs-view-columns-count:calc(12 / 11);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-11--m,.item--columns-12--m{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-12--m{--rs-view-columns-count:calc(12 / 12);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-auto--m{width:auto}}@media (min-width:900px){.item--columns-1--l{--rs-view-columns-count:calc(12 / 1);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-1--l,.item--columns-2--l{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-2--l{--rs-view-columns-count:calc(12 / 2);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-3--l{--rs-view-columns-count:calc(12 / 3);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-3--l,.item--columns-4--l{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-4--l{--rs-view-columns-count:calc(12 / 4);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-5--l{--rs-view-columns-count:calc(12 / 5);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-5--l,.item--columns-6--l{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-6--l{--rs-view-columns-count:calc(12 / 6);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-7--l{--rs-view-columns-count:calc(12 / 7);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-7--l,.item--columns-8--l{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-8--l{--rs-view-columns-count:calc(12 / 8);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-9--l{--rs-view-columns-count:calc(12 / 9);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-10--l,.item--columns-9--l{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-10--l{--rs-view-columns-count:calc(12 / 10);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-11--l{--rs-view-columns-count:calc(12 / 11);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-11--l,.item--columns-12--l{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-12--l{--rs-view-columns-count:calc(12 / 12);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-auto--l{width:auto}}@media (min-width:1280px){.item--columns-1--xl{--rs-view-columns-count:calc(12 / 1);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-1--xl,.item--columns-2--xl{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-2--xl{--rs-view-columns-count:calc(12 / 2);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-3--xl{--rs-view-columns-count:calc(12 / 3);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-3--xl,.item--columns-4--xl{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-4--xl{--rs-view-columns-count:calc(12 / 4);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-5--xl{--rs-view-columns-count:calc(12 / 5);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-5--xl,.item--columns-6--xl{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-6--xl{--rs-view-columns-count:calc(12 / 6);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-7--xl{--rs-view-columns-count:calc(12 / 7);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-7--xl,.item--columns-8--xl{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-8--xl{--rs-view-columns-count:calc(12 / 8);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-9--xl{--rs-view-columns-count:calc(12 / 9);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-10--xl,.item--columns-9--xl{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-10--xl{--rs-view-columns-count:calc(12 / 10);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-11--xl{--rs-view-columns-count:calc(12 / 11);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-11--xl,.item--columns-12--xl{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-12--xl{--rs-view-columns-count:calc(12 / 12);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-auto--xl{width:auto}}.--padding{--rs-view-p-vertical-s:0;--rs-view-p-vertical-m:var(--rs-view-p-vertical-s);--rs-view-p-vertical-l:var(--rs-view-p-vertical-m);--rs-view-p-vertical-xl:var(--rs-view-p-vertical-l);--rs-view-p-vertical:var(--rs-view-p-vertical-s);--rs-view-p-horizontal-s:0;--rs-view-p-horizontal-m:var(--rs-view-p-horizontal-s);--rs-view-p-horizontal-l:var(--rs-view-p-horizontal-m);--rs-view-p-horizontal-xl:var(--rs-view-p-horizontal-l);--rs-view-p-horizontal:var(--rs-view-p-horizontal-s)}.--padding-top{--rs-view-p-top-s:0;--rs-view-p-top-m:var(--rs-view-p-top-s);--rs-view-p-top-l:var(--rs-view-p-top-m);--rs-view-p-top-xl:var(--rs-view-p-top-l);--rs-view-p-top:var(--rs-view-p-top-s)}.--padding-bottom{--rs-view-p-bottom-s:0;--rs-view-p-bottom-m:var(--rs-view-p-bottom-s);--rs-view-p-bottom-l:var(--rs-view-p-bottom-m);--rs-view-p-bottom-xl:var(--rs-view-p-bottom-l);--rs-view-p-bottom:var(--rs-view-p-bottom-s)}.--padding-start{--rs-view-p-start-s:0;--rs-view-p-start-m:var(--rs-view-p-start-s);--rs-view-p-start-l:var(--rs-view-p-start-m);--rs-view-p-start-xl:var(--rs-view-p-start-l);--rs-view-p-start:var(--rs-view-p-start-s)}.--padding-end{--rs-view-p-end-s:0;--rs-view-p-end-m:var(--rs-view-p-end-s);--rs-view-p-end-l:var(--rs-view-p-end-m);--rs-view-p-end-xl:var(--rs-view-p-end-l);--rs-view-p-end:var(--rs-view-p-end-s)}.root{--rs-view-gap-s:0;--rs-view-gap-m:var(--rs-view-gap-s);--rs-view-gap-l:var(--rs-view-gap-m);--rs-view-gap-xl:var(--rs-view-gap-l);--rs-view-gap:var(--rs-view-gap-s)}.root>.item{--rs-view-item-order-s:0;--rs-view-item-order-m:var(--rs-view-item-order-s);--rs-view-item-order-l:var(--rs-view-item-order-m);--rs-view-item-order-xl:var(--rs-view-item-order-l);--rs-view-item-order:var(--rs-view-item-order-s);--rs-view-item-gap-before-s:initial;--rs-view-item-gap-before-m:var(--rs-view-item-gap-before-s);--rs-view-item-gap-before-l:var(--rs-view-item-gap-before-m);--rs-view-item-gap-before-xl:var(--rs-view-item-gap-before-l);--rs-view-item-gap-before:var(--rs-view-item-gap-before-s)}@media (min-width:660px){.--direction-column--m{flex-direction:column;flex-wrap:nowrap}.--direction-column--m>.item--gap-before{margin-top:var(--rs-view-item-gap)}.--direction-column--m>.item--gap-auto{margin-top:auto}.--direction-column-reverse--m{flex-direction:column-reverse;flex-wrap:nowrap}.--direction-column-reverse--m>.item--gap-before{margin-top:var(--rs-view-item-gap)}.--direction-column-reverse--m>.item--gap-auto{margin-top:auto}.--direction-row--m{align-items:flex-start;flex-direction:row;flex-wrap:wrap}.--direction-row--m>.item--gap-before{margin-inline-start:var(--rs-view-item-gap)}.--direction-row--m>.item--gap-auto{margin-inline-start:auto}.--direction-row--m>button{width:auto!important}.--direction-row-reverse--m{align-items:flex-start;flex-direction:row-reverse;flex-wrap:wrap}.--direction-row-reverse--m>.item--gap-before{margin-inline-start:var(--rs-view-item-gap)}.--direction-row-reverse--m>.item--gap-auto{margin-inline-start:auto}.--direction-row-reverse--m>button{width:auto!important}.--align-start--m{align-items:flex-start!important}.--align-end--m{align-items:flex-end!important}.--align-center--m{align-items:center!important}.--align-stretch--m{align-items:stretch!important}.--align-baseline--m{align-items:baseline!important}.--justify-start--m{justify-content:flex-start}.--justify-end--m{justify-content:flex-end}.--justify-center--m{justify-content:center}.--justify-space-between--m{justify-content:space-between}.item--grow-true--m{flex-basis:0;flex-grow:1;flex-shrink:1;min-width:0}.item--grow-false--m{flex-basis:auto;flex-grow:0;flex-shrink:0;min-width:auto}.--padding{--rs-view-p-vertical:var(--rs-view-p-vertical-m);--rs-view-p-horizontal:var(--rs-view-p-horizontal-m)}.--padding-top{--rs-view-p-top:var(--rs-view-p-top-m)}.--padding-bottom{--rs-view-p-bottom:var(--rs-view-p-bottom-m)}.--padding-start{--rs-view-p-start:var(--rs-view-p-start-m)}.--padding-end{--rs-view-p-end:var(--rs-view-p-end-m)}.root{--rs-view-gap:var(--rs-view-gap-m)}.root>.item{--rs-view-item-order:var(--rs-view-item-order-m);--rs-view-item-gap-before:var(--rs-view-item-gap-before-m)}}@media (min-width:900px){.--direction-column--l{flex-direction:column;flex-wrap:nowrap}.--direction-column--l>.item--gap-before{margin-top:var(--rs-view-item-gap)}.--direction-column--l>.item--gap-auto{margin-top:auto}.--direction-column-reverse--l{flex-direction:column-reverse;flex-wrap:nowrap}.--direction-column-reverse--l>.item--gap-before{margin-top:var(--rs-view-item-gap)}.--direction-column-reverse--l>.item--gap-auto{margin-top:auto}.--direction-row--l{align-items:flex-start;flex-direction:row;flex-wrap:wrap}.--direction-row--l>.item--gap-before{margin-inline-start:var(--rs-view-item-gap)}.--direction-row--l>.item--gap-auto{margin-inline-start:auto}.--direction-row--l>button{width:auto!important}.--direction-row-reverse--l{align-items:flex-start;flex-direction:row-reverse;flex-wrap:wrap}.--direction-row-reverse--l>.item--gap-before{margin-inline-start:var(--rs-view-item-gap)}.--direction-row-reverse--l>.item--gap-auto{margin-inline-start:auto}.--direction-row-reverse--l>button{width:auto!important}.--align-start--l{align-items:flex-start!important}.--align-end--l{align-items:flex-end!important}.--align-center--l{align-items:center!important}.--align-stretch--l{align-items:stretch!important}.--align-baseline--l{align-items:baseline!important}.--justify-start--l{justify-content:flex-start}.--justify-end--l{justify-content:flex-end}.--justify-center--l{justify-content:center}.--justify-space-between--l{justify-content:space-between}.item--grow-true--l{flex-basis:0;flex-grow:1;flex-shrink:1;min-width:0}.item--grow-false--l{flex-basis:auto;flex-grow:0;flex-shrink:0;min-width:auto}.--padding{--rs-view-p-vertical:var(--rs-view-p-vertical-l);--rs-view-p-horizontal:var(--rs-view-p-horizontal-l)}.--padding-top{--rs-view-p-top:var(--rs-view-p-top-l)}.--padding-bottom{--rs-view-p-bottom:var(--rs-view-p-bottom-l)}.--padding-start{--rs-view-p-start:var(--rs-view-p-start-l)}.--padding-end{--rs-view-p-end:var(--rs-view-p-end-l)}.root{--rs-view-gap:var(--rs-view-gap-l)}.root>.item{--rs-view-item-order:var(--rs-view-item-order-l);--rs-view-item-gap-before:var(--rs-view-item-gap-before-l)}}@media (min-width:1280px){.--direction-column--xl{flex-direction:column;flex-wrap:nowrap}.--direction-column--xl>.item--gap-before{margin-top:var(--rs-view-item-gap)}.--direction-column--xl>.item--gap-auto{margin-top:auto}.--direction-column-reverse--xl{flex-direction:column-reverse;flex-wrap:nowrap}.--direction-column-reverse--xl>.item--gap-before{margin-top:var(--rs-view-item-gap)}.--direction-column-reverse--xl>.item--gap-auto{margin-top:auto}.--direction-row--xl{align-items:flex-start;flex-direction:row;flex-wrap:wrap}.--direction-row--xl>.item--gap-before{margin-inline-start:var(--rs-view-item-gap)}.--direction-row--xl>.item--gap-auto{margin-inline-start:auto}.--direction-row--xl>button{width:auto!important}.--direction-row-reverse--xl{align-items:flex-start;flex-direction:row-reverse;flex-wrap:wrap}.--direction-row-reverse--xl>.item--gap-before{margin-inline-start:var(--rs-view-item-gap)}.--direction-row-reverse--xl>.item--gap-auto{margin-inline-start:auto}.--direction-row-reverse--xl>button{width:auto!important}.--align-start--xl{align-items:flex-start!important}.--align-end--xl{align-items:flex-end!important}.--align-center--xl{align-items:center!important}.--align-stretch--xl{align-items:stretch!important}.--align-baseline--xl{align-items:baseline!important}.--justify-start--xl{justify-content:flex-start}.--justify-end--xl{justify-content:flex-end}.--justify-center--xl{justify-content:center}.--justify-space-between--xl{justify-content:space-between}.item--grow-true--xl{flex-basis:0;flex-grow:1;flex-shrink:1;min-width:0}.item--grow-false--xl{flex-basis:auto;flex-grow:0;flex-shrink:0;min-width:auto}.--padding{--rs-view-p-vertical:var(--rs-view-p-vertical-xl);--rs-view-p-horizontal:var(--rs-view-p-horizontal-xl)}.--padding-top{--rs-view-p-top:var(--rs-view-p-top-xl)}.--padding-bottom{--rs-view-p-bottom:var(--rs-view-p-bottom-xl)}.--padding-start{--rs-view-p-start:var(--rs-view-p-start-xl)}.--padding-end{--rs-view-p-end:var(--rs-view-p-end-xl)}.root{--rs-view-gap:var(--rs-view-gap-xl)}.root>.item{--rs-view-item-order:var(--rs-view-item-order-xl);--rs-view-item-gap-before:var(--rs-view-item-gap-before-xl)}}
|
|
@@ -11,7 +11,7 @@ export type Props<TagName extends keyof JSX.IntrinsicElements = "div"> = {
|
|
|
11
11
|
gap?: G.Responsive<number>;
|
|
12
12
|
wrap?: G.Responsive<boolean>;
|
|
13
13
|
align?: G.Responsive<"center" | "start" | "end" | "stretch" | "baseline">;
|
|
14
|
-
justify?: G.Responsive<"center" | "start" | "end">;
|
|
14
|
+
justify?: G.Responsive<"center" | "start" | "end" | "space-between">;
|
|
15
15
|
height?: G.Responsive<string | number>;
|
|
16
16
|
width?: G.Responsive<string | number>;
|
|
17
17
|
aspectRatio?: G.Responsive<number>;
|
|
@@ -27,7 +27,7 @@ export type Props<TagName extends keyof JSX.IntrinsicElements = "div"> = {
|
|
|
27
27
|
bleed?: G.Responsive<number>;
|
|
28
28
|
textAlign?: "center" | "start" | "end";
|
|
29
29
|
backgroundColor?: "neutral" | "neutral-faded" | "critical" | "critical-faded" | "positive" | "positive-faded" | "primary" | "primary-faded" | "elevation-base" | "elevation-raised" | "elevation-overlay" | "page" | "page-faded" | "disabled" | "disabled-faded" | "white" | "black";
|
|
30
|
-
borderColor?: "neutral" | "neutral-faded" | "critical" | "critical-faded" | "positive" | "positive-faded" | "primary" | "primary-faded" | "transparent";
|
|
30
|
+
borderColor?: "neutral" | "neutral-faded" | "critical" | "critical-faded" | "positive" | "positive-faded" | "primary" | "primary-faded" | "disabled" | "transparent";
|
|
31
31
|
borderRadius?: G.Responsive<TStyles.Radius>;
|
|
32
32
|
position?: G.Responsive<TStyles.Position>;
|
|
33
33
|
inset?: G.Responsive<number>;
|
|
@@ -297,6 +297,12 @@ export const justify = () => (<Example>
|
|
|
297
297
|
<Placeholder />
|
|
298
298
|
</View>
|
|
299
299
|
</Example.Item>
|
|
300
|
+
<Example.Item title="justify: space-between, direction: row">
|
|
301
|
+
<View justify="space-between" direction="row" gap={3}>
|
|
302
|
+
<Placeholder />
|
|
303
|
+
<Placeholder />
|
|
304
|
+
</View>
|
|
305
|
+
</Example.Item>
|
|
300
306
|
|
|
301
307
|
<Example.Item title="justify: start, direction: column, height: 200px">
|
|
302
308
|
<View height="200px" justify="start" direction="column" gap={3}>
|
|
@@ -316,6 +322,12 @@ export const justify = () => (<Example>
|
|
|
316
322
|
<Placeholder />
|
|
317
323
|
</View>
|
|
318
324
|
</Example.Item>
|
|
325
|
+
<Example.Item title="justify: space-between, direction: column, height: 200px">
|
|
326
|
+
<View justify="space-between" height="200px" direction="column" gap={3}>
|
|
327
|
+
<Placeholder />
|
|
328
|
+
<Placeholder />
|
|
329
|
+
</View>
|
|
330
|
+
</Example.Item>
|
|
319
331
|
</Example>);
|
|
320
332
|
export const textAlign = () => (<Example>
|
|
321
333
|
<Example.Item title="textAlign: start">
|
package/index.d.ts
CHANGED
|
@@ -77,6 +77,8 @@ export { default as Slider } from "./components/Slider";
|
|
|
77
77
|
export type { SliderProps } from "./components/Slider";
|
|
78
78
|
export { default as Switch } from "./components/Switch";
|
|
79
79
|
export type { SwitchProps } from "./components/Switch";
|
|
80
|
+
export { default as Table } from "./components/Table";
|
|
81
|
+
export type { TableProps } from "./components/Table";
|
|
80
82
|
export { default as Tabs } from "./components/Tabs";
|
|
81
83
|
export type { TabsProps } from "./components/Tabs";
|
|
82
84
|
export { default as Text } from "./components/Text";
|
package/index.js
CHANGED
|
@@ -39,6 +39,7 @@ export { default as Select } from "./components/Select/index.js";
|
|
|
39
39
|
export { default as Skeleton } from "./components/Skeleton/index.js";
|
|
40
40
|
export { default as Slider } from "./components/Slider/index.js";
|
|
41
41
|
export { default as Switch } from "./components/Switch/index.js";
|
|
42
|
+
export { default as Table } from "./components/Table/index.js";
|
|
42
43
|
export { default as Tabs } from "./components/Tabs/index.js";
|
|
43
44
|
export { default as Text } from "./components/Text/index.js";
|
|
44
45
|
export { default as TextArea } from "./components/TextArea/index.js";
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "reshaped",
|
|
3
3
|
"description": "Professionally crafted design system in React & Figma for building products of any scale and complexity",
|
|
4
|
-
"version": "2.
|
|
4
|
+
"version": "2.4.0",
|
|
5
5
|
"license": "SEE LICENSE IN LICENSE.md",
|
|
6
6
|
"email": "hello@reshaped.so",
|
|
7
7
|
"homepage": "https://reshaped.so",
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { responsiveClassNames, responsiveVariables } from "../../utilities/helpers.js";
|
|
2
|
+
import s from "./minWidth.module.css";
|
|
3
|
+
const getMinWidthStyles = (value) => {
|
|
4
|
+
if (!value)
|
|
5
|
+
return null;
|
|
6
|
+
const variables = responsiveVariables("--rs-min-w", value);
|
|
7
|
+
const classNames = responsiveClassNames(s, (value) => (typeof value === "number" ? "unit" : "literal"), value, { excludeValueFromClassName: true });
|
|
8
|
+
return { classNames, variables };
|
|
9
|
+
};
|
|
10
|
+
export default getMinWidthStyles;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.literal{min-width:var(--rs-min-w-s,auto)}.unit{min-width:calc(var(--rs-min-w-s) * var(--rs-unit-x1))}@media (min-width:660px){.literal--m{min-width:var(--rs-min-w-m)}.unit--m{min-width:calc(var(--rs-min-w-m) * var(--rs-unit-x1))}}@media (min-width:900px){.literal--l{min-width:var(--rs-min-w-l)}.unit--l{min-width:calc(var(--rs-min-w-l) * var(--rs-unit-x1))}}@media (min-width:1280px){.literal--xl{min-width:var(--rs-min-w-xl)}.unit--xl{min-width:calc(var(--rs-min-w-xl) * var(--rs-unit-x1))}}
|
|
@@ -33,7 +33,7 @@ const variablesTemplate = (themeName, tokens) => {
|
|
|
33
33
|
let code = "";
|
|
34
34
|
Object.entries(filteredTokens).forEach(([type, tokens]) => {
|
|
35
35
|
const selector = type === "root"
|
|
36
|
-
? `[data-rs-theme="${themeName}"]
|
|
36
|
+
? `[data-rs-theme="${themeName}"]`
|
|
37
37
|
: `[data-rs-theme="${themeName}"][data-rs-color-mode="${type}"]`;
|
|
38
38
|
if (!tokens.length)
|
|
39
39
|
return;
|
package/themes/figma/theme.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
[data-rs-theme=figma]
|
|
1
|
+
[data-rs-theme=figma]{--rs-font-family-title:Inter,BlinkMacSystemFont,-apple-system,Roboto,Helvetica,Arial,sans-serif;--rs-font-family-body:Inter,BlinkMacSystemFont,-apple-system,Roboto,Helvetica,Arial,sans-serif;--rs-font-weight-regular:400;--rs-font-weight-medium:500;--rs-font-weight-semibold:600;--rs-font-weight-bold:700;--rs-font-weight-heavy:800;--rs-font-weight-black:900;--rs-font-size-title-1:80px;--rs-line-height-title-1:84px;--rs-font-family-title-1:var(--rs-font-family-title);--rs-font-weight-title-1:var(--rs-font-weight-semibold);--rs-font-size-title-2:64px;--rs-line-height-title-2:68px;--rs-font-family-title-2:var(--rs-font-family-title);--rs-font-weight-title-2:var(--rs-font-weight-semibold);--rs-font-size-title-3:56px;--rs-line-height-title-3:60px;--rs-font-family-title-3:var(--rs-font-family-title);--rs-font-weight-title-3:var(--rs-font-weight-semibold);--rs-font-size-title-4:40px;--rs-line-height-title-4:44px;--rs-font-family-title-4:var(--rs-font-family-title);--rs-font-weight-title-4:var(--rs-font-weight-semibold);--rs-font-size-title-5:36px;--rs-line-height-title-5:40px;--rs-font-family-title-5:var(--rs-font-family-title);--rs-font-weight-title-5:var(--rs-font-weight-semibold);--rs-font-size-title-6:24px;--rs-line-height-title-6:28px;--rs-font-family-title-6:var(--rs-font-family-title);--rs-font-weight-title-6:var(--rs-font-weight-semibold);--rs-font-size-featured-1:22px;--rs-line-height-featured-1:28px;--rs-font-family-featured-1:var(--rs-font-family-body);--rs-font-size-featured-2:20px;--rs-line-height-featured-2:28px;--rs-font-family-featured-2:var(--rs-font-family-body);--rs-font-size-featured-3:18px;--rs-line-height-featured-3:24px;--rs-font-family-featured-3:var(--rs-font-family-body);--rs-font-size-body-1:14px;--rs-line-height-body-1:20px;--rs-font-family-body-1:var(--rs-font-family-body);--rs-font-size-body-2:13px;--rs-line-height-body-2:20px;--rs-font-family-body-2:var(--rs-font-family-body);--rs-font-size-body-3:11px;--rs-line-height-body-3:16px;--rs-font-family-body-3:var(--rs-font-family-body);--rs-font-size-caption-1:11px;--rs-line-height-caption-1:16px;--rs-font-family-caption-1:var(--rs-font-family-body);--rs-font-size-caption-2:10px;--rs-line-height-caption-2:12px;--rs-font-family-caption-2:var(--rs-font-family-body);--rs-unit-base:4px;--rs-unit-radius-small:4px;--rs-unit-radius-medium:4px;--rs-unit-radius-large:4px;--rs-unit-x1:4px;--rs-unit-x2:8px;--rs-unit-x3:12px;--rs-unit-x4:16px;--rs-unit-x5:20px;--rs-unit-x6:24px;--rs-unit-x7:28px;--rs-unit-x8:32px;--rs-unit-x9:36px;--rs-unit-x10:40px;--rs-color-black:#000;--rs-color-white:#fff;--rs-color-on-background-primary:#fff;--rs-color-on-background-positive:#fff;--rs-color-on-background-critical:#fff;--rs-color-rgb-black:0,0,0;--rs-color-rgb-white:255,255,255;--rs-duration-fast:200ms;--rs-duration-medium:300ms;--rs-duration-slow:400ms;--rs-easing-standard:cubic-bezier(0.4,0,0.2,1);--rs-easing-accelerate:cubic-bezier(0.4,0,1,1);--rs-easing-decelerate:cubic-bezier(0,0,0.2,1);--rs-shadow-raised:0px 1px 3px rgba(0,0,0,.15);--rs-shadow-overlay:0px 10px 24px rgba(0,0,0,.1),0px 2px 5px rgba(0,0,0,.04)}[data-rs-theme=figma][data-rs-color-mode=light]{--rs-color-foreground-neutral:#191919;--rs-color-foreground-neutral-faded:#474747;--rs-color-foreground-disabled:#b2b2b2;--rs-color-foreground-primary:#007be5;--rs-color-foreground-positive:#009951;--rs-color-foreground-critical:#dc3412;--rs-color-background-neutral:#dfe2ea;--rs-color-background-neutral-faded:#f5f5f5;--rs-color-background-neutral-highlighted:#d4d8e3;--rs-color-background-disabled:#e4e4e4;--rs-color-background-disabled-faded:#f5f5f5;--rs-color-background-primary:#0d99ff;--rs-color-background-primary-highlighted:#007be5;--rs-color-background-primary-faded:#e5f4ff;--rs-color-background-positive:#14ae5c;--rs-color-background-positive-faded:#daecdf;--rs-color-background-positive-highlighted:#009951;--rs-color-background-critical:#f24822;--rs-color-background-critical-faded:#ffe2e0;--rs-color-background-critical-highlighted:#dc3412;--rs-color-border-neutral:#e6e6e6;--rs-color-border-neutral-faded:#e6e6e6;--rs-color-border-disabled:#e6e6e6;--rs-color-border-primary:#007be5;--rs-color-border-primary-faded:#bde3ff;--rs-color-border-positive:#009951;--rs-color-border-positive-faded:#bbddc6;--rs-color-border-critical:#dc3412;--rs-color-border-critical-faded:#ffc7c2;--rs-color-background-page:#fff;--rs-color-background-page-faded:#fafafa;--rs-color-background-elevation-base:#fff;--rs-color-background-elevation-raised:#fff;--rs-color-background-elevation-overlay:#fff;--rs-color-on-background-neutral:#000;--rs-color-rgb-background-neutral:223,226,234;--rs-color-rgb-background-neutral-faded:245,245,245;--rs-color-rgb-background-neutral-highlighted:212,216,227;--rs-color-rgb-background-disabled:228,228,228;--rs-color-rgb-background-disabled-faded:245,245,245;--rs-color-rgb-background-primary:13,153,255;--rs-color-rgb-background-primary-highlighted:0,123,229;--rs-color-rgb-background-primary-faded:229,244,255;--rs-color-rgb-background-positive:20,174,92;--rs-color-rgb-background-positive-faded:218,236,223;--rs-color-rgb-background-positive-highlighted:0,153,81;--rs-color-rgb-background-critical:242,72,34;--rs-color-rgb-background-critical-faded:255,226,224;--rs-color-rgb-background-critical-highlighted:220,52,18;--rs-color-rgb-background-page:255,255,255;--rs-color-rgb-background-page-faded:250,250,250;--rs-color-rgb-background-elevation-base:255,255,255;--rs-color-rgb-background-elevation-raised:255,255,255;--rs-color-rgb-background-elevation-overlay:255,255,255}[data-rs-theme=figma][data-rs-color-mode=dark]{--rs-color-foreground-neutral:#fff;--rs-color-foreground-neutral-faded:#b2b2b2;--rs-color-foreground-disabled:#656565;--rs-color-foreground-primary:#7cc4f8;--rs-color-foreground-positive:#79d297;--rs-color-foreground-critical:#fca397;--rs-color-background-neutral:#444;--rs-color-background-neutral-faded:#383838;--rs-color-background-neutral-highlighted:#525252;--rs-color-background-disabled:#474747;--rs-color-background-disabled-faded:#3a3a3a;--rs-color-background-primary:#0c8ce9;--rs-color-background-primary-highlighted:#0a6dc2;--rs-color-background-primary-faded:#394360;--rs-color-background-positive:#198f51;--rs-color-background-positive-faded:#3d5749;--rs-color-background-positive-highlighted:#078348;--rs-color-background-critical:#e03e1a;--rs-color-background-critical-faded:#60332a;--rs-color-background-critical-highlighted:#c4381c;--rs-color-border-neutral:#444;--rs-color-border-neutral-faded:#444;--rs-color-border-disabled:#3e3e3e;--rs-color-border-primary:#7cc4f8;--rs-color-border-primary-faded:#2a4d72;--rs-color-border-positive:#79d297;--rs-color-border-positive-faded:#086338;--rs-color-border-critical:#fca397;--rs-color-border-critical-faded:#803226;--rs-color-background-page:#2c2c2c;--rs-color-background-page-faded:#1e1e1e;--rs-color-background-elevation-base:#2c2c2c;--rs-color-background-elevation-raised:#2c2c2c;--rs-color-background-elevation-overlay:#2c2c2c;--rs-color-on-background-neutral:#fff;--rs-color-rgb-background-neutral:68,68,68;--rs-color-rgb-background-neutral-faded:56,56,56;--rs-color-rgb-background-neutral-highlighted:82,82,82;--rs-color-rgb-background-disabled:71,71,71;--rs-color-rgb-background-disabled-faded:58,58,58;--rs-color-rgb-background-primary:12,140,233;--rs-color-rgb-background-primary-highlighted:10,109,194;--rs-color-rgb-background-primary-faded:57,67,96;--rs-color-rgb-background-positive:25,143,81;--rs-color-rgb-background-positive-faded:61,87,73;--rs-color-rgb-background-positive-highlighted:7,131,72;--rs-color-rgb-background-critical:224,62,26;--rs-color-rgb-background-critical-faded:96,51,42;--rs-color-rgb-background-critical-highlighted:196,56,28;--rs-color-rgb-background-page:44,44,44;--rs-color-rgb-background-page-faded:30,30,30;--rs-color-rgb-background-elevation-base:44,44,44;--rs-color-rgb-background-elevation-raised:44,44,44;--rs-color-rgb-background-elevation-overlay:44,44,44}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
[data-rs-theme=twitter]
|
|
1
|
+
[data-rs-theme=twitter]{--rs-color-background-primary:#1da1f2;--rs-color-background-primary-highlighted:#1a90da;--rs-color-on-background-primary:#fff;--rs-color-rgb-background-primary:29,161,242;--rs-color-rgb-background-primary-highlighted:26,144,218}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
[data-rs-theme=reshaped]
|
|
1
|
+
[data-rs-theme=reshaped]{--rs-font-family-title:Inter,BlinkMacSystemFont,-apple-system,Roboto,Helvetica,Arial,sans-serif;--rs-font-family-body:Inter,BlinkMacSystemFont,-apple-system,Roboto,Helvetica,Arial,sans-serif;--rs-font-weight-regular:400;--rs-font-weight-medium:500;--rs-font-weight-semibold:600;--rs-font-weight-bold:700;--rs-font-weight-heavy:800;--rs-font-weight-black:900;--rs-font-size-title-1:96px;--rs-line-height-title-1:100px;--rs-font-family-title-1:var(--rs-font-family-title);--rs-font-weight-title-1:var(--rs-font-weight-heavy);--rs-font-size-title-2:80px;--rs-line-height-title-2:84px;--rs-font-family-title-2:var(--rs-font-family-title);--rs-font-weight-title-2:var(--rs-font-weight-heavy);--rs-font-size-title-3:64px;--rs-line-height-title-3:68px;--rs-font-family-title-3:var(--rs-font-family-title);--rs-font-weight-title-3:var(--rs-font-weight-heavy);--rs-font-size-title-4:56px;--rs-line-height-title-4:60px;--rs-font-family-title-4:var(--rs-font-family-title);--rs-font-weight-title-4:var(--rs-font-weight-bold);--rs-font-size-title-5:48px;--rs-line-height-title-5:52px;--rs-font-family-title-5:var(--rs-font-family-title);--rs-font-weight-title-5:var(--rs-font-weight-bold);--rs-font-size-title-6:36px;--rs-line-height-title-6:40px;--rs-font-family-title-6:var(--rs-font-family-title);--rs-font-weight-title-6:var(--rs-font-weight-bold);--rs-font-size-featured-1:32px;--rs-line-height-featured-1:40px;--rs-font-family-featured-1:var(--rs-font-family-body);--rs-font-size-featured-2:24px;--rs-line-height-featured-2:32px;--rs-font-family-featured-2:var(--rs-font-family-body);--rs-font-size-featured-3:20px;--rs-line-height-featured-3:28px;--rs-font-family-featured-3:var(--rs-font-family-body);--rs-font-size-body-1:18px;--rs-line-height-body-1:28px;--rs-font-family-body-1:var(--rs-font-family-body);--rs-font-size-body-2:16px;--rs-line-height-body-2:24px;--rs-font-family-body-2:var(--rs-font-family-body);--rs-font-size-body-3:14px;--rs-line-height-body-3:20px;--rs-font-family-body-3:var(--rs-font-family-body);--rs-font-size-caption-1:12px;--rs-line-height-caption-1:16px;--rs-font-family-caption-1:var(--rs-font-family-body);--rs-font-size-caption-2:10px;--rs-line-height-caption-2:12px;--rs-font-family-caption-2:var(--rs-font-family-body);--rs-unit-base:4px;--rs-unit-radius-small:4px;--rs-unit-radius-medium:8px;--rs-unit-radius-large:12px;--rs-unit-x1:4px;--rs-unit-x2:8px;--rs-unit-x3:12px;--rs-unit-x4:16px;--rs-unit-x5:20px;--rs-unit-x6:24px;--rs-unit-x7:28px;--rs-unit-x8:32px;--rs-unit-x9:36px;--rs-unit-x10:40px;--rs-color-black:#000;--rs-color-white:#fff;--rs-color-on-background-primary:#fff;--rs-color-on-background-positive:#fff;--rs-color-on-background-critical:#fff;--rs-color-rgb-black:0,0,0;--rs-color-rgb-white:255,255,255;--rs-duration-fast:200ms;--rs-duration-medium:300ms;--rs-duration-slow:400ms;--rs-easing-standard:cubic-bezier(0.4,0,0.2,1);--rs-easing-accelerate:cubic-bezier(0.4,0,1,1);--rs-easing-decelerate:cubic-bezier(0,0,0.2,1);--rs-shadow-raised:0px 2px 3px rgba(0,0,0,.1),0px 1px 2px -1px rgba(0,0,0,.1);--rs-shadow-overlay:0px 5px 10px rgba(0,0,0,.05),0px 15px 25px rgba(0,0,0,.07)}[data-rs-theme=reshaped][data-rs-color-mode=light]{--rs-color-foreground-neutral:#14171f;--rs-color-foreground-neutral-faded:#4d5874;--rs-color-foreground-disabled:#c7cddb;--rs-color-foreground-primary:#4d4be7;--rs-color-foreground-positive:#05751f;--rs-color-foreground-critical:#cb101d;--rs-color-background-neutral:#dfe2ea;--rs-color-background-neutral-faded:#f3f4f6;--rs-color-background-neutral-highlighted:#d4d8e3;--rs-color-background-disabled:#eceef3;--rs-color-background-disabled-faded:#f4f5f7;--rs-color-background-primary:#5a58f2;--rs-color-background-primary-highlighted:#6d6bf5;--rs-color-background-primary-faded:#edecfd;--rs-color-background-positive:#118850;--rs-color-background-positive-faded:#ebfef6;--rs-color-background-positive-highlighted:#009950;--rs-color-background-critical:#e22c2c;--rs-color-background-critical-faded:#fef1f2;--rs-color-background-critical-highlighted:#eb4747;--rs-color-border-neutral:#bbc1d3;--rs-color-border-neutral-faded:#dfe2ea;--rs-color-border-disabled:#dfe2ea;--rs-color-border-primary:#4d4be7;--rs-color-border-primary-faded:#d7d5fb;--rs-color-border-positive:#05751f;--rs-color-border-positive-faded:#cdedd5;--rs-color-border-critical:#cb101d;--rs-color-border-critical-faded:#fbd5d8;--rs-color-background-page:#fff;--rs-color-background-page-faded:#fafafa;--rs-color-background-elevation-base:#fff;--rs-color-background-elevation-raised:#fff;--rs-color-background-elevation-overlay:#fff;--rs-color-on-background-neutral:#000;--rs-color-rgb-background-neutral:223,226,234;--rs-color-rgb-background-neutral-faded:243,244,246;--rs-color-rgb-background-neutral-highlighted:212,216,227;--rs-color-rgb-background-disabled:236,238,243;--rs-color-rgb-background-disabled-faded:244,245,247;--rs-color-rgb-background-primary:90,88,242;--rs-color-rgb-background-primary-highlighted:109,107,245;--rs-color-rgb-background-primary-faded:237,236,253;--rs-color-rgb-background-positive:17,136,80;--rs-color-rgb-background-positive-faded:235,254,246;--rs-color-rgb-background-positive-highlighted:0,153,80;--rs-color-rgb-background-critical:226,44,44;--rs-color-rgb-background-critical-faded:254,241,242;--rs-color-rgb-background-critical-highlighted:235,71,71;--rs-color-rgb-background-page:255,255,255;--rs-color-rgb-background-page-faded:250,250,250;--rs-color-rgb-background-elevation-base:255,255,255;--rs-color-rgb-background-elevation-raised:255,255,255;--rs-color-rgb-background-elevation-overlay:255,255,255}[data-rs-theme=reshaped][data-rs-color-mode=dark]{--rs-color-foreground-neutral:#eff0f1;--rs-color-foreground-neutral-faded:#c2c8d6;--rs-color-foreground-disabled:#404a63;--rs-color-foreground-primary:#9d9cf7;--rs-color-foreground-positive:#03ab5f;--rs-color-foreground-critical:#eb6666;--rs-color-background-neutral:#384056;--rs-color-background-neutral-faded:#242838;--rs-color-background-neutral-highlighted:#404a63;--rs-color-background-disabled:#1c202b;--rs-color-background-disabled-faded:#161922;--rs-color-background-primary:#5250f2;--rs-color-background-primary-highlighted:#5f5df4;--rs-color-background-primary-faded:#24254c;--rs-color-background-positive:#06743f;--rs-color-background-positive-faded:#0f2921;--rs-color-background-positive-highlighted:#008545;--rs-color-background-critical:#ab1717;--rs-color-background-critical-faded:#2f1e1f;--rs-color-background-critical-highlighted:#c11515;--rs-color-border-neutral:#49536f;--rs-color-border-neutral-faded:#313649;--rs-color-border-disabled:#242938;--rs-color-border-primary:#7d7bf4;--rs-color-border-primary-faded:#2e3160;--rs-color-border-positive:#03a059;--rs-color-border-positive-faded:#163c30;--rs-color-border-critical:#e95454;--rs-color-border-critical-faded:#412a2b;--rs-color-background-page:#0d1117;--rs-color-background-page-faded:#0f131a;--rs-color-background-elevation-base:#14181f;--rs-color-background-elevation-raised:#181d25;--rs-color-background-elevation-overlay:#1c212b;--rs-color-on-background-neutral:#fff;--rs-color-rgb-background-neutral:56,64,86;--rs-color-rgb-background-neutral-faded:36,40,56;--rs-color-rgb-background-neutral-highlighted:64,74,99;--rs-color-rgb-background-disabled:28,32,43;--rs-color-rgb-background-disabled-faded:22,25,34;--rs-color-rgb-background-primary:82,80,242;--rs-color-rgb-background-primary-highlighted:95,93,244;--rs-color-rgb-background-primary-faded:36,37,76;--rs-color-rgb-background-positive:6,116,63;--rs-color-rgb-background-positive-faded:15,41,33;--rs-color-rgb-background-positive-highlighted:0,133,69;--rs-color-rgb-background-critical:171,23,23;--rs-color-rgb-background-critical-faded:47,30,31;--rs-color-rgb-background-critical-highlighted:193,21,21;--rs-color-rgb-background-page:13,17,23;--rs-color-rgb-background-page-faded:15,19,26;--rs-color-rgb-background-elevation-base:20,24,31;--rs-color-rgb-background-elevation-raised:24,29,37;--rs-color-rgb-background-elevation-overlay:28,33,43}
|
package/themes/slate/theme.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
[data-rs-theme=slate]
|
|
1
|
+
[data-rs-theme=slate]{--rs-font-family-title:Inter,BlinkMacSystemFont,-apple-system,Roboto,Helvetica,Arial,sans-serif;--rs-font-family-body:Inter,BlinkMacSystemFont,-apple-system,Roboto,Helvetica,Arial,sans-serif;--rs-font-weight-regular:400;--rs-font-weight-medium:500;--rs-font-weight-semibold:600;--rs-font-weight-bold:700;--rs-font-weight-heavy:800;--rs-font-weight-black:900;--rs-font-size-title-1:96px;--rs-line-height-title-1:100px;--rs-font-family-title-1:var(--rs-font-family-title);--rs-font-weight-title-1:var(--rs-font-weight-heavy);--rs-font-size-title-2:80px;--rs-line-height-title-2:84px;--rs-font-family-title-2:var(--rs-font-family-title);--rs-font-weight-title-2:var(--rs-font-weight-heavy);--rs-font-size-title-3:64px;--rs-line-height-title-3:68px;--rs-font-family-title-3:var(--rs-font-family-title);--rs-font-weight-title-3:var(--rs-font-weight-heavy);--rs-font-size-title-4:56px;--rs-line-height-title-4:60px;--rs-font-family-title-4:var(--rs-font-family-title);--rs-font-weight-title-4:var(--rs-font-weight-bold);--rs-font-size-title-5:48px;--rs-line-height-title-5:52px;--rs-font-family-title-5:var(--rs-font-family-title);--rs-font-weight-title-5:var(--rs-font-weight-bold);--rs-font-size-title-6:36px;--rs-line-height-title-6:40px;--rs-font-family-title-6:var(--rs-font-family-title);--rs-font-weight-title-6:var(--rs-font-weight-bold);--rs-font-size-featured-1:32px;--rs-line-height-featured-1:40px;--rs-font-family-featured-1:var(--rs-font-family-body);--rs-font-size-featured-2:24px;--rs-line-height-featured-2:32px;--rs-font-family-featured-2:var(--rs-font-family-body);--rs-font-size-featured-3:20px;--rs-line-height-featured-3:28px;--rs-font-family-featured-3:var(--rs-font-family-body);--rs-font-size-body-1:18px;--rs-line-height-body-1:28px;--rs-font-family-body-1:var(--rs-font-family-body);--rs-font-size-body-2:16px;--rs-line-height-body-2:24px;--rs-font-family-body-2:var(--rs-font-family-body);--rs-font-size-body-3:14px;--rs-line-height-body-3:20px;--rs-font-family-body-3:var(--rs-font-family-body);--rs-font-size-caption-1:12px;--rs-line-height-caption-1:16px;--rs-font-family-caption-1:var(--rs-font-family-body);--rs-font-size-caption-2:10px;--rs-line-height-caption-2:12px;--rs-font-family-caption-2:var(--rs-font-family-body);--rs-unit-base:4px;--rs-unit-radius-small:2px;--rs-unit-radius-medium:4px;--rs-unit-radius-large:6px;--rs-unit-x1:4px;--rs-unit-x2:8px;--rs-unit-x3:12px;--rs-unit-x4:16px;--rs-unit-x5:20px;--rs-unit-x6:24px;--rs-unit-x7:28px;--rs-unit-x8:32px;--rs-unit-x9:36px;--rs-unit-x10:40px;--rs-color-black:#000;--rs-color-white:#fff;--rs-color-on-background-primary:#fff;--rs-color-on-background-positive:#fff;--rs-color-on-background-critical:#fff;--rs-color-rgb-black:0,0,0;--rs-color-rgb-white:255,255,255;--rs-duration-fast:200ms;--rs-duration-medium:300ms;--rs-duration-slow:400ms;--rs-easing-standard:cubic-bezier(0.4,0,0.2,1);--rs-easing-accelerate:cubic-bezier(0.4,0,1,1);--rs-easing-decelerate:cubic-bezier(0,0,0.2,1);--rs-shadow-raised:0px 2px 3px rgba(0,0,0,.1),0px 1px 2px -1px rgba(0,0,0,.1);--rs-shadow-overlay:0px 5px 10px rgba(0,0,0,.05),0px 15px 25px rgba(0,0,0,.07)}[data-rs-theme=slate][data-rs-color-mode=light]{--rs-color-foreground-neutral:#161a26;--rs-color-foreground-neutral-faded:#717787;--rs-color-foreground-disabled:#d4d0d0;--rs-color-foreground-primary:#2383e2;--rs-color-foreground-positive:#05751f;--rs-color-foreground-critical:#cb101d;--rs-color-background-neutral:#e3e3e5;--rs-color-background-neutral-faded:#f2f3f5;--rs-color-background-neutral-highlighted:#dedee1;--rs-color-background-disabled:#eceef3;--rs-color-background-disabled-faded:#f4f5f7;--rs-color-background-primary:#2383e2;--rs-color-background-primary-highlighted:#3273cc;--rs-color-background-primary-faded:#e5f4fb;--rs-color-background-positive:#118850;--rs-color-background-positive-faded:#ebfef6;--rs-color-background-positive-highlighted:#009950;--rs-color-background-critical:#e22c2c;--rs-color-background-critical-faded:#fef1f2;--rs-color-background-critical-highlighted:#eb4747;--rs-color-border-neutral:#d2d2d2;--rs-color-border-neutral-faded:#e2e2e2;--rs-color-border-disabled:#e2e2e2;--rs-color-border-primary:#3d76c7;--rs-color-border-primary-faded:#c6d9f4;--rs-color-border-positive:#05751f;--rs-color-border-positive-faded:#cdedd5;--rs-color-border-critical:#cb101d;--rs-color-border-critical-faded:#fbd5d8;--rs-color-background-page:#fff;--rs-color-background-page-faded:#f7f7f5;--rs-color-background-elevation-base:#fff;--rs-color-background-elevation-raised:#fff;--rs-color-background-elevation-overlay:#fff;--rs-color-on-background-neutral:#000;--rs-color-rgb-background-neutral:227,227,229;--rs-color-rgb-background-neutral-faded:242,243,245;--rs-color-rgb-background-neutral-highlighted:222,222,225;--rs-color-rgb-background-disabled:236,238,243;--rs-color-rgb-background-disabled-faded:244,245,247;--rs-color-rgb-background-primary:35,131,226;--rs-color-rgb-background-primary-highlighted:50,115,204;--rs-color-rgb-background-primary-faded:229,244,251;--rs-color-rgb-background-positive:17,136,80;--rs-color-rgb-background-positive-faded:235,254,246;--rs-color-rgb-background-positive-highlighted:0,153,80;--rs-color-rgb-background-critical:226,44,44;--rs-color-rgb-background-critical-faded:254,241,242;--rs-color-rgb-background-critical-highlighted:235,71,71;--rs-color-rgb-background-page:255,255,255;--rs-color-rgb-background-page-faded:247,247,245;--rs-color-rgb-background-elevation-base:255,255,255;--rs-color-rgb-background-elevation-raised:255,255,255;--rs-color-rgb-background-elevation-overlay:255,255,255}[data-rs-theme=slate][data-rs-color-mode=dark]{--rs-color-foreground-neutral:#f2f3f5;--rs-color-foreground-neutral-faded:#9f9e9e;--rs-color-foreground-disabled:#656565;--rs-color-foreground-primary:#5098ff;--rs-color-foreground-positive:#03ab5f;--rs-color-foreground-critical:#eb6666;--rs-color-background-neutral:#4f5155;--rs-color-background-neutral-faded:#34363f;--rs-color-background-neutral-highlighted:#595c60;--rs-color-background-disabled:#313131;--rs-color-background-disabled-faded:#262626;--rs-color-background-primary:#4281db;--rs-color-background-primary-highlighted:#3273cc;--rs-color-background-primary-faded:#1e2c45;--rs-color-background-positive:#06743f;--rs-color-background-positive-faded:#0f2921;--rs-color-background-positive-highlighted:#008545;--rs-color-background-critical:#ab1717;--rs-color-background-critical-faded:#2f1e1f;--rs-color-background-critical-highlighted:#c11515;--rs-color-border-neutral:#414141;--rs-color-border-neutral-faded:#464646;--rs-color-border-disabled:#404040;--rs-color-border-primary:#5a91e0;--rs-color-border-primary-faded:#163a6a;--rs-color-border-positive:#03a059;--rs-color-border-positive-faded:#163c30;--rs-color-border-critical:#e95454;--rs-color-border-critical-faded:#412a2b;--rs-color-background-page:#191919;--rs-color-background-page-faded:#202020;--rs-color-background-elevation-base:#232323;--rs-color-background-elevation-raised:#262626;--rs-color-background-elevation-overlay:#292929;--rs-color-on-background-neutral:#fff;--rs-color-rgb-background-neutral:79,81,85;--rs-color-rgb-background-neutral-faded:52,54,63;--rs-color-rgb-background-neutral-highlighted:89,92,96;--rs-color-rgb-background-disabled:49,49,49;--rs-color-rgb-background-disabled-faded:38,38,38;--rs-color-rgb-background-primary:66,129,219;--rs-color-rgb-background-primary-highlighted:50,115,204;--rs-color-rgb-background-primary-faded:30,44,69;--rs-color-rgb-background-positive:6,116,63;--rs-color-rgb-background-positive-faded:15,41,33;--rs-color-rgb-background-positive-highlighted:0,133,69;--rs-color-rgb-background-critical:171,23,23;--rs-color-rgb-background-critical-faded:47,30,31;--rs-color-rgb-background-critical-highlighted:193,21,21;--rs-color-rgb-background-page:25,25,25;--rs-color-rgb-background-page-faded:32,32,32;--rs-color-rgb-background-elevation-base:35,35,35;--rs-color-rgb-background-elevation-raised:38,38,38;--rs-color-rgb-background-elevation-overlay:41,41,41}
|
package/utilities/helpers.d.ts
CHANGED
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
1
|
import type * as G from "../types/global";
|
|
3
2
|
export declare const debounce: <T extends Function>(cb: T, wait?: number) => T;
|
|
4
3
|
export declare function debounceHandler<T extends React.SyntheticEvent | Event>(handler: (event: T) => void, timeout: number): (event: T) => void;
|