@octavius2929-personal/design-system 0.7.1 → 0.8.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 (9) hide show
  1. package/dist/index.cjs +307 -278
  2. package/dist/index.cjs.map +1 -1
  3. package/dist/index.css +684 -115
  4. package/dist/index.css.map +1 -1
  5. package/dist/index.d.cts +100 -51
  6. package/dist/index.d.ts +100 -51
  7. package/dist/index.js +269 -241
  8. package/dist/index.js.map +1 -1
  9. package/package.json +4 -1
package/dist/index.d.cts CHANGED
@@ -94,16 +94,16 @@ declare const tintaSchema: {
94
94
  };
95
95
  };
96
96
  space: {
97
- readonly none: "0";
98
- readonly xs: "0.25rem";
99
- readonly sm: "0.5rem";
100
- readonly md: "0.75rem";
101
- readonly lg: "1rem";
102
- readonly xl: "1.5rem";
103
- readonly "2xl": "2rem";
104
- readonly "3xl": "3rem";
105
- readonly "4xl": "4rem";
106
- readonly "5xl": "6rem";
97
+ readonly s0: "0";
98
+ readonly s1: "0.25rem";
99
+ readonly s2: "0.5rem";
100
+ readonly s3: "0.75rem";
101
+ readonly s4: "1rem";
102
+ readonly s5: "1.5rem";
103
+ readonly s6: "2rem";
104
+ readonly s7: "3rem";
105
+ readonly s8: "4rem";
106
+ readonly s9: "6rem";
107
107
  };
108
108
  radius: {
109
109
  readonly none: "0px";
@@ -238,16 +238,16 @@ declare const tintaSchema: {
238
238
  };
239
239
  };
240
240
  space: {
241
- readonly none: "0";
242
- readonly xs: "0.25rem";
243
- readonly sm: "0.5rem";
244
- readonly md: "0.75rem";
245
- readonly lg: "1rem";
246
- readonly xl: "1.5rem";
247
- readonly "2xl": "2rem";
248
- readonly "3xl": "3rem";
249
- readonly "4xl": "4rem";
250
- readonly "5xl": "6rem";
241
+ readonly s0: "0";
242
+ readonly s1: "0.25rem";
243
+ readonly s2: "0.5rem";
244
+ readonly s3: "0.75rem";
245
+ readonly s4: "1rem";
246
+ readonly s5: "1.5rem";
247
+ readonly s6: "2rem";
248
+ readonly s7: "3rem";
249
+ readonly s8: "4rem";
250
+ readonly s9: "6rem";
251
251
  };
252
252
  radius: {
253
253
  readonly none: "0px";
@@ -382,16 +382,16 @@ declare const tintaSchema: {
382
382
  };
383
383
  };
384
384
  space: {
385
- readonly none: "0";
386
- readonly xs: "0.25rem";
387
- readonly sm: "0.5rem";
388
- readonly md: "0.75rem";
389
- readonly lg: "1rem";
390
- readonly xl: "1.5rem";
391
- readonly "2xl": "2rem";
392
- readonly "3xl": "3rem";
393
- readonly "4xl": "4rem";
394
- readonly "5xl": "6rem";
385
+ readonly s0: "0";
386
+ readonly s1: "0.25rem";
387
+ readonly s2: "0.5rem";
388
+ readonly s3: "0.75rem";
389
+ readonly s4: "1rem";
390
+ readonly s5: "1.5rem";
391
+ readonly s6: "2rem";
392
+ readonly s7: "3rem";
393
+ readonly s8: "4rem";
394
+ readonly s9: "6rem";
395
395
  };
396
396
  radius: {
397
397
  readonly none: "0px";
@@ -526,16 +526,16 @@ declare const tintaSchema: {
526
526
  };
527
527
  };
528
528
  space: {
529
- readonly none: "0";
530
- readonly xs: "0.25rem";
531
- readonly sm: "0.5rem";
532
- readonly md: "0.75rem";
533
- readonly lg: "1rem";
534
- readonly xl: "1.5rem";
535
- readonly "2xl": "2rem";
536
- readonly "3xl": "3rem";
537
- readonly "4xl": "4rem";
538
- readonly "5xl": "6rem";
529
+ readonly s0: "0";
530
+ readonly s1: "0.25rem";
531
+ readonly s2: "0.5rem";
532
+ readonly s3: "0.75rem";
533
+ readonly s4: "1rem";
534
+ readonly s5: "1.5rem";
535
+ readonly s6: "2rem";
536
+ readonly s7: "3rem";
537
+ readonly s8: "4rem";
538
+ readonly s9: "6rem";
539
539
  };
540
540
  radius: {
541
541
  readonly none: "0px";
@@ -703,16 +703,16 @@ declare const vars: {
703
703
  readonly bold: `var(--${string})`;
704
704
  };
705
705
  space: {
706
- readonly none: `var(--${string})`;
707
- readonly xs: `var(--${string})`;
708
- readonly sm: `var(--${string})`;
709
- readonly md: `var(--${string})`;
710
- readonly lg: `var(--${string})`;
711
- readonly xl: `var(--${string})`;
712
- readonly "2xl": `var(--${string})`;
713
- readonly "3xl": `var(--${string})`;
714
- readonly "4xl": `var(--${string})`;
715
- readonly "5xl": `var(--${string})`;
706
+ readonly s0: `var(--${string})`;
707
+ readonly s1: `var(--${string})`;
708
+ readonly s2: `var(--${string})`;
709
+ readonly s3: `var(--${string})`;
710
+ readonly s4: `var(--${string})`;
711
+ readonly s5: `var(--${string})`;
712
+ readonly s6: `var(--${string})`;
713
+ readonly s7: `var(--${string})`;
714
+ readonly s8: `var(--${string})`;
715
+ readonly s9: `var(--${string})`;
716
716
  };
717
717
  radius: {
718
718
  readonly none: `var(--${string})`;
@@ -758,6 +758,55 @@ declare function usePrevious<T>(value: T, initial?: T): T | undefined;
758
758
 
759
759
  declare function useToggle(initial?: boolean): readonly [boolean, () => void, (value: boolean) => void];
760
760
 
761
+ declare const sprinkles: ((props: {
762
+ padding?: "s0" | "s1" | "s2" | "s3" | "s4" | "s5" | "s6" | "s7" | "s8" | "s9" | undefined;
763
+ paddingTop?: "s0" | "s1" | "s2" | "s3" | "s4" | "s5" | "s6" | "s7" | "s8" | "s9" | undefined;
764
+ paddingRight?: "s0" | "s1" | "s2" | "s3" | "s4" | "s5" | "s6" | "s7" | "s8" | "s9" | undefined;
765
+ paddingBottom?: "s0" | "s1" | "s2" | "s3" | "s4" | "s5" | "s6" | "s7" | "s8" | "s9" | undefined;
766
+ paddingLeft?: "s0" | "s1" | "s2" | "s3" | "s4" | "s5" | "s6" | "s7" | "s8" | "s9" | undefined;
767
+ marginTop?: "s0" | "s1" | "s2" | "s3" | "s4" | "s5" | "s6" | "s7" | "s8" | "s9" | undefined;
768
+ marginRight?: "s0" | "s1" | "s2" | "s3" | "s4" | "s5" | "s6" | "s7" | "s8" | "s9" | undefined;
769
+ marginBottom?: "s0" | "s1" | "s2" | "s3" | "s4" | "s5" | "s6" | "s7" | "s8" | "s9" | undefined;
770
+ marginLeft?: "s0" | "s1" | "s2" | "s3" | "s4" | "s5" | "s6" | "s7" | "s8" | "s9" | undefined;
771
+ gap?: "s0" | "s1" | "s2" | "s3" | "s4" | "s5" | "s6" | "s7" | "s8" | "s9" | undefined;
772
+ rowGap?: "s0" | "s1" | "s2" | "s3" | "s4" | "s5" | "s6" | "s7" | "s8" | "s9" | undefined;
773
+ columnGap?: "s0" | "s1" | "s2" | "s3" | "s4" | "s5" | "s6" | "s7" | "s8" | "s9" | undefined;
774
+ background?: "bg1" | "bg2" | "bg3" | "bgInset" | "fg1" | "fg2" | "fg3" | "fgOnAccent" | "border1" | "border2" | "borderStrong" | "accent" | "accentHover" | "accentSoft" | "ok" | "warn" | "danger" | "info" | "focus" | "scrim" | undefined;
775
+ color?: "bg1" | "bg2" | "bg3" | "bgInset" | "fg1" | "fg2" | "fg3" | "fgOnAccent" | "border1" | "border2" | "borderStrong" | "accent" | "accentHover" | "accentSoft" | "ok" | "warn" | "danger" | "info" | "focus" | "scrim" | undefined;
776
+ borderRadius?: "none" | "sm" | "md" | "lg" | "base" | "full" | undefined;
777
+ display?: "none" | "flex" | "grid" | "block" | "inline-block" | "inline-flex" | undefined;
778
+ flexDirection?: "column" | "column-reverse" | "row" | "row-reverse" | undefined;
779
+ alignItems?: "center" | "stretch" | "flex-end" | "flex-start" | "baseline" | undefined;
780
+ justifyContent?: "center" | "space-around" | "space-between" | "space-evenly" | "flex-end" | "flex-start" | undefined;
781
+ flexWrap?: "nowrap" | "wrap" | undefined;
782
+ p?: "s0" | "s1" | "s2" | "s3" | "s4" | "s5" | "s6" | "s7" | "s8" | "s9" | undefined;
783
+ px?: "s0" | "s1" | "s2" | "s3" | "s4" | "s5" | "s6" | "s7" | "s8" | "s9" | undefined;
784
+ py?: "s0" | "s1" | "s2" | "s3" | "s4" | "s5" | "s6" | "s7" | "s8" | "s9" | undefined;
785
+ pt?: "s0" | "s1" | "s2" | "s3" | "s4" | "s5" | "s6" | "s7" | "s8" | "s9" | undefined;
786
+ pr?: "s0" | "s1" | "s2" | "s3" | "s4" | "s5" | "s6" | "s7" | "s8" | "s9" | undefined;
787
+ pb?: "s0" | "s1" | "s2" | "s3" | "s4" | "s5" | "s6" | "s7" | "s8" | "s9" | undefined;
788
+ pl?: "s0" | "s1" | "s2" | "s3" | "s4" | "s5" | "s6" | "s7" | "s8" | "s9" | undefined;
789
+ m?: "s0" | "s1" | "s2" | "s3" | "s4" | "s5" | "s6" | "s7" | "s8" | "s9" | undefined;
790
+ mx?: "s0" | "s1" | "s2" | "s3" | "s4" | "s5" | "s6" | "s7" | "s8" | "s9" | undefined;
791
+ my?: "s0" | "s1" | "s2" | "s3" | "s4" | "s5" | "s6" | "s7" | "s8" | "s9" | undefined;
792
+ mt?: "s0" | "s1" | "s2" | "s3" | "s4" | "s5" | "s6" | "s7" | "s8" | "s9" | undefined;
793
+ mr?: "s0" | "s1" | "s2" | "s3" | "s4" | "s5" | "s6" | "s7" | "s8" | "s9" | undefined;
794
+ mb?: "s0" | "s1" | "s2" | "s3" | "s4" | "s5" | "s6" | "s7" | "s8" | "s9" | undefined;
795
+ ml?: "s0" | "s1" | "s2" | "s3" | "s4" | "s5" | "s6" | "s7" | "s8" | "s9" | undefined;
796
+ bg?: "bg1" | "bg2" | "bg3" | "bgInset" | "fg1" | "fg2" | "fg3" | "fgOnAccent" | "border1" | "border2" | "borderStrong" | "accent" | "accentHover" | "accentSoft" | "ok" | "warn" | "danger" | "info" | "focus" | "scrim" | undefined;
797
+ radius?: "none" | "sm" | "md" | "lg" | "base" | "full" | undefined;
798
+ }) => string) & {
799
+ properties: Set<"display" | "radius" | "alignItems" | "color" | "columnGap" | "flexDirection" | "flexWrap" | "justifyContent" | "marginBottom" | "marginLeft" | "marginRight" | "marginTop" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "rowGap" | "background" | "borderRadius" | "gap" | "padding" | "p" | "px" | "py" | "pt" | "pr" | "pb" | "pl" | "m" | "mx" | "my" | "mt" | "mr" | "mb" | "ml" | "bg">;
800
+ };
801
+ type Sprinkles = Parameters<typeof sprinkles>[0];
802
+
803
+ type ContainerOwnProps<E extends ElementType> = Sprinkles & {
804
+ as?: E;
805
+ };
806
+ type ContainerProps<E extends ElementType = "div"> = ContainerOwnProps<E> & Omit<ComponentPropsWithoutRef<E>, "className" | "style" | "color" | keyof ContainerOwnProps<E>>;
807
+
808
+ declare function Container<E extends ElementType = "div">({ as, ...props }: ContainerProps<E>): react.JSX.Element;
809
+
761
810
  type TypographyVariant = "display" | "h1" | "h2" | "h3" | "h4" | "body" | "lead" | "small" | "caption" | "eyebrow" | "code" | "blackletter";
762
811
  type TypographyColor = "fg1" | "fg2" | "fg3" | "accent" | "danger" | "ok" | "warn" | "info";
763
812
  type TypographyAlign = "left" | "center" | "right";
@@ -1160,4 +1209,4 @@ interface ThemeProviderProps {
1160
1209
  declare function ThemeProvider({ children, defaultSchema, defaultMode, storageKey, persist, }: ThemeProviderProps): react.JSX.Element;
1161
1210
  declare function useTheme(): ThemeContextValue;
1162
1211
 
1163
- export { Accordion, type AccordionItem, type AccordionProps, Alert, type AlertProps, type AlertSeverity, AppBar, type AppBarProps, Avatar, type AvatarProps, type AvatarSize, Badge, type BadgeProps, type BadgeTone, Breadcrumbs, type BreadcrumbsProps, Button, type ButtonProps, type ButtonSize, type ButtonTone, type ButtonVariant, Card, type CardProps, type CardSectionProps, CheckIcon, Checkbox, type CheckboxProps, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, Chip, type ChipProps, type ChipTone, CircleCheckIcon, CircleXIcon, type ColorTokens, type Crumb, Dialog, type DialogProps, Divider, type DividerProps, EyeIcon, EyeOffIcon, type Icon, IconButton, type IconButtonProps, type IconButtonTone, type IconProps, InfoIcon, ListItem, type ListItemProps, Menu, type MenuItemDef, type MenuProps, MinusIcon, type Mode, type ModePreference, MoneyField, type MoneyFieldProps, MoreHorizontalIcon, Pagination, type PaginationProps, PasswordField, type PasswordFieldProps, PlusIcon, Progress, type ProgressProps, type ProgressVariant, Radio, type RadioProps, type SchemaName, SearchIcon, Select, type SelectOption, type SelectProps, Slider, type SliderProps, Snackbar, type SnackbarProps, type Step, Stepper, type StepperProps, Switch, type SwitchProps, type TabItem, Table, type TableColumn, type TableProps, Tabs, type TabsProps, TextField, type TextFieldProps, ThemeProvider, type ThemeProviderProps, Tooltip, type TooltipPlacement, type TooltipProps, TriangleAlertIcon, Typography, type TypographyAlign, type TypographyColor, type TypographyProps, type TypographyVariant, XIcon, colorVars, modeNames, schemaNames, text, vars as theme, themes, usePrevious, useTheme, useToggle };
1212
+ export { Accordion, type AccordionItem, type AccordionProps, Alert, type AlertProps, type AlertSeverity, AppBar, type AppBarProps, Avatar, type AvatarProps, type AvatarSize, Badge, type BadgeProps, type BadgeTone, Breadcrumbs, type BreadcrumbsProps, Button, type ButtonProps, type ButtonSize, type ButtonTone, type ButtonVariant, Card, type CardProps, type CardSectionProps, CheckIcon, Checkbox, type CheckboxProps, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, Chip, type ChipProps, type ChipTone, CircleCheckIcon, CircleXIcon, type ColorTokens, Container, type ContainerProps, type Crumb, Dialog, type DialogProps, Divider, type DividerProps, EyeIcon, EyeOffIcon, type Icon, IconButton, type IconButtonProps, type IconButtonTone, type IconProps, InfoIcon, ListItem, type ListItemProps, Menu, type MenuItemDef, type MenuProps, MinusIcon, type Mode, type ModePreference, MoneyField, type MoneyFieldProps, MoreHorizontalIcon, Pagination, type PaginationProps, PasswordField, type PasswordFieldProps, PlusIcon, Progress, type ProgressProps, type ProgressVariant, Radio, type RadioProps, type SchemaName, SearchIcon, Select, type SelectOption, type SelectProps, Slider, type SliderProps, Snackbar, type SnackbarProps, type Step, Stepper, type StepperProps, Switch, type SwitchProps, type TabItem, Table, type TableColumn, type TableProps, Tabs, type TabsProps, TextField, type TextFieldProps, ThemeProvider, type ThemeProviderProps, Tooltip, type TooltipPlacement, type TooltipProps, TriangleAlertIcon, Typography, type TypographyAlign, type TypographyColor, type TypographyProps, type TypographyVariant, XIcon, colorVars, modeNames, schemaNames, text, vars as theme, themes, usePrevious, useTheme, useToggle };
package/dist/index.d.ts CHANGED
@@ -94,16 +94,16 @@ declare const tintaSchema: {
94
94
  };
95
95
  };
96
96
  space: {
97
- readonly none: "0";
98
- readonly xs: "0.25rem";
99
- readonly sm: "0.5rem";
100
- readonly md: "0.75rem";
101
- readonly lg: "1rem";
102
- readonly xl: "1.5rem";
103
- readonly "2xl": "2rem";
104
- readonly "3xl": "3rem";
105
- readonly "4xl": "4rem";
106
- readonly "5xl": "6rem";
97
+ readonly s0: "0";
98
+ readonly s1: "0.25rem";
99
+ readonly s2: "0.5rem";
100
+ readonly s3: "0.75rem";
101
+ readonly s4: "1rem";
102
+ readonly s5: "1.5rem";
103
+ readonly s6: "2rem";
104
+ readonly s7: "3rem";
105
+ readonly s8: "4rem";
106
+ readonly s9: "6rem";
107
107
  };
108
108
  radius: {
109
109
  readonly none: "0px";
@@ -238,16 +238,16 @@ declare const tintaSchema: {
238
238
  };
239
239
  };
240
240
  space: {
241
- readonly none: "0";
242
- readonly xs: "0.25rem";
243
- readonly sm: "0.5rem";
244
- readonly md: "0.75rem";
245
- readonly lg: "1rem";
246
- readonly xl: "1.5rem";
247
- readonly "2xl": "2rem";
248
- readonly "3xl": "3rem";
249
- readonly "4xl": "4rem";
250
- readonly "5xl": "6rem";
241
+ readonly s0: "0";
242
+ readonly s1: "0.25rem";
243
+ readonly s2: "0.5rem";
244
+ readonly s3: "0.75rem";
245
+ readonly s4: "1rem";
246
+ readonly s5: "1.5rem";
247
+ readonly s6: "2rem";
248
+ readonly s7: "3rem";
249
+ readonly s8: "4rem";
250
+ readonly s9: "6rem";
251
251
  };
252
252
  radius: {
253
253
  readonly none: "0px";
@@ -382,16 +382,16 @@ declare const tintaSchema: {
382
382
  };
383
383
  };
384
384
  space: {
385
- readonly none: "0";
386
- readonly xs: "0.25rem";
387
- readonly sm: "0.5rem";
388
- readonly md: "0.75rem";
389
- readonly lg: "1rem";
390
- readonly xl: "1.5rem";
391
- readonly "2xl": "2rem";
392
- readonly "3xl": "3rem";
393
- readonly "4xl": "4rem";
394
- readonly "5xl": "6rem";
385
+ readonly s0: "0";
386
+ readonly s1: "0.25rem";
387
+ readonly s2: "0.5rem";
388
+ readonly s3: "0.75rem";
389
+ readonly s4: "1rem";
390
+ readonly s5: "1.5rem";
391
+ readonly s6: "2rem";
392
+ readonly s7: "3rem";
393
+ readonly s8: "4rem";
394
+ readonly s9: "6rem";
395
395
  };
396
396
  radius: {
397
397
  readonly none: "0px";
@@ -526,16 +526,16 @@ declare const tintaSchema: {
526
526
  };
527
527
  };
528
528
  space: {
529
- readonly none: "0";
530
- readonly xs: "0.25rem";
531
- readonly sm: "0.5rem";
532
- readonly md: "0.75rem";
533
- readonly lg: "1rem";
534
- readonly xl: "1.5rem";
535
- readonly "2xl": "2rem";
536
- readonly "3xl": "3rem";
537
- readonly "4xl": "4rem";
538
- readonly "5xl": "6rem";
529
+ readonly s0: "0";
530
+ readonly s1: "0.25rem";
531
+ readonly s2: "0.5rem";
532
+ readonly s3: "0.75rem";
533
+ readonly s4: "1rem";
534
+ readonly s5: "1.5rem";
535
+ readonly s6: "2rem";
536
+ readonly s7: "3rem";
537
+ readonly s8: "4rem";
538
+ readonly s9: "6rem";
539
539
  };
540
540
  radius: {
541
541
  readonly none: "0px";
@@ -703,16 +703,16 @@ declare const vars: {
703
703
  readonly bold: `var(--${string})`;
704
704
  };
705
705
  space: {
706
- readonly none: `var(--${string})`;
707
- readonly xs: `var(--${string})`;
708
- readonly sm: `var(--${string})`;
709
- readonly md: `var(--${string})`;
710
- readonly lg: `var(--${string})`;
711
- readonly xl: `var(--${string})`;
712
- readonly "2xl": `var(--${string})`;
713
- readonly "3xl": `var(--${string})`;
714
- readonly "4xl": `var(--${string})`;
715
- readonly "5xl": `var(--${string})`;
706
+ readonly s0: `var(--${string})`;
707
+ readonly s1: `var(--${string})`;
708
+ readonly s2: `var(--${string})`;
709
+ readonly s3: `var(--${string})`;
710
+ readonly s4: `var(--${string})`;
711
+ readonly s5: `var(--${string})`;
712
+ readonly s6: `var(--${string})`;
713
+ readonly s7: `var(--${string})`;
714
+ readonly s8: `var(--${string})`;
715
+ readonly s9: `var(--${string})`;
716
716
  };
717
717
  radius: {
718
718
  readonly none: `var(--${string})`;
@@ -758,6 +758,55 @@ declare function usePrevious<T>(value: T, initial?: T): T | undefined;
758
758
 
759
759
  declare function useToggle(initial?: boolean): readonly [boolean, () => void, (value: boolean) => void];
760
760
 
761
+ declare const sprinkles: ((props: {
762
+ padding?: "s0" | "s1" | "s2" | "s3" | "s4" | "s5" | "s6" | "s7" | "s8" | "s9" | undefined;
763
+ paddingTop?: "s0" | "s1" | "s2" | "s3" | "s4" | "s5" | "s6" | "s7" | "s8" | "s9" | undefined;
764
+ paddingRight?: "s0" | "s1" | "s2" | "s3" | "s4" | "s5" | "s6" | "s7" | "s8" | "s9" | undefined;
765
+ paddingBottom?: "s0" | "s1" | "s2" | "s3" | "s4" | "s5" | "s6" | "s7" | "s8" | "s9" | undefined;
766
+ paddingLeft?: "s0" | "s1" | "s2" | "s3" | "s4" | "s5" | "s6" | "s7" | "s8" | "s9" | undefined;
767
+ marginTop?: "s0" | "s1" | "s2" | "s3" | "s4" | "s5" | "s6" | "s7" | "s8" | "s9" | undefined;
768
+ marginRight?: "s0" | "s1" | "s2" | "s3" | "s4" | "s5" | "s6" | "s7" | "s8" | "s9" | undefined;
769
+ marginBottom?: "s0" | "s1" | "s2" | "s3" | "s4" | "s5" | "s6" | "s7" | "s8" | "s9" | undefined;
770
+ marginLeft?: "s0" | "s1" | "s2" | "s3" | "s4" | "s5" | "s6" | "s7" | "s8" | "s9" | undefined;
771
+ gap?: "s0" | "s1" | "s2" | "s3" | "s4" | "s5" | "s6" | "s7" | "s8" | "s9" | undefined;
772
+ rowGap?: "s0" | "s1" | "s2" | "s3" | "s4" | "s5" | "s6" | "s7" | "s8" | "s9" | undefined;
773
+ columnGap?: "s0" | "s1" | "s2" | "s3" | "s4" | "s5" | "s6" | "s7" | "s8" | "s9" | undefined;
774
+ background?: "bg1" | "bg2" | "bg3" | "bgInset" | "fg1" | "fg2" | "fg3" | "fgOnAccent" | "border1" | "border2" | "borderStrong" | "accent" | "accentHover" | "accentSoft" | "ok" | "warn" | "danger" | "info" | "focus" | "scrim" | undefined;
775
+ color?: "bg1" | "bg2" | "bg3" | "bgInset" | "fg1" | "fg2" | "fg3" | "fgOnAccent" | "border1" | "border2" | "borderStrong" | "accent" | "accentHover" | "accentSoft" | "ok" | "warn" | "danger" | "info" | "focus" | "scrim" | undefined;
776
+ borderRadius?: "none" | "sm" | "md" | "lg" | "base" | "full" | undefined;
777
+ display?: "none" | "flex" | "grid" | "block" | "inline-block" | "inline-flex" | undefined;
778
+ flexDirection?: "column" | "column-reverse" | "row" | "row-reverse" | undefined;
779
+ alignItems?: "center" | "stretch" | "flex-end" | "flex-start" | "baseline" | undefined;
780
+ justifyContent?: "center" | "space-around" | "space-between" | "space-evenly" | "flex-end" | "flex-start" | undefined;
781
+ flexWrap?: "nowrap" | "wrap" | undefined;
782
+ p?: "s0" | "s1" | "s2" | "s3" | "s4" | "s5" | "s6" | "s7" | "s8" | "s9" | undefined;
783
+ px?: "s0" | "s1" | "s2" | "s3" | "s4" | "s5" | "s6" | "s7" | "s8" | "s9" | undefined;
784
+ py?: "s0" | "s1" | "s2" | "s3" | "s4" | "s5" | "s6" | "s7" | "s8" | "s9" | undefined;
785
+ pt?: "s0" | "s1" | "s2" | "s3" | "s4" | "s5" | "s6" | "s7" | "s8" | "s9" | undefined;
786
+ pr?: "s0" | "s1" | "s2" | "s3" | "s4" | "s5" | "s6" | "s7" | "s8" | "s9" | undefined;
787
+ pb?: "s0" | "s1" | "s2" | "s3" | "s4" | "s5" | "s6" | "s7" | "s8" | "s9" | undefined;
788
+ pl?: "s0" | "s1" | "s2" | "s3" | "s4" | "s5" | "s6" | "s7" | "s8" | "s9" | undefined;
789
+ m?: "s0" | "s1" | "s2" | "s3" | "s4" | "s5" | "s6" | "s7" | "s8" | "s9" | undefined;
790
+ mx?: "s0" | "s1" | "s2" | "s3" | "s4" | "s5" | "s6" | "s7" | "s8" | "s9" | undefined;
791
+ my?: "s0" | "s1" | "s2" | "s3" | "s4" | "s5" | "s6" | "s7" | "s8" | "s9" | undefined;
792
+ mt?: "s0" | "s1" | "s2" | "s3" | "s4" | "s5" | "s6" | "s7" | "s8" | "s9" | undefined;
793
+ mr?: "s0" | "s1" | "s2" | "s3" | "s4" | "s5" | "s6" | "s7" | "s8" | "s9" | undefined;
794
+ mb?: "s0" | "s1" | "s2" | "s3" | "s4" | "s5" | "s6" | "s7" | "s8" | "s9" | undefined;
795
+ ml?: "s0" | "s1" | "s2" | "s3" | "s4" | "s5" | "s6" | "s7" | "s8" | "s9" | undefined;
796
+ bg?: "bg1" | "bg2" | "bg3" | "bgInset" | "fg1" | "fg2" | "fg3" | "fgOnAccent" | "border1" | "border2" | "borderStrong" | "accent" | "accentHover" | "accentSoft" | "ok" | "warn" | "danger" | "info" | "focus" | "scrim" | undefined;
797
+ radius?: "none" | "sm" | "md" | "lg" | "base" | "full" | undefined;
798
+ }) => string) & {
799
+ properties: Set<"display" | "radius" | "alignItems" | "color" | "columnGap" | "flexDirection" | "flexWrap" | "justifyContent" | "marginBottom" | "marginLeft" | "marginRight" | "marginTop" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "rowGap" | "background" | "borderRadius" | "gap" | "padding" | "p" | "px" | "py" | "pt" | "pr" | "pb" | "pl" | "m" | "mx" | "my" | "mt" | "mr" | "mb" | "ml" | "bg">;
800
+ };
801
+ type Sprinkles = Parameters<typeof sprinkles>[0];
802
+
803
+ type ContainerOwnProps<E extends ElementType> = Sprinkles & {
804
+ as?: E;
805
+ };
806
+ type ContainerProps<E extends ElementType = "div"> = ContainerOwnProps<E> & Omit<ComponentPropsWithoutRef<E>, "className" | "style" | "color" | keyof ContainerOwnProps<E>>;
807
+
808
+ declare function Container<E extends ElementType = "div">({ as, ...props }: ContainerProps<E>): react.JSX.Element;
809
+
761
810
  type TypographyVariant = "display" | "h1" | "h2" | "h3" | "h4" | "body" | "lead" | "small" | "caption" | "eyebrow" | "code" | "blackletter";
762
811
  type TypographyColor = "fg1" | "fg2" | "fg3" | "accent" | "danger" | "ok" | "warn" | "info";
763
812
  type TypographyAlign = "left" | "center" | "right";
@@ -1160,4 +1209,4 @@ interface ThemeProviderProps {
1160
1209
  declare function ThemeProvider({ children, defaultSchema, defaultMode, storageKey, persist, }: ThemeProviderProps): react.JSX.Element;
1161
1210
  declare function useTheme(): ThemeContextValue;
1162
1211
 
1163
- export { Accordion, type AccordionItem, type AccordionProps, Alert, type AlertProps, type AlertSeverity, AppBar, type AppBarProps, Avatar, type AvatarProps, type AvatarSize, Badge, type BadgeProps, type BadgeTone, Breadcrumbs, type BreadcrumbsProps, Button, type ButtonProps, type ButtonSize, type ButtonTone, type ButtonVariant, Card, type CardProps, type CardSectionProps, CheckIcon, Checkbox, type CheckboxProps, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, Chip, type ChipProps, type ChipTone, CircleCheckIcon, CircleXIcon, type ColorTokens, type Crumb, Dialog, type DialogProps, Divider, type DividerProps, EyeIcon, EyeOffIcon, type Icon, IconButton, type IconButtonProps, type IconButtonTone, type IconProps, InfoIcon, ListItem, type ListItemProps, Menu, type MenuItemDef, type MenuProps, MinusIcon, type Mode, type ModePreference, MoneyField, type MoneyFieldProps, MoreHorizontalIcon, Pagination, type PaginationProps, PasswordField, type PasswordFieldProps, PlusIcon, Progress, type ProgressProps, type ProgressVariant, Radio, type RadioProps, type SchemaName, SearchIcon, Select, type SelectOption, type SelectProps, Slider, type SliderProps, Snackbar, type SnackbarProps, type Step, Stepper, type StepperProps, Switch, type SwitchProps, type TabItem, Table, type TableColumn, type TableProps, Tabs, type TabsProps, TextField, type TextFieldProps, ThemeProvider, type ThemeProviderProps, Tooltip, type TooltipPlacement, type TooltipProps, TriangleAlertIcon, Typography, type TypographyAlign, type TypographyColor, type TypographyProps, type TypographyVariant, XIcon, colorVars, modeNames, schemaNames, text, vars as theme, themes, usePrevious, useTheme, useToggle };
1212
+ export { Accordion, type AccordionItem, type AccordionProps, Alert, type AlertProps, type AlertSeverity, AppBar, type AppBarProps, Avatar, type AvatarProps, type AvatarSize, Badge, type BadgeProps, type BadgeTone, Breadcrumbs, type BreadcrumbsProps, Button, type ButtonProps, type ButtonSize, type ButtonTone, type ButtonVariant, Card, type CardProps, type CardSectionProps, CheckIcon, Checkbox, type CheckboxProps, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, Chip, type ChipProps, type ChipTone, CircleCheckIcon, CircleXIcon, type ColorTokens, Container, type ContainerProps, type Crumb, Dialog, type DialogProps, Divider, type DividerProps, EyeIcon, EyeOffIcon, type Icon, IconButton, type IconButtonProps, type IconButtonTone, type IconProps, InfoIcon, ListItem, type ListItemProps, Menu, type MenuItemDef, type MenuProps, MinusIcon, type Mode, type ModePreference, MoneyField, type MoneyFieldProps, MoreHorizontalIcon, Pagination, type PaginationProps, PasswordField, type PasswordFieldProps, PlusIcon, Progress, type ProgressProps, type ProgressVariant, Radio, type RadioProps, type SchemaName, SearchIcon, Select, type SelectOption, type SelectProps, Slider, type SliderProps, Snackbar, type SnackbarProps, type Step, Stepper, type StepperProps, Switch, type SwitchProps, type TabItem, Table, type TableColumn, type TableProps, Tabs, type TabsProps, TextField, type TextFieldProps, ThemeProvider, type ThemeProviderProps, Tooltip, type TooltipPlacement, type TooltipProps, TriangleAlertIcon, Typography, type TypographyAlign, type TypographyColor, type TypographyProps, type TypographyVariant, XIcon, colorVars, modeNames, schemaNames, text, vars as theme, themes, usePrevious, useTheme, useToggle };