@blockle/blocks 0.16.1 → 0.18.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.
Files changed (12) hide show
  1. package/dist/index.cjs +2 -0
  2. package/dist/index.d.mts +1 -1
  3. package/dist/index.d.ts +1 -1
  4. package/dist/index.mjs +2 -0
  5. package/dist/momotaro.chunk.d.ts +72 -67
  6. package/dist/styles/components/Accessibility/VisuallyHidden/VisuallyHidden.cjs +7 -0
  7. package/dist/styles/components/Accessibility/VisuallyHidden/VisuallyHidden.mjs +8 -0
  8. package/dist/styles/components/Accessibility/VisuallyHidden/visually-hidden.css.cjs +15 -0
  9. package/dist/styles/components/Accessibility/VisuallyHidden/visually-hidden.css.mjs +16 -0
  10. package/dist/styles/components/form/Checkbox/Checkbox.cjs +3 -3
  11. package/dist/styles/components/form/Checkbox/Checkbox.mjs +3 -3
  12. package/package.json +1 -1
package/dist/index.cjs CHANGED
@@ -7,6 +7,7 @@ const styles_lib_theme_makeTheme_cjs = require("./styles/lib/theme/makeTheme.cjs
7
7
  const styles_lib_theme_vars_css_cjs = require("./styles/lib/theme/vars.css.cjs");
8
8
  const styles_components_display_Divider_Divider_cjs = require("./styles/components/display/Divider/Divider.cjs");
9
9
  const styles_lib_css_atoms_sprinkles_css_cjs = require("./styles/lib/css/atoms/sprinkles.css.cjs");
10
+ const styles_components_Accessibility_VisuallyHidden_VisuallyHidden_cjs = require("./styles/components/Accessibility/VisuallyHidden/VisuallyHidden.cjs");
10
11
  const jsxRuntime = require("react/jsx-runtime");
11
12
  const react = require("react");
12
13
  const styles_components_form_Button_Button_cjs = require("./styles/components/form/Button/Button.cjs");
@@ -403,6 +404,7 @@ exports.createAsChildTemplate = styles_components_display_Divider_Divider_cjs.cr
403
404
  exports.useComponentStyleDefaultProps = styles_components_display_Divider_Divider_cjs.useComponentStyleDefaultProps;
404
405
  exports.useComponentStyles = styles_components_display_Divider_Divider_cjs.useComponentStyles;
405
406
  exports.atoms = styles_lib_css_atoms_sprinkles_css_cjs.atoms;
407
+ exports.VisuallyHidden = styles_components_Accessibility_VisuallyHidden_VisuallyHidden_cjs.VisuallyHidden;
406
408
  exports.Button = styles_components_form_Button_Button_cjs.Button;
407
409
  exports.Spinner = styles_components_form_Button_Button_cjs.Spinner;
408
410
  exports.Checkbox = styles_components_form_Checkbox_Checkbox_cjs.Checkbox;
package/dist/index.d.mts CHANGED
@@ -1 +1 @@
1
- export { BlocksProvider, BlocksProviderProps, Box, BoxProps, Button, ButtonProps, Checkbox, CheckboxProps, Dialog, DialogProps, Divider, DividerProps, Heading, HeadingProps, Inline, InlineProps, Input, InputProps, Label, LabelProps, Link, LinkProps, Portal, PortalProps, Progress, ProgressProps, Radio, RadioProps, Select, SelectProps, Slider, SliderProps, Spinner, SpinnerProps, Stack, StackProps, Switch, SwitchProps, Text, TextProps, ThemeComponentsStyles, ThemeTokens, Tooltip, TooltipProps, atoms, classnames, createAsChildTemplate, makeComponentTheme, makeTheme, minMediaQuery, style, useComponentStyleDefaultProps, useComponentStyles, useIsomorphicLayoutEffect, useKeyboard, usePreventBodyScroll, useRootAriaHidden, vars } from './momotaro.chunk.js';
1
+ export { BlocksProvider, BlocksProviderProps, Box, BoxProps, Button, ButtonProps, Checkbox, CheckboxProps, Dialog, DialogProps, Divider, DividerProps, Heading, HeadingProps, Inline, InlineProps, Input, InputProps, Label, LabelProps, Link, LinkProps, Portal, PortalProps, Progress, ProgressProps, Radio, RadioProps, Select, SelectProps, Slider, SliderProps, Spinner, SpinnerProps, Stack, StackProps, Switch, SwitchProps, Text, TextProps, ThemeComponentsStyles, ThemeTokens, Tooltip, TooltipProps, VisuallyHidden, VisuallyHiddenProps, atoms, classnames, createAsChildTemplate, makeComponentTheme, makeTheme, minMediaQuery, style, useComponentStyleDefaultProps, useComponentStyles, useIsomorphicLayoutEffect, useKeyboard, usePreventBodyScroll, useRootAriaHidden, vars } from './momotaro.chunk.js';
package/dist/index.d.ts CHANGED
@@ -1 +1 @@
1
- export { BlocksProvider, BlocksProviderProps, Box, BoxProps, Button, ButtonProps, Checkbox, CheckboxProps, Dialog, DialogProps, Divider, DividerProps, Heading, HeadingProps, Inline, InlineProps, Input, InputProps, Label, LabelProps, Link, LinkProps, Portal, PortalProps, Progress, ProgressProps, Radio, RadioProps, Select, SelectProps, Slider, SliderProps, Spinner, SpinnerProps, Stack, StackProps, Switch, SwitchProps, Text, TextProps, ThemeComponentsStyles, ThemeTokens, Tooltip, TooltipProps, atoms, classnames, createAsChildTemplate, makeComponentTheme, makeTheme, minMediaQuery, style, useComponentStyleDefaultProps, useComponentStyles, useIsomorphicLayoutEffect, useKeyboard, usePreventBodyScroll, useRootAriaHidden, vars } from './momotaro.chunk.js';
1
+ export { BlocksProvider, BlocksProviderProps, Box, BoxProps, Button, ButtonProps, Checkbox, CheckboxProps, Dialog, DialogProps, Divider, DividerProps, Heading, HeadingProps, Inline, InlineProps, Input, InputProps, Label, LabelProps, Link, LinkProps, Portal, PortalProps, Progress, ProgressProps, Radio, RadioProps, Select, SelectProps, Slider, SliderProps, Spinner, SpinnerProps, Stack, StackProps, Switch, SwitchProps, Text, TextProps, ThemeComponentsStyles, ThemeTokens, Tooltip, TooltipProps, VisuallyHidden, VisuallyHiddenProps, atoms, classnames, createAsChildTemplate, makeComponentTheme, makeTheme, minMediaQuery, style, useComponentStyleDefaultProps, useComponentStyles, useIsomorphicLayoutEffect, useKeyboard, usePreventBodyScroll, useRootAriaHidden, vars } from './momotaro.chunk.js';
package/dist/index.mjs CHANGED
@@ -8,6 +8,7 @@ import { vars } from "./styles/lib/theme/vars.css.mjs";
8
8
  import { useComponentStyles, Box, classnames, createAsChildTemplate, useTheme, composeRefs, BlocksProviderContext } from "./styles/components/display/Divider/Divider.mjs";
9
9
  import { Divider, useComponentStyleDefaultProps } from "./styles/components/display/Divider/Divider.mjs";
10
10
  import { atoms } from "./styles/lib/css/atoms/sprinkles.css.mjs";
11
+ import { VisuallyHidden } from "./styles/components/Accessibility/VisuallyHidden/VisuallyHidden.mjs";
11
12
  import { jsx, jsxs, Fragment } from "react/jsx-runtime";
12
13
  import { forwardRef, useRef, useEffect, useState, useCallback, useLayoutEffect, useId, Children, isValidElement, cloneElement, useContext } from "react";
13
14
  import { Button, Spinner } from "./styles/components/form/Button/Button.mjs";
@@ -415,6 +416,7 @@ export {
415
416
  Switch,
416
417
  Text,
417
418
  Tooltip,
419
+ VisuallyHidden,
418
420
  atoms,
419
421
  classnames,
420
422
  createAsChildTemplate,
package/dist/momotaro.chunk.d.ts CHANGED
@@ -46,193 +46,193 @@ declare const atoms: ((props: {
46
46
  tablet?: "stretch" | "center" | "flex-start" | "flex-end" | undefined;
47
47
  desktop?: "stretch" | "center" | "flex-start" | "flex-end" | undefined;
48
48
  wide?: "stretch" | "center" | "flex-start" | "flex-end" | undefined;
49
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, "stretch" | "center" | "flex-start" | "flex-end" | null>;
49
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, "stretch" | "center" | "flex-start" | "flex-end" | null>;
50
50
  readonly alignItems?: ("stretch" | "center" | "flex-start" | "flex-end" | {
51
51
  mobile?: "stretch" | "center" | "flex-start" | "flex-end" | undefined;
52
52
  tablet?: "stretch" | "center" | "flex-start" | "flex-end" | undefined;
53
53
  desktop?: "stretch" | "center" | "flex-start" | "flex-end" | undefined;
54
54
  wide?: "stretch" | "center" | "flex-start" | "flex-end" | undefined;
55
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, "stretch" | "center" | "flex-start" | "flex-end" | null>;
55
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, "stretch" | "center" | "flex-start" | "flex-end" | null>;
56
56
  readonly alignSelf?: ("stretch" | "center" | "flex-start" | "flex-end" | {
57
57
  mobile?: "stretch" | "center" | "flex-start" | "flex-end" | undefined;
58
58
  tablet?: "stretch" | "center" | "flex-start" | "flex-end" | undefined;
59
59
  desktop?: "stretch" | "center" | "flex-start" | "flex-end" | undefined;
60
60
  wide?: "stretch" | "center" | "flex-start" | "flex-end" | undefined;
61
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, "stretch" | "center" | "flex-start" | "flex-end" | null>;
61
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, "stretch" | "center" | "flex-start" | "flex-end" | null>;
62
62
  readonly columnGap?: (("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | {
63
63
  mobile?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
64
64
  tablet?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
65
65
  desktop?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
66
66
  wide?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
67
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | null>;
67
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | null>;
68
68
  readonly display?: ("none" | "flex" | "grid" | "inline-flex" | "block" | "inline" | "inline-block" | "inline-grid" | {
69
69
  mobile?: "none" | "flex" | "grid" | "inline-flex" | "block" | "inline" | "inline-block" | "inline-grid" | undefined;
70
70
  tablet?: "none" | "flex" | "grid" | "inline-flex" | "block" | "inline" | "inline-block" | "inline-grid" | undefined;
71
71
  desktop?: "none" | "flex" | "grid" | "inline-flex" | "block" | "inline" | "inline-block" | "inline-grid" | undefined;
72
72
  wide?: "none" | "flex" | "grid" | "inline-flex" | "block" | "inline" | "inline-block" | "inline-grid" | undefined;
73
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, "none" | "flex" | "grid" | "inline-flex" | "block" | "inline" | "inline-block" | "inline-grid" | null>;
73
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, "none" | "flex" | "grid" | "inline-flex" | "block" | "inline" | "inline-block" | "inline-grid" | null>;
74
74
  readonly flex?: (1 | {
75
75
  mobile?: 1 | undefined;
76
76
  tablet?: 1 | undefined;
77
77
  desktop?: 1 | undefined;
78
78
  wide?: 1 | undefined;
79
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, 1 | null>;
79
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, 1 | null>;
80
80
  readonly flexDirection?: ("row" | "row-reverse" | "column" | "column-reverse" | {
81
81
  mobile?: "row" | "row-reverse" | "column" | "column-reverse" | undefined;
82
82
  tablet?: "row" | "row-reverse" | "column" | "column-reverse" | undefined;
83
83
  desktop?: "row" | "row-reverse" | "column" | "column-reverse" | undefined;
84
84
  wide?: "row" | "row-reverse" | "column" | "column-reverse" | undefined;
85
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, "row" | "row-reverse" | "column" | "column-reverse" | null>;
85
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, "row" | "row-reverse" | "column" | "column-reverse" | null>;
86
86
  readonly flexGrow?: (0 | 1 | {
87
87
  mobile?: 0 | 1 | undefined;
88
88
  tablet?: 0 | 1 | undefined;
89
89
  desktop?: 0 | 1 | undefined;
90
90
  wide?: 0 | 1 | undefined;
91
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, 0 | 1 | null>;
91
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, 0 | 1 | null>;
92
92
  readonly flexShrink?: (0 | 1 | {
93
93
  mobile?: 0 | 1 | undefined;
94
94
  tablet?: 0 | 1 | undefined;
95
95
  desktop?: 0 | 1 | undefined;
96
96
  wide?: 0 | 1 | undefined;
97
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, 0 | 1 | null>;
97
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, 0 | 1 | null>;
98
98
  readonly flexWrap?: ("wrap" | "nowrap" | {
99
99
  mobile?: "wrap" | "nowrap" | undefined;
100
100
  tablet?: "wrap" | "nowrap" | undefined;
101
101
  desktop?: "wrap" | "nowrap" | undefined;
102
102
  wide?: "wrap" | "nowrap" | undefined;
103
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, "wrap" | "nowrap" | null>;
103
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, "wrap" | "nowrap" | null>;
104
104
  readonly fontSize?: (("xsmall" | "small" | "medium" | "large" | "xlarge") | {
105
105
  mobile?: ("xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
106
106
  tablet?: ("xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
107
107
  desktop?: ("xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
108
108
  wide?: ("xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
109
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, ("xsmall" | "small" | "medium" | "large" | "xlarge") | null>;
109
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, ("xsmall" | "small" | "medium" | "large" | "xlarge") | null>;
110
110
  readonly gap?: (("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | {
111
111
  mobile?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
112
112
  tablet?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
113
113
  desktop?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
114
114
  wide?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
115
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | null>;
115
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | null>;
116
116
  readonly justifyContent?: ("center" | "flex-start" | "flex-end" | "space-between" | "space-around" | {
117
117
  mobile?: "center" | "flex-start" | "flex-end" | "space-between" | "space-around" | undefined;
118
118
  tablet?: "center" | "flex-start" | "flex-end" | "space-between" | "space-around" | undefined;
119
119
  desktop?: "center" | "flex-start" | "flex-end" | "space-between" | "space-around" | undefined;
120
120
  wide?: "center" | "flex-start" | "flex-end" | "space-between" | "space-around" | undefined;
121
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, "center" | "flex-start" | "flex-end" | "space-between" | "space-around" | null>;
121
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, "center" | "flex-start" | "flex-end" | "space-between" | "space-around" | null>;
122
122
  readonly marginBlockStart?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | {
123
123
  mobile?: "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | undefined;
124
124
  tablet?: "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | undefined;
125
125
  desktop?: "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | undefined;
126
126
  wide?: "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | undefined;
127
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | null>;
127
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | null>;
128
128
  readonly marginBlockEnd?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | {
129
129
  mobile?: "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | undefined;
130
130
  tablet?: "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | undefined;
131
131
  desktop?: "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | undefined;
132
132
  wide?: "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | undefined;
133
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | null>;
133
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | null>;
134
134
  readonly marginInlineStart?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | {
135
135
  mobile?: "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | undefined;
136
136
  tablet?: "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | undefined;
137
137
  desktop?: "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | undefined;
138
138
  wide?: "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | undefined;
139
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | null>;
139
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | null>;
140
140
  readonly marginInlineEnd?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | {
141
141
  mobile?: "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | undefined;
142
142
  tablet?: "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | undefined;
143
143
  desktop?: "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | undefined;
144
144
  wide?: "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | undefined;
145
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | null>;
145
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | null>;
146
146
  readonly outline?: ("none" | {
147
147
  mobile?: "none" | undefined;
148
148
  tablet?: "none" | undefined;
149
149
  desktop?: "none" | undefined;
150
150
  wide?: "none" | undefined;
151
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, "none" | null>;
151
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, "none" | null>;
152
152
  readonly padding?: (("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | {
153
153
  mobile?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
154
154
  tablet?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
155
155
  desktop?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
156
156
  wide?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
157
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | null>;
157
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | null>;
158
158
  readonly paddingBlock?: (("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | {
159
159
  mobile?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
160
160
  tablet?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
161
161
  desktop?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
162
162
  wide?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
163
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | null>;
163
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | null>;
164
164
  readonly paddingBlockStart?: (("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | {
165
165
  mobile?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
166
166
  tablet?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
167
167
  desktop?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
168
168
  wide?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
169
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | null>;
169
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | null>;
170
170
  readonly paddingBlockEnd?: (("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | {
171
171
  mobile?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
172
172
  tablet?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
173
173
  desktop?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
174
174
  wide?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
175
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | null>;
175
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | null>;
176
176
  readonly paddingInline?: (("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | {
177
177
  mobile?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
178
178
  tablet?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
179
179
  desktop?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
180
180
  wide?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
181
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | null>;
181
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | null>;
182
182
  readonly paddingInlineStart?: (("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | {
183
183
  mobile?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
184
184
  tablet?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
185
185
  desktop?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
186
186
  wide?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
187
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | null>;
187
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | null>;
188
188
  readonly paddingInlineEnd?: (("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | {
189
189
  mobile?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
190
190
  tablet?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
191
191
  desktop?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
192
192
  wide?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
193
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | null>;
193
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | null>;
194
194
  readonly position?: ("relative" | "fixed" | "absolute" | "sticky" | "static" | {
195
195
  mobile?: "relative" | "fixed" | "absolute" | "sticky" | "static" | undefined;
196
196
  tablet?: "relative" | "fixed" | "absolute" | "sticky" | "static" | undefined;
197
197
  desktop?: "relative" | "fixed" | "absolute" | "sticky" | "static" | undefined;
198
198
  wide?: "relative" | "fixed" | "absolute" | "sticky" | "static" | undefined;
199
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, "relative" | "fixed" | "absolute" | "sticky" | "static" | null>;
199
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, "relative" | "fixed" | "absolute" | "sticky" | "static" | null>;
200
200
  readonly rowGap?: (("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | {
201
201
  mobile?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
202
202
  tablet?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
203
203
  desktop?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
204
204
  wide?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
205
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | null>;
205
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | null>;
206
206
  readonly textAlign?: ("left" | "right" | "center" | "justify" | {
207
207
  mobile?: "left" | "right" | "center" | "justify" | undefined;
208
208
  tablet?: "left" | "right" | "center" | "justify" | undefined;
209
209
  desktop?: "left" | "right" | "center" | "justify" | undefined;
210
210
  wide?: "left" | "right" | "center" | "justify" | undefined;
211
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, "left" | "right" | "center" | "justify" | null>;
211
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, "left" | "right" | "center" | "justify" | null>;
212
212
  margin?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | {
213
213
  mobile?: "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | undefined;
214
214
  tablet?: "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | undefined;
215
215
  desktop?: "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | undefined;
216
216
  wide?: "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | undefined;
217
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | null>;
217
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | null>;
218
218
  marginBlock?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | {
219
219
  mobile?: "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | undefined;
220
220
  tablet?: "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | undefined;
221
221
  desktop?: "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | undefined;
222
222
  wide?: "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | undefined;
223
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | null>;
223
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | null>;
224
224
  marginInline?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | {
225
225
  mobile?: "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | undefined;
226
226
  tablet?: "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | undefined;
227
227
  desktop?: "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | undefined;
228
228
  wide?: "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | undefined;
229
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | null>;
229
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | null>;
230
230
  placeItems?: ("center" | "flex-start" | "flex-end" | {
231
231
  mobile?: "center" | "flex-start" | "flex-end" | undefined;
232
232
  tablet?: "center" | "flex-start" | "flex-end" | undefined;
233
233
  desktop?: "center" | "flex-start" | "flex-end" | undefined;
234
234
  wide?: "center" | "flex-start" | "flex-end" | undefined;
235
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, "center" | "flex-start" | "flex-end" | null>;
235
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, "center" | "flex-start" | "flex-end" | null>;
236
236
  }) => string) & {
237
237
  properties: Set<"borderRadius" | "color" | "borderWidth" | "fontFamily" | "fontSize" | "fontWeight" | "lineHeight" | "transition" | "boxShadow" | "alignContent" | "alignItems" | "alignSelf" | "backgroundColor" | "blockSize" | "columnGap" | "cursor" | "display" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "fontStyle" | "inlineSize" | "insetBlockEnd" | "insetBlockStart" | "insetInlineEnd" | "insetInlineStart" | "justifyContent" | "marginBlockEnd" | "marginBlockStart" | "marginInlineEnd" | "marginInlineStart" | "maxBlockSize" | "maxInlineSize" | "opacity" | "overflowBlock" | "overflowInline" | "paddingBlockEnd" | "paddingBlockStart" | "paddingInlineEnd" | "paddingInlineStart" | "pointerEvents" | "position" | "rowGap" | "textAlign" | "textTransform" | "textWrap" | "userSelect" | "whiteSpace" | "wordBreak" | "wordWrap" | "border" | "borderColor" | "flex" | "gap" | "inset" | "insetBlock" | "insetInline" | "margin" | "marginBlock" | "marginInline" | "outline" | "overflow" | "padding" | "paddingBlock" | "paddingInline" | "placeItems" | "textDecoration">;
238
238
  };
@@ -600,6 +600,11 @@ declare const vars: {
600
600
  };
601
601
  };
602
602
 
603
+ type VisuallyHiddenProps = {
604
+ children: React.ReactNode;
605
+ };
606
+ declare const VisuallyHidden: React.FC<VisuallyHiddenProps>;
607
+
603
608
  type DividerProps = {
604
609
  className?: string;
605
610
  color?: Atoms['backgroundColor'];
@@ -663,12 +668,12 @@ declare const Button: react.ForwardRefExoticComponent<{
663
668
 
664
669
  type CheckboxProps = {
665
670
  name: string;
666
- label?: react__default.ReactNode;
671
+ children?: react__default.ReactNode;
667
672
  required?: boolean;
668
673
  } & HTMLElementProps<HTMLInputElement>;
669
674
  declare const Checkbox: react__default.ForwardRefExoticComponent<{
670
675
  name: string;
671
- label?: react__default.ReactNode;
676
+ children?: react__default.ReactNode;
672
677
  required?: boolean;
673
678
  } & HTMLElementProps<HTMLInputElement> & react__default.RefAttributes<HTMLInputElement>>;
674
679
 
@@ -805,193 +810,193 @@ declare const Box: react.ForwardRefExoticComponent<{
805
810
  tablet?: "stretch" | "center" | "flex-start" | "flex-end" | undefined;
806
811
  desktop?: "stretch" | "center" | "flex-start" | "flex-end" | undefined;
807
812
  wide?: "stretch" | "center" | "flex-start" | "flex-end" | undefined;
808
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, "stretch" | "center" | "flex-start" | "flex-end" | null>;
813
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, "stretch" | "center" | "flex-start" | "flex-end" | null>;
809
814
  readonly alignItems?: ("stretch" | "center" | "flex-start" | "flex-end" | {
810
815
  mobile?: "stretch" | "center" | "flex-start" | "flex-end" | undefined;
811
816
  tablet?: "stretch" | "center" | "flex-start" | "flex-end" | undefined;
812
817
  desktop?: "stretch" | "center" | "flex-start" | "flex-end" | undefined;
813
818
  wide?: "stretch" | "center" | "flex-start" | "flex-end" | undefined;
814
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, "stretch" | "center" | "flex-start" | "flex-end" | null>;
819
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, "stretch" | "center" | "flex-start" | "flex-end" | null>;
815
820
  readonly alignSelf?: ("stretch" | "center" | "flex-start" | "flex-end" | {
816
821
  mobile?: "stretch" | "center" | "flex-start" | "flex-end" | undefined;
817
822
  tablet?: "stretch" | "center" | "flex-start" | "flex-end" | undefined;
818
823
  desktop?: "stretch" | "center" | "flex-start" | "flex-end" | undefined;
819
824
  wide?: "stretch" | "center" | "flex-start" | "flex-end" | undefined;
820
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, "stretch" | "center" | "flex-start" | "flex-end" | null>;
825
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, "stretch" | "center" | "flex-start" | "flex-end" | null>;
821
826
  readonly columnGap?: (("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | {
822
827
  mobile?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
823
828
  tablet?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
824
829
  desktop?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
825
830
  wide?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
826
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | null>;
831
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | null>;
827
832
  readonly display?: ("none" | "flex" | "grid" | "inline-flex" | "block" | "inline" | "inline-block" | "inline-grid" | {
828
833
  mobile?: "none" | "flex" | "grid" | "inline-flex" | "block" | "inline" | "inline-block" | "inline-grid" | undefined;
829
834
  tablet?: "none" | "flex" | "grid" | "inline-flex" | "block" | "inline" | "inline-block" | "inline-grid" | undefined;
830
835
  desktop?: "none" | "flex" | "grid" | "inline-flex" | "block" | "inline" | "inline-block" | "inline-grid" | undefined;
831
836
  wide?: "none" | "flex" | "grid" | "inline-flex" | "block" | "inline" | "inline-block" | "inline-grid" | undefined;
832
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, "none" | "flex" | "grid" | "inline-flex" | "block" | "inline" | "inline-block" | "inline-grid" | null>;
837
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, "none" | "flex" | "grid" | "inline-flex" | "block" | "inline" | "inline-block" | "inline-grid" | null>;
833
838
  readonly flex?: (1 | {
834
839
  mobile?: 1 | undefined;
835
840
  tablet?: 1 | undefined;
836
841
  desktop?: 1 | undefined;
837
842
  wide?: 1 | undefined;
838
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, 1 | null>;
843
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, 1 | null>;
839
844
  readonly flexDirection?: ("row" | "row-reverse" | "column" | "column-reverse" | {
840
845
  mobile?: "row" | "row-reverse" | "column" | "column-reverse" | undefined;
841
846
  tablet?: "row" | "row-reverse" | "column" | "column-reverse" | undefined;
842
847
  desktop?: "row" | "row-reverse" | "column" | "column-reverse" | undefined;
843
848
  wide?: "row" | "row-reverse" | "column" | "column-reverse" | undefined;
844
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, "row" | "row-reverse" | "column" | "column-reverse" | null>;
849
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, "row" | "row-reverse" | "column" | "column-reverse" | null>;
845
850
  readonly flexGrow?: (0 | 1 | {
846
851
  mobile?: 0 | 1 | undefined;
847
852
  tablet?: 0 | 1 | undefined;
848
853
  desktop?: 0 | 1 | undefined;
849
854
  wide?: 0 | 1 | undefined;
850
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, 0 | 1 | null>;
855
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, 0 | 1 | null>;
851
856
  readonly flexShrink?: (0 | 1 | {
852
857
  mobile?: 0 | 1 | undefined;
853
858
  tablet?: 0 | 1 | undefined;
854
859
  desktop?: 0 | 1 | undefined;
855
860
  wide?: 0 | 1 | undefined;
856
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, 0 | 1 | null>;
861
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, 0 | 1 | null>;
857
862
  readonly flexWrap?: ("wrap" | "nowrap" | {
858
863
  mobile?: "wrap" | "nowrap" | undefined;
859
864
  tablet?: "wrap" | "nowrap" | undefined;
860
865
  desktop?: "wrap" | "nowrap" | undefined;
861
866
  wide?: "wrap" | "nowrap" | undefined;
862
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, "wrap" | "nowrap" | null>;
867
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, "wrap" | "nowrap" | null>;
863
868
  readonly fontSize?: (("xsmall" | "small" | "medium" | "large" | "xlarge") | {
864
869
  mobile?: ("xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
865
870
  tablet?: ("xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
866
871
  desktop?: ("xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
867
872
  wide?: ("xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
868
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, ("xsmall" | "small" | "medium" | "large" | "xlarge") | null>;
873
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, ("xsmall" | "small" | "medium" | "large" | "xlarge") | null>;
869
874
  readonly gap?: (("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | {
870
875
  mobile?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
871
876
  tablet?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
872
877
  desktop?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
873
878
  wide?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
874
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | null>;
879
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | null>;
875
880
  readonly justifyContent?: ("center" | "flex-start" | "flex-end" | "space-between" | "space-around" | {
876
881
  mobile?: "center" | "flex-start" | "flex-end" | "space-between" | "space-around" | undefined;
877
882
  tablet?: "center" | "flex-start" | "flex-end" | "space-between" | "space-around" | undefined;
878
883
  desktop?: "center" | "flex-start" | "flex-end" | "space-between" | "space-around" | undefined;
879
884
  wide?: "center" | "flex-start" | "flex-end" | "space-between" | "space-around" | undefined;
880
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, "center" | "flex-start" | "flex-end" | "space-between" | "space-around" | null>;
885
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, "center" | "flex-start" | "flex-end" | "space-between" | "space-around" | null>;
881
886
  readonly marginBlockStart?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | {
882
887
  mobile?: "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | undefined;
883
888
  tablet?: "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | undefined;
884
889
  desktop?: "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | undefined;
885
890
  wide?: "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | undefined;
886
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | null>;
891
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | null>;
887
892
  readonly marginBlockEnd?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | {
888
893
  mobile?: "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | undefined;
889
894
  tablet?: "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | undefined;
890
895
  desktop?: "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | undefined;
891
896
  wide?: "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | undefined;
892
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | null>;
897
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | null>;
893
898
  readonly marginInlineStart?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | {
894
899
  mobile?: "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | undefined;
895
900
  tablet?: "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | undefined;
896
901
  desktop?: "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | undefined;
897
902
  wide?: "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | undefined;
898
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | null>;
903
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | null>;
899
904
  readonly marginInlineEnd?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | {
900
905
  mobile?: "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | undefined;
901
906
  tablet?: "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | undefined;
902
907
  desktop?: "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | undefined;
903
908
  wide?: "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | undefined;
904
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | null>;
909
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | null>;
905
910
  readonly outline?: ("none" | {
906
911
  mobile?: "none" | undefined;
907
912
  tablet?: "none" | undefined;
908
913
  desktop?: "none" | undefined;
909
914
  wide?: "none" | undefined;
910
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, "none" | null>;
915
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, "none" | null>;
911
916
  readonly padding?: (("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | {
912
917
  mobile?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
913
918
  tablet?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
914
919
  desktop?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
915
920
  wide?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
916
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | null>;
921
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | null>;
917
922
  readonly paddingBlock?: (("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | {
918
923
  mobile?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
919
924
  tablet?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
920
925
  desktop?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
921
926
  wide?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
922
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | null>;
927
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | null>;
923
928
  readonly paddingBlockStart?: (("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | {
924
929
  mobile?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
925
930
  tablet?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
926
931
  desktop?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
927
932
  wide?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
928
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | null>;
933
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | null>;
929
934
  readonly paddingBlockEnd?: (("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | {
930
935
  mobile?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
931
936
  tablet?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
932
937
  desktop?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
933
938
  wide?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
934
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | null>;
939
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | null>;
935
940
  readonly paddingInline?: (("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | {
936
941
  mobile?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
937
942
  tablet?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
938
943
  desktop?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
939
944
  wide?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
940
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | null>;
945
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | null>;
941
946
  readonly paddingInlineStart?: (("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | {
942
947
  mobile?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
943
948
  tablet?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
944
949
  desktop?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
945
950
  wide?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
946
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | null>;
951
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | null>;
947
952
  readonly paddingInlineEnd?: (("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | {
948
953
  mobile?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
949
954
  tablet?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
950
955
  desktop?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
951
956
  wide?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
952
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | null>;
957
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | null>;
953
958
  readonly position?: ("relative" | "fixed" | "absolute" | "sticky" | "static" | {
954
959
  mobile?: "relative" | "fixed" | "absolute" | "sticky" | "static" | undefined;
955
960
  tablet?: "relative" | "fixed" | "absolute" | "sticky" | "static" | undefined;
956
961
  desktop?: "relative" | "fixed" | "absolute" | "sticky" | "static" | undefined;
957
962
  wide?: "relative" | "fixed" | "absolute" | "sticky" | "static" | undefined;
958
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, "relative" | "fixed" | "absolute" | "sticky" | "static" | null>;
963
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, "relative" | "fixed" | "absolute" | "sticky" | "static" | null>;
959
964
  readonly rowGap?: (("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | {
960
965
  mobile?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
961
966
  tablet?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
962
967
  desktop?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
963
968
  wide?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | undefined;
964
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | null>;
969
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge") | null>;
965
970
  readonly textAlign?: ("left" | "right" | "center" | "justify" | {
966
971
  mobile?: "left" | "right" | "center" | "justify" | undefined;
967
972
  tablet?: "left" | "right" | "center" | "justify" | undefined;
968
973
  desktop?: "left" | "right" | "center" | "justify" | undefined;
969
974
  wide?: "left" | "right" | "center" | "justify" | undefined;
970
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, "left" | "right" | "center" | "justify" | null>;
975
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, "left" | "right" | "center" | "justify" | null>;
971
976
  margin?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | {
972
977
  mobile?: "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | undefined;
973
978
  tablet?: "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | undefined;
974
979
  desktop?: "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | undefined;
975
980
  wide?: "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | undefined;
976
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | null>;
981
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | null>;
977
982
  marginBlock?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | {
978
983
  mobile?: "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | undefined;
979
984
  tablet?: "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | undefined;
980
985
  desktop?: "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | undefined;
981
986
  wide?: "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | undefined;
982
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | null>;
987
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | null>;
983
988
  marginInline?: ("none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | {
984
989
  mobile?: "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | undefined;
985
990
  tablet?: "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | undefined;
986
991
  desktop?: "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | undefined;
987
992
  wide?: "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | undefined;
988
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | null>;
993
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, "none" | "gutter" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "auto" | null>;
989
994
  placeItems?: ("center" | "flex-start" | "flex-end" | {
990
995
  mobile?: "center" | "flex-start" | "flex-end" | undefined;
991
996
  tablet?: "center" | "flex-start" | "flex-end" | undefined;
992
997
  desktop?: "center" | "flex-start" | "flex-end" | undefined;
993
998
  wide?: "center" | "flex-start" | "flex-end" | undefined;
994
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, "center" | "flex-start" | "flex-end" | null>;
999
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<1 | 2 | 3 | 4, "center" | "flex-start" | "flex-end" | null>;
995
1000
  } & HTMLElementProps<HTMLDivElement> & react.RefAttributes<unknown>>;
996
1001
 
997
1002
  declare const justifyContentMap: {
@@ -1174,4 +1179,4 @@ declare const classnames: (...args: Args[]) => string | undefined;
1174
1179
 
1175
1180
  declare const momotaro: Theme;
1176
1181
 
1177
- export { BlocksProvider, type BlocksProviderProps, Box, type BoxProps, Button, type ButtonProps, Checkbox, type CheckboxProps, Dialog, type DialogProps, Divider, type DividerProps, Heading, type HeadingProps, Inline, type InlineProps, Input, type InputProps, Label, type LabelProps, Link, type LinkProps, Portal, type PortalProps, Progress, type ProgressProps, Radio, type RadioProps, Select, type SelectProps, Slider, type SliderProps, Spinner, type SpinnerProps, Stack, type StackProps, Switch, type SwitchProps, Text, type TextProps, type ThemeComponentsStyles, type ThemeTokens, Tooltip, type TooltipProps, atoms, classnames, createAsChildTemplate, makeComponentTheme, makeTheme, minMediaQuery, momotaro, style, useComponentStyleDefaultProps, useComponentStyles, useIsomorphicLayoutEffect, useKeyboard, usePreventBodyScroll, useRootAriaHidden, vars };
1182
+ export { BlocksProvider, type BlocksProviderProps, Box, type BoxProps, Button, type ButtonProps, Checkbox, type CheckboxProps, Dialog, type DialogProps, Divider, type DividerProps, Heading, type HeadingProps, Inline, type InlineProps, Input, type InputProps, Label, type LabelProps, Link, type LinkProps, Portal, type PortalProps, Progress, type ProgressProps, Radio, type RadioProps, Select, type SelectProps, Slider, type SliderProps, Spinner, type SpinnerProps, Stack, type StackProps, Switch, type SwitchProps, Text, type TextProps, type ThemeComponentsStyles, type ThemeTokens, Tooltip, type TooltipProps, VisuallyHidden, type VisuallyHiddenProps, atoms, classnames, createAsChildTemplate, makeComponentTheme, makeTheme, minMediaQuery, momotaro, style, useComponentStyleDefaultProps, useComponentStyles, useIsomorphicLayoutEffect, useKeyboard, usePreventBodyScroll, useRootAriaHidden, vars };
package/dist/styles/components/Accessibility/VisuallyHidden/VisuallyHidden.cjs ADDED
@@ -0,0 +1,7 @@
1
+ "use strict";
2
+ const jsxRuntime = require("react/jsx-runtime");
3
+ const styles_components_Accessibility_VisuallyHidden_visuallyHidden_css_cjs = require("./visually-hidden.css.cjs");
4
+ const VisuallyHidden = ({ children }) => {
5
+ return /* @__PURE__ */ jsxRuntime.jsx("span", { className: styles_components_Accessibility_VisuallyHidden_visuallyHidden_css_cjs.visuallyHidden, children });
6
+ };
7
+ exports.VisuallyHidden = VisuallyHidden;
package/dist/styles/components/Accessibility/VisuallyHidden/VisuallyHidden.mjs ADDED
@@ -0,0 +1,8 @@
1
+ import { jsx } from "react/jsx-runtime";
2
+ import { visuallyHidden } from "./visually-hidden.css.mjs";
3
+ const VisuallyHidden = ({ children }) => {
4
+ return /* @__PURE__ */ jsx("span", { className: visuallyHidden, children });
5
+ };
6
+ export {
7
+ VisuallyHidden
8
+ };
package/dist/styles/components/Accessibility/VisuallyHidden/visually-hidden.css.cjs ADDED
@@ -0,0 +1,15 @@
1
+ "use strict";
2
+ const fileScope = require("@vanilla-extract/css/fileScope");
3
+ const css = require("@vanilla-extract/css");
4
+ fileScope.setFileScope("src/components/Accessibility/VisuallyHidden/visually-hidden.css.ts", "@blockle/blocks");
5
+ const visuallyHidden = css.style({
6
+ clip: "rect(0 0 0 0)",
7
+ clipPath: "inset(50%)",
8
+ height: "1px",
9
+ overflow: "hidden",
10
+ position: "absolute",
11
+ whiteSpace: "nowrap",
12
+ width: "1px"
13
+ }, "visuallyHidden");
14
+ fileScope.endFileScope();
15
+ exports.visuallyHidden = visuallyHidden;
package/dist/styles/components/Accessibility/VisuallyHidden/visually-hidden.css.mjs ADDED
@@ -0,0 +1,16 @@
1
+ import { setFileScope, endFileScope } from "@vanilla-extract/css/fileScope";
2
+ import { style } from "@vanilla-extract/css";
3
+ setFileScope("src/components/Accessibility/VisuallyHidden/visually-hidden.css.ts", "@blockle/blocks");
4
+ const visuallyHidden = style({
5
+ clip: "rect(0 0 0 0)",
6
+ clipPath: "inset(50%)",
7
+ height: "1px",
8
+ overflow: "hidden",
9
+ position: "absolute",
10
+ whiteSpace: "nowrap",
11
+ width: "1px"
12
+ }, "visuallyHidden");
13
+ endFileScope();
14
+ export {
15
+ visuallyHidden
16
+ };
package/dist/styles/components/form/Checkbox/Checkbox.cjs CHANGED
@@ -27,7 +27,7 @@ const Label = ({
27
27
  }
28
28
  );
29
29
  };
30
- const Checkbox = react.forwardRef(function Checkbox2({ name, label, required, className, ...restProps }, ref) {
30
+ const Checkbox = react.forwardRef(function Checkbox2({ name, children, required, className, ...restProps }, ref) {
31
31
  const containerClassName = styles_components_display_Divider_Divider_cjs.useComponentStyles("checkbox", { base: true }, false);
32
32
  const iconClassName = styles_components_display_Divider_Divider_cjs.useComponentStyles("checkbox", { icon: true }, false);
33
33
  const labelClassName = styles_components_display_Divider_Divider_cjs.useComponentStyles("checkbox", { label: true }, false);
@@ -35,12 +35,12 @@ const Checkbox = react.forwardRef(function Checkbox2({ name, label, required, cl
35
35
  /* @__PURE__ */ jsxRuntime.jsx("input", { ref, type: "checkbox", name, className: styles_components_form_Checkbox_checkbox_css_cjs.input, ...restProps }),
36
36
  /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles_components_display_Divider_Divider_cjs.classnames(styles_components_form_Checkbox_checkbox_css_cjs.icon, iconClassName), role: "presentation", "aria-hidden": true, children: /* @__PURE__ */ jsxRuntime.jsx(DefaultIcon, {}) })
37
37
  ] });
38
- if (!label) {
38
+ if (!children) {
39
39
  return input;
40
40
  }
41
41
  return /* @__PURE__ */ jsxRuntime.jsxs("label", { className: labelClassName, children: [
42
42
  input,
43
- label && /* @__PURE__ */ jsxRuntime.jsx(Label, { asSpan: true, required, children: label })
43
+ children && /* @__PURE__ */ jsxRuntime.jsx(Label, { asSpan: true, required, children })
44
44
  ] });
45
45
  });
46
46
  const DefaultIcon = () => {
package/dist/styles/components/form/Checkbox/Checkbox.mjs CHANGED
@@ -26,7 +26,7 @@ const Label = ({
26
26
  }
27
27
  );
28
28
  };
29
- const Checkbox = forwardRef(function Checkbox2({ name, label, required, className, ...restProps }, ref) {
29
+ const Checkbox = forwardRef(function Checkbox2({ name, children, required, className, ...restProps }, ref) {
30
30
  const containerClassName = useComponentStyles("checkbox", { base: true }, false);
31
31
  const iconClassName = useComponentStyles("checkbox", { icon: true }, false);
32
32
  const labelClassName = useComponentStyles("checkbox", { label: true }, false);
@@ -34,12 +34,12 @@ const Checkbox = forwardRef(function Checkbox2({ name, label, required, classNam
34
34
  /* @__PURE__ */ jsx("input", { ref, type: "checkbox", name, className: input, ...restProps }),
35
35
  /* @__PURE__ */ jsx("div", { className: classnames(icon, iconClassName), role: "presentation", "aria-hidden": true, children: /* @__PURE__ */ jsx(DefaultIcon, {}) })
36
36
  ] });
37
- if (!label) {
37
+ if (!children) {
38
38
  return input$1;
39
39
  }
40
40
  return /* @__PURE__ */ jsxs("label", { className: labelClassName, children: [
41
41
  input$1,
42
- label && /* @__PURE__ */ jsx(Label, { asSpan: true, required, children: label })
42
+ children && /* @__PURE__ */ jsx(Label, { asSpan: true, required, children })
43
43
  ] });
44
44
  });
45
45
  const DefaultIcon = () => {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@blockle/blocks",
3
- "version": "0.16.1",
3
+ "version": "0.18.0",
4
4
  "description": "Blocks design system",
5
5
  "repository": "git@github.com:Blockle/blocks.git",
6
6
  "license": "MIT",