@octavius2929-personal/design-system 0.4.0 → 0.5.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.d.ts CHANGED
@@ -122,14 +122,8 @@ declare const tintaSchema: {
122
122
  readonly tight: "-0.01em";
123
123
  readonly normal: "0";
124
124
  readonly wide: "0.04em";
125
- readonly wider: "0.14em";
126
- readonly widest: "0.28em";
127
- };
128
- leading: {
129
- readonly tight: "1.05";
130
- readonly snug: "1.2";
131
- readonly normal: "1.5";
132
- readonly relaxed: "1.7";
125
+ readonly wider: "0.1em";
126
+ readonly widest: "0.14em";
133
127
  };
134
128
  weight: {
135
129
  readonly light: "300";
@@ -272,14 +266,8 @@ declare const tintaSchema: {
272
266
  readonly tight: "-0.01em";
273
267
  readonly normal: "0";
274
268
  readonly wide: "0.04em";
275
- readonly wider: "0.14em";
276
- readonly widest: "0.28em";
277
- };
278
- leading: {
279
- readonly tight: "1.05";
280
- readonly snug: "1.2";
281
- readonly normal: "1.5";
282
- readonly relaxed: "1.7";
269
+ readonly wider: "0.1em";
270
+ readonly widest: "0.14em";
283
271
  };
284
272
  weight: {
285
273
  readonly light: "300";
@@ -422,14 +410,8 @@ declare const tintaSchema: {
422
410
  readonly tight: "-0.01em";
423
411
  readonly normal: "0";
424
412
  readonly wide: "0.04em";
425
- readonly wider: "0.14em";
426
- readonly widest: "0.28em";
427
- };
428
- leading: {
429
- readonly tight: "1.05";
430
- readonly snug: "1.2";
431
- readonly normal: "1.5";
432
- readonly relaxed: "1.7";
413
+ readonly wider: "0.1em";
414
+ readonly widest: "0.14em";
433
415
  };
434
416
  weight: {
435
417
  readonly light: "300";
@@ -572,14 +554,8 @@ declare const tintaSchema: {
572
554
  readonly tight: "-0.01em";
573
555
  readonly normal: "0";
574
556
  readonly wide: "0.04em";
575
- readonly wider: "0.14em";
576
- readonly widest: "0.28em";
577
- };
578
- leading: {
579
- readonly tight: "1.05";
580
- readonly snug: "1.2";
581
- readonly normal: "1.5";
582
- readonly relaxed: "1.7";
557
+ readonly wider: "0.1em";
558
+ readonly widest: "0.14em";
583
559
  };
584
560
  weight: {
585
561
  readonly light: "300";
@@ -758,12 +734,6 @@ declare const vars: {
758
734
  readonly wider: `var(--${string})`;
759
735
  readonly widest: `var(--${string})`;
760
736
  };
761
- leading: {
762
- readonly tight: `var(--${string})`;
763
- readonly snug: `var(--${string})`;
764
- readonly normal: `var(--${string})`;
765
- readonly relaxed: `var(--${string})`;
766
- };
767
737
  dur: {
768
738
  readonly fast: `var(--${string})`;
769
739
  readonly base: `var(--${string})`;
package/dist/index.js CHANGED
@@ -1,9 +1,9 @@
1
1
  // src/theme/theme.css.ts
2
- var colorVars = { bg1: "var(--bg1__e3grur2c)", bg2: "var(--bg2__e3grur2d)", bg3: "var(--bg3__e3grur2e)", bgInset: "var(--bgInset__e3grur2f)", fg1: "var(--fg1__e3grur2g)", fg2: "var(--fg2__e3grur2h)", fg3: "var(--fg3__e3grur2i)", fgOnAccent: "var(--fgOnAccent__e3grur2j)", border1: "var(--border1__e3grur2k)", border2: "var(--border2__e3grur2l)", borderStrong: "var(--borderStrong__e3grur2m)", accent: "var(--accent__e3grur2n)", accentHover: "var(--accentHover__e3grur2o)", accentSoft: "var(--accentSoft__e3grur2p)", ok: "var(--ok__e3grur2q)", warn: "var(--warn__e3grur2r)", danger: "var(--danger__e3grur2s)", info: "var(--info__e3grur2t)", focus: "var(--focus__e3grur2u)", scrim: "var(--scrim__e3grur2v)" };
2
+ var colorVars = { bg1: "var(--bg1__e3grur28)", bg2: "var(--bg2__e3grur29)", bg3: "var(--bg3__e3grur2a)", bgInset: "var(--bgInset__e3grur2b)", fg1: "var(--fg1__e3grur2c)", fg2: "var(--fg2__e3grur2d)", fg3: "var(--fg3__e3grur2e)", fgOnAccent: "var(--fgOnAccent__e3grur2f)", border1: "var(--border1__e3grur2g)", border2: "var(--border2__e3grur2h)", borderStrong: "var(--borderStrong__e3grur2i)", accent: "var(--accent__e3grur2j)", accentHover: "var(--accentHover__e3grur2k)", accentSoft: "var(--accentSoft__e3grur2l)", ok: "var(--ok__e3grur2m)", warn: "var(--warn__e3grur2n)", danger: "var(--danger__e3grur2o)", info: "var(--info__e3grur2p)", focus: "var(--focus__e3grur2q)", scrim: "var(--scrim__e3grur2r)" };
3
3
  var modeNames = ["light", "dark", "sepia", "contrast"];
4
4
  var schemaNames = ["tinta"];
5
- var themes = { tinta: { light: "theme_themes_tinta_light__e3grur2w", dark: "theme_themes_tinta_dark__e3grur2x", sepia: "theme_themes_tinta_sepia__e3grur2y", contrast: "theme_themes_tinta_contrast__e3grur2z" } };
6
- var vars = { font: { display: "var(--font-display__e3grur0)", text: "var(--font-text__e3grur1)", mono: "var(--font-mono__e3grur2)", black: "var(--font-black__e3grur3)" }, text: { eyebrow: { size: "var(--text-eyebrow-size__e3grur4)", lineHeight: "var(--text-eyebrow-lineHeight__e3grur5)", weight: "var(--text-eyebrow-weight__e3grur6)", letterSpacing: "var(--text-eyebrow-letterSpacing__e3grur7)" }, display: { size: "var(--text-display-size__e3grur8)", lineHeight: "var(--text-display-lineHeight__e3grur9)", weight: "var(--text-display-weight__e3grura)", letterSpacing: "var(--text-display-letterSpacing__e3grurb)" }, h1: { size: "var(--text-h1-size__e3grurc)", lineHeight: "var(--text-h1-lineHeight__e3grurd)", weight: "var(--text-h1-weight__e3grure)", letterSpacing: "var(--text-h1-letterSpacing__e3grurf)" }, h2: { size: "var(--text-h2-size__e3grurg)", lineHeight: "var(--text-h2-lineHeight__e3grurh)", weight: "var(--text-h2-weight__e3gruri)", letterSpacing: "var(--text-h2-letterSpacing__e3grurj)" }, h3: { size: "var(--text-h3-size__e3grurk)", lineHeight: "var(--text-h3-lineHeight__e3grurl)", weight: "var(--text-h3-weight__e3grurm)", letterSpacing: "var(--text-h3-letterSpacing__e3grurn)" }, h4: { size: "var(--text-h4-size__e3gruro)", lineHeight: "var(--text-h4-lineHeight__e3grurp)", weight: "var(--text-h4-weight__e3grurq)", letterSpacing: "var(--text-h4-letterSpacing__e3grurr)" }, body: { size: "var(--text-body-size__e3grurs)", lineHeight: "var(--text-body-lineHeight__e3grurt)", weight: "var(--text-body-weight__e3gruru)", letterSpacing: "var(--text-body-letterSpacing__e3grurv)" }, lead: { size: "var(--text-lead-size__e3grurw)", lineHeight: "var(--text-lead-lineHeight__e3grurx)", weight: "var(--text-lead-weight__e3grury)", letterSpacing: "var(--text-lead-letterSpacing__e3grurz)" }, small: { size: "var(--text-small-size__e3grur10)", lineHeight: "var(--text-small-lineHeight__e3grur11)", weight: "var(--text-small-weight__e3grur12)", letterSpacing: "var(--text-small-letterSpacing__e3grur13)" }, caption: { size: "var(--text-caption-size__e3grur14)", lineHeight: "var(--text-caption-lineHeight__e3grur15)", weight: "var(--text-caption-weight__e3grur16)", letterSpacing: "var(--text-caption-letterSpacing__e3grur17)" } }, space: { none: "var(--space-none__e3grur18)", xs: "var(--space-xs__e3grur19)", sm: "var(--space-sm__e3grur1a)", md: "var(--space-md__e3grur1b)", lg: "var(--space-lg__e3grur1c)", xl: "var(--space-xl__e3grur1d)", "2xl": "var(--space-2xl__e3grur1e)", "3xl": "var(--space-3xl__e3grur1f)", "4xl": "var(--space-4xl__e3grur1g)", "5xl": "var(--space-5xl__e3grur1h)" }, radius: { none: "var(--radius-none__e3grur1i)", sm: "var(--radius-sm__e3grur1j)", md: "var(--radius-md__e3grur1k)", lg: "var(--radius-lg__e3grur1l)", base: "var(--radius-base__e3grur1m)", full: "var(--radius-full__e3grur1n)" }, border: { hair: "var(--border-hair__e3grur1o)", rule: "var(--border-rule__e3grur1p)", heavy: "var(--border-heavy__e3grur1q)" }, tracking: { tight: "var(--tracking-tight__e3grur1r)", normal: "var(--tracking-normal__e3grur1s)", wide: "var(--tracking-wide__e3grur1t)", wider: "var(--tracking-wider__e3grur1u)", widest: "var(--tracking-widest__e3grur1v)" }, leading: { tight: "var(--leading-tight__e3grur1w)", snug: "var(--leading-snug__e3grur1x)", normal: "var(--leading-normal__e3grur1y)", relaxed: "var(--leading-relaxed__e3grur1z)" }, weight: { light: "var(--weight-light__e3grur20)", regular: "var(--weight-regular__e3grur21)", medium: "var(--weight-medium__e3grur22)", semibold: "var(--weight-semibold__e3grur23)", bold: "var(--weight-bold__e3grur24)" }, dur: { fast: "var(--dur-fast__e3grur25)", base: "var(--dur-base__e3grur26)", slow: "var(--dur-slow__e3grur27)" }, ease: { ink: "var(--ease-ink__e3grur28)" }, shadow: { sm: "var(--shadow-sm__e3grur29)", md: "var(--shadow-md__e3grur2a)", lg: "var(--shadow-lg__e3grur2b)" }, color: colorVars };
5
+ var themes = { tinta: { light: "theme_themes_tinta_light__e3grur2s", dark: "theme_themes_tinta_dark__e3grur2t", sepia: "theme_themes_tinta_sepia__e3grur2u", contrast: "theme_themes_tinta_contrast__e3grur2v" } };
6
+ var vars = { font: { display: "var(--font-display__e3grur0)", text: "var(--font-text__e3grur1)", mono: "var(--font-mono__e3grur2)", black: "var(--font-black__e3grur3)" }, text: { eyebrow: { size: "var(--text-eyebrow-size__e3grur4)", lineHeight: "var(--text-eyebrow-lineHeight__e3grur5)", weight: "var(--text-eyebrow-weight__e3grur6)", letterSpacing: "var(--text-eyebrow-letterSpacing__e3grur7)" }, display: { size: "var(--text-display-size__e3grur8)", lineHeight: "var(--text-display-lineHeight__e3grur9)", weight: "var(--text-display-weight__e3grura)", letterSpacing: "var(--text-display-letterSpacing__e3grurb)" }, h1: { size: "var(--text-h1-size__e3grurc)", lineHeight: "var(--text-h1-lineHeight__e3grurd)", weight: "var(--text-h1-weight__e3grure)", letterSpacing: "var(--text-h1-letterSpacing__e3grurf)" }, h2: { size: "var(--text-h2-size__e3grurg)", lineHeight: "var(--text-h2-lineHeight__e3grurh)", weight: "var(--text-h2-weight__e3gruri)", letterSpacing: "var(--text-h2-letterSpacing__e3grurj)" }, h3: { size: "var(--text-h3-size__e3grurk)", lineHeight: "var(--text-h3-lineHeight__e3grurl)", weight: "var(--text-h3-weight__e3grurm)", letterSpacing: "var(--text-h3-letterSpacing__e3grurn)" }, h4: { size: "var(--text-h4-size__e3gruro)", lineHeight: "var(--text-h4-lineHeight__e3grurp)", weight: "var(--text-h4-weight__e3grurq)", letterSpacing: "var(--text-h4-letterSpacing__e3grurr)" }, body: { size: "var(--text-body-size__e3grurs)", lineHeight: "var(--text-body-lineHeight__e3grurt)", weight: "var(--text-body-weight__e3gruru)", letterSpacing: "var(--text-body-letterSpacing__e3grurv)" }, lead: { size: "var(--text-lead-size__e3grurw)", lineHeight: "var(--text-lead-lineHeight__e3grurx)", weight: "var(--text-lead-weight__e3grury)", letterSpacing: "var(--text-lead-letterSpacing__e3grurz)" }, small: { size: "var(--text-small-size__e3grur10)", lineHeight: "var(--text-small-lineHeight__e3grur11)", weight: "var(--text-small-weight__e3grur12)", letterSpacing: "var(--text-small-letterSpacing__e3grur13)" }, caption: { size: "var(--text-caption-size__e3grur14)", lineHeight: "var(--text-caption-lineHeight__e3grur15)", weight: "var(--text-caption-weight__e3grur16)", letterSpacing: "var(--text-caption-letterSpacing__e3grur17)" } }, space: { none: "var(--space-none__e3grur18)", xs: "var(--space-xs__e3grur19)", sm: "var(--space-sm__e3grur1a)", md: "var(--space-md__e3grur1b)", lg: "var(--space-lg__e3grur1c)", xl: "var(--space-xl__e3grur1d)", "2xl": "var(--space-2xl__e3grur1e)", "3xl": "var(--space-3xl__e3grur1f)", "4xl": "var(--space-4xl__e3grur1g)", "5xl": "var(--space-5xl__e3grur1h)" }, radius: { none: "var(--radius-none__e3grur1i)", sm: "var(--radius-sm__e3grur1j)", md: "var(--radius-md__e3grur1k)", lg: "var(--radius-lg__e3grur1l)", base: "var(--radius-base__e3grur1m)", full: "var(--radius-full__e3grur1n)" }, border: { hair: "var(--border-hair__e3grur1o)", rule: "var(--border-rule__e3grur1p)", heavy: "var(--border-heavy__e3grur1q)" }, tracking: { tight: "var(--tracking-tight__e3grur1r)", normal: "var(--tracking-normal__e3grur1s)", wide: "var(--tracking-wide__e3grur1t)", wider: "var(--tracking-wider__e3grur1u)", widest: "var(--tracking-widest__e3grur1v)" }, weight: { light: "var(--weight-light__e3grur1w)", regular: "var(--weight-regular__e3grur1x)", medium: "var(--weight-medium__e3grur1y)", semibold: "var(--weight-semibold__e3grur1z)", bold: "var(--weight-bold__e3grur20)" }, dur: { fast: "var(--dur-fast__e3grur21)", base: "var(--dur-base__e3grur22)", slow: "var(--dur-slow__e3grur23)" }, ease: { ink: "var(--ease-ink__e3grur24)" }, shadow: { sm: "var(--shadow-sm__e3grur25)", md: "var(--shadow-md__e3grur26)", lg: "var(--shadow-lg__e3grur27)" }, color: colorVars };
7
7
 
8
8
  // src/hooks/use-previous/index.ts
9
9
  import { useEffect, useRef } from "react";
@@ -437,11 +437,11 @@ function CheckIcon({ size: size3 = 20, strokeWidth = 1.75, ...rest }) {
437
437
  import { useMemo as useMemo8 } from "react";
438
438
 
439
439
  // src/components/checkbox/use-styles.css.ts
440
- var box = "use-styles_box__9zoga92";
441
- var boxChecked = "use-styles_boxChecked__9zoga93";
442
- var check = "use-styles_check__9zoga94";
443
- var disabled = "use-styles_disabled__9zoga95";
444
- var input = "use-styles_input__9zoga91";
440
+ var box = "use-styles_box__9zoga91";
441
+ var boxChecked = "use-styles_boxChecked__9zoga92";
442
+ var check = "use-styles_check__9zoga93";
443
+ var disabled = "use-styles_disabled__9zoga94";
444
+ var input = "surfaces_srOnly__6hs0fg0";
445
445
  var root6 = "use-styles_root__9zoga90";
446
446
 
447
447
  // src/components/checkbox/use-styles.ts
@@ -493,11 +493,11 @@ function Checkbox({
493
493
  import { useMemo as useMemo9 } from "react";
494
494
 
495
495
  // src/components/radio/use-styles.css.ts
496
- var circle = "use-styles_circle__vy61b43";
496
+ var circle = "use-styles_circle__vy61b42";
497
497
  var disabled2 = "use-styles_disabled__vy61b41";
498
- var dot2 = "use-styles_dot__vy61b44";
499
- var input2 = "use-styles_input__vy61b42";
500
- var label2 = "use-styles_label__vy61b45";
498
+ var dot2 = "use-styles_dot__vy61b43";
499
+ var input2 = "surfaces_srOnly__6hs0fg0";
500
+ var label2 = "use-styles_label__vy61b44";
501
501
  var root7 = "use-styles_root__vy61b40";
502
502
 
503
503
  // src/components/radio/use-styles.ts
@@ -545,13 +545,13 @@ function Radio({ checked, onChange, label: label7, name, value, disabled: disabl
545
545
  import { useMemo as useMemo10 } from "react";
546
546
 
547
547
  // src/components/switch/use-styles.css.ts
548
- var input3 = "use-styles_input__1r6kem71";
549
- var knob = "use-styles_knob__1r6kem74";
550
- var knobChecked = "use-styles_knobChecked__1r6kem75";
551
- var label3 = "use-styles_label__1r6kem76";
548
+ var input3 = "surfaces_srOnly__6hs0fg0";
549
+ var knob = "use-styles_knob__1r6kem73";
550
+ var knobChecked = "use-styles_knobChecked__1r6kem74";
551
+ var label3 = "use-styles_label__1r6kem75";
552
552
  var root8 = "use-styles_root__1r6kem70";
553
- var track2 = "use-styles_track__1r6kem72";
554
- var trackChecked = "use-styles_trackChecked__1r6kem73";
553
+ var track2 = "use-styles_track__1r6kem71";
554
+ var trackChecked = "use-styles_trackChecked__1r6kem72";
555
555
 
556
556
  // src/components/switch/use-styles.ts
557
557
  function useStyles9({ checked }) {
@@ -1009,7 +1009,7 @@ import { cloneElement, useId as useId2, useState as useState4 } from "react";
1009
1009
  import { useMemo as useMemo15 } from "react";
1010
1010
 
1011
1011
  // src/components/tooltip/use-styles.css.ts
1012
- var bubble = "use-styles_bubble__h9kvh1";
1012
+ var bubble = "use-styles_bubble__h9kvh1 surfaces_inkySurface__6hs0fg2";
1013
1013
  var placement = { top: "use-styles_placement_top__h9kvh2", bottom: "use-styles_placement_bottom__h9kvh3" };
1014
1014
  var wrapper = "use-styles_wrapper__h9kvh0";
1015
1015
 
@@ -1076,7 +1076,7 @@ import { useMemo as useMemo16 } from "react";
1076
1076
  var chevron = "use-styles_chevron__1w1czpb4";
1077
1077
  var chevronOpen = "use-styles_chevronOpen__1w1czpb5";
1078
1078
  var label4 = "use-styles_label__1w1czpb1";
1079
- var menu = "use-styles_menu__1w1czpb6";
1079
+ var menu = "use-styles_menu__1w1czpb6 surfaces_panelSurface__6hs0fg1";
1080
1080
  var option = "use-styles_option__1w1czpb7";
1081
1081
  var optionActive = "use-styles_optionActive__1w1czpb9";
1082
1082
  var optionSelected = "use-styles_optionSelected__1w1czpb8";
@@ -1643,7 +1643,7 @@ import { useMemo as useMemo23 } from "react";
1643
1643
  // src/components/menu/use-styles.css.ts
1644
1644
  var danger = "use-styles_danger__1uyxaj3";
1645
1645
  var item2 = "use-styles_item__1uyxaj2";
1646
- var list = "use-styles_list__1uyxaj1";
1646
+ var list = "use-styles_list__1uyxaj1 surfaces_panelSurface__6hs0fg1";
1647
1647
  var wrapper3 = "use-styles_wrapper__1uyxaj0";
1648
1648
 
1649
1649
  // src/components/menu/use-styles.ts
@@ -1892,7 +1892,7 @@ import { useMemo as useMemo25 } from "react";
1892
1892
  // src/components/snackbar/use-styles.css.ts
1893
1893
  var closeBtn = "use-styles_closeBtn__ihzsep2";
1894
1894
  var message = "use-styles_message__ihzsep1";
1895
- var root20 = "use-styles_root__ihzsep0";
1895
+ var root20 = "use-styles_root__ihzsep0 surfaces_inkySurface__6hs0fg2";
1896
1896
 
1897
1897
  // src/components/snackbar/use-styles.ts
1898
1898
  function useStyles24() {