@5voltfx/design-system 0.1.1 → 0.2.0

package/dist/components/SlideRuleNav/index.css

@@ -0,0 +1,196 @@
+/* src/components/SlideRuleNav/SlideRuleNav.css */
+.ds-rule {
+  overflow-x: auto;
+  overflow-y: hidden;
+}
+.ds-rule__stage {
+  position: relative;
+  min-width: 640px;
+}
+.ds-rule__chrome {
+  display: block;
+  width: 100%;
+  height: auto;
+  overflow: visible;
+  touch-action: none;
+  user-select: none;
+  -webkit-user-select: none;
+}
+.ds-rule__rail {
+  fill: var(--ds-rule-plate);
+  stroke: var(--ds-rule-edge);
+  stroke-width: 1;
+}
+.ds-rule__rivet {
+  fill: var(--ds-rule-brass);
+  stroke: var(--ds-rule-brass);
+  stroke-width: 0.5;
+}
+.ds-rule__tick {
+  stroke: var(--ds-rule-tick);
+  stroke-width: 1;
+  shape-rendering: crispEdges;
+}
+.ds-rule__tick--half {
+  opacity: 0.75;
+}
+.ds-rule__tick--quarter {
+  opacity: 0.5;
+}
+.ds-rule__numeral {
+  font-family: var(--ds-font-body);
+  font-size: 8px;
+  font-variant-numeric: tabular-nums;
+  letter-spacing: 0.04em;
+  fill: var(--ds-rule-ink-soft);
+}
+.ds-rule__numeral--accent {
+  fill: var(--ds-rule-hair);
+}
+.ds-rule__caption {
+  font-family: var(--ds-font-body);
+  font-size: 8px;
+  letter-spacing: 0.16em;
+  fill: var(--ds-rule-ink-soft);
+}
+.ds-rule__carriage {
+  cursor: grab;
+}
+.ds-rule__carriage:active {
+  cursor: grabbing;
+}
+.ds-rule__glass {
+  fill: var(--ds-rule-glass);
+  stroke: var(--ds-rule-glass-edge);
+  stroke-width: 0.75;
+}
+.ds-rule__frame {
+  fill: none;
+  stroke: var(--ds-rule-glass-edge);
+  stroke-width: 2.4;
+  stroke-linejoin: round;
+  opacity: 0.7;
+}
+.ds-rule__hairline {
+  stroke: var(--ds-rule-hair);
+  stroke-width: 1.1;
+}
+.ds-rule__pawl {
+  fill: var(--ds-rule-brass);
+}
+.ds-rule__pawl-spring {
+  fill: var(--ds-rule-brass);
+  opacity: 0.45;
+}
+.ds-rule__vernier-line {
+  stroke: var(--ds-rule-tick);
+  stroke-width: 1;
+  shape-rendering: crispEdges;
+}
+.ds-rule__vernier-line--lit {
+  stroke: var(--ds-rule-hair);
+  stroke-width: 2;
+}
+.ds-rule__stations {
+  position: absolute;
+  inset: 0;
+  margin: 0;
+  padding: 0;
+  list-style: none;
+  pointer-events: none;
+}
+.ds-rule__station {
+  position: absolute;
+  left: var(--station-x);
+  top: var(--station-y);
+  transform: translate(-50%, -100%);
+  pointer-events: auto;
+}
+.ds-rule__link {
+  display: inline-block;
+  padding: var(--ds-space-1) var(--ds-space-2);
+  border: none;
+  border-bottom: 2px solid transparent;
+  border-radius: var(--ds-radius-sm);
+  background: transparent;
+  font-family: var(--ds-font-body);
+  font-size: var(--ds-font-size-100);
+  font-weight: var(--ds-font-weight-semibold);
+  letter-spacing: 0.13em;
+  text-transform: uppercase;
+  text-decoration: none;
+  white-space: nowrap;
+  color: var(--ds-rule-ink-soft);
+  cursor: pointer;
+  transition: color var(--ds-motion-duration-base) var(--ds-motion-ease-standard);
+}
+.ds-rule__link:hover {
+  color: var(--ds-rule-ink);
+}
+.ds-rule__link:focus-visible {
+  outline: 2px solid var(--ds-color-focus-ring);
+  outline-offset: 2px;
+}
+.ds-rule__link--active {
+  color: var(--ds-rule-ink);
+  border-bottom-color: var(--ds-rule-hair);
+}
+.ds-rule__readout {
+  margin-top: var(--ds-space-3);
+  font-family: var(--ds-font-body);
+  font-size: var(--ds-font-size-100);
+  letter-spacing: 0.13em;
+  text-transform: uppercase;
+  color: var(--ds-rule-ink-soft);
+}
+.ds-rule__readout-key {
+  opacity: 0.7;
+}
+.ds-rule__readout-val {
+  color: var(--ds-rule-ink);
+  border-bottom: 1.5px solid var(--ds-rule-hair);
+}
+.ds-rule__readout-num {
+  color: var(--ds-rule-hair);
+  font-variant-numeric: tabular-nums;
+}
+.ds-rule__sr-only {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  padding: 0;
+  margin: -1px;
+  overflow: hidden;
+  clip-path: inset(50%);
+  white-space: nowrap;
+  border: 0;
+}
+@media (prefers-reduced-motion: reduce) {
+  .ds-rule__link {
+    transition-duration: 0.01ms;
+  }
+}
+.ds-rule__shoe {
+  fill: var(--ds-rule-glass-edge);
+}
+.ds-rule__slide {
+  fill: var(--ds-rule-plate-2);
+  stroke: var(--ds-rule-edge);
+  stroke-width: 1;
+}
+.ds-rule__index {
+  fill: var(--ds-rule-hair);
+}
+.ds-rule__caption--accent {
+  fill: var(--ds-rule-hair);
+}
+.ds-rule__window {
+  pointer-events: none;
+}
+.ds-rule--slide .ds-rule__stations {
+  clip-path: inset(0 3.33% 0 3.33%);
+}
+.ds-rule--slide .ds-rule__stage {
+  overflow: hidden;
+}
+/*# sourceMappingURL=index.css.map */

package/dist/components/SlideRuleNav/index.css.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/SlideRuleNav/SlideRuleNav.css"],"sourcesContent":["/*\n  Linear slide-rule navigation. The engraved chrome is an aria-hidden SVG; the\n  navigation itself is the HTML list positioned over it, so focus rings, hit\n  areas, routing and screen-reader semantics all behave normally.\n\n  Component tokens (--ds-rule-*) live in src/tokens/rule.css, since DialNav\n  shares them.\n*/\n\n.ds-rule {\n  /* A rule too long for the desk scrolls, rather than shrinking its engraving\n     into illegibility. Deliberately never degrades to a plain nav. */\n  overflow-x: auto;\n  overflow-y: hidden;\n}\n\n.ds-rule__stage {\n  position: relative;\n  min-width: 640px;\n}\n\n.ds-rule__chrome {\n  display: block;\n  width: 100%;\n  height: auto;\n  overflow: visible;\n  touch-action: none;\n  user-select: none;\n  -webkit-user-select: none;\n}\n\n/* ── engraved chrome ─────────────────────────────────────────────────── */\n\n.ds-rule__rail {\n  fill: var(--ds-rule-plate);\n  stroke: var(--ds-rule-edge);\n  stroke-width: 1;\n}\n\n.ds-rule__rivet {\n  fill: var(--ds-rule-brass);\n  stroke: var(--ds-rule-brass);\n  stroke-width: 0.5;\n}\n\n.ds-rule__tick {\n  stroke: var(--ds-rule-tick);\n  stroke-width: 1;\n  shape-rendering: crispEdges;\n}\n.ds-rule__tick--half {\n  opacity: 0.75;\n}\n.ds-rule__tick--quarter {\n  opacity: 0.5;\n}\n\n.ds-rule__numeral {\n  font-family: var(--ds-font-body);\n  font-size: 8px;\n  font-variant-numeric: tabular-nums;\n  letter-spacing: 0.04em;\n  fill: var(--ds-rule-ink-soft);\n}\n.ds-rule__numeral--accent {\n  fill: var(--ds-rule-hair);\n}\n\n.ds-rule__caption {\n  font-family: var(--ds-font-body);\n  font-size: 8px;\n  letter-spacing: 0.16em;\n  fill: var(--ds-rule-ink-soft);\n}\n\n/* ── carriage ────────────────────────────────────────────────────────── */\n\n.ds-rule__carriage {\n  cursor: grab;\n}\n.ds-rule__carriage:active {\n  cursor: grabbing;\n}\n\n.ds-rule__glass {\n  fill: var(--ds-rule-glass);\n  stroke: var(--ds-rule-glass-edge);\n  stroke-width: 0.75;\n}\n\n.ds-rule__frame {\n  fill: none;\n  stroke: var(--ds-rule-glass-edge);\n  stroke-width: 2.4;\n  stroke-linejoin: round;\n  opacity: 0.7;\n}\n\n.ds-rule__hairline {\n  stroke: var(--ds-rule-hair);\n  stroke-width: 1.1;\n}\n\n.ds-rule__pawl {\n  fill: var(--ds-rule-brass);\n}\n.ds-rule__pawl-spring {\n  fill: var(--ds-rule-brass);\n  opacity: 0.45;\n}\n\n.ds-rule__vernier-line {\n  stroke: var(--ds-rule-tick);\n  stroke-width: 1;\n  shape-rendering: crispEdges;\n}\n.ds-rule__vernier-line--lit {\n  stroke: var(--ds-rule-hair);\n  stroke-width: 2;\n}\n\n/* ── stations (the actual navigation) ────────────────────────────────── */\n\n.ds-rule__stations {\n  position: absolute;\n  inset: 0;\n  margin: 0;\n  padding: 0;\n  list-style: none;\n  pointer-events: none;\n}\n\n.ds-rule__station {\n  position: absolute;\n  left: var(--station-x);\n  top: var(--station-y);\n  transform: translate(-50%, -100%);\n  pointer-events: auto;\n}\n\n.ds-rule__link {\n  display: inline-block;\n  padding: var(--ds-space-1) var(--ds-space-2);\n  border: none;\n  /* Reserved on every state so marking the active station shifts nothing. */\n  border-bottom: 2px solid transparent;\n  border-radius: var(--ds-radius-sm);\n  background: transparent;\n  font-family: var(--ds-font-body);\n  font-size: var(--ds-font-size-100);\n  font-weight: var(--ds-font-weight-semibold);\n  letter-spacing: 0.13em;\n  text-transform: uppercase;\n  text-decoration: none;\n  white-space: nowrap;\n  color: var(--ds-rule-ink-soft);\n  cursor: pointer;\n  transition: color var(--ds-motion-duration-base)\n    var(--ds-motion-ease-standard);\n}\n\n.ds-rule__link:hover {\n  color: var(--ds-rule-ink);\n}\n\n.ds-rule__link:focus-visible {\n  outline: 2px solid var(--ds-color-focus-ring);\n  outline-offset: 2px;\n}\n\n/*\n  The active station is marked by full-contrast ink *and* an accent rule, not\n  by hue alone. The theme accent is a bg-family token: as label text it falls\n  to 1.6:1 on sage and harvest, far below AA. It reads fine as a 2px rule.\n*/\n.ds-rule__link--active {\n  color: var(--ds-rule-ink);\n  border-bottom-color: var(--ds-rule-hair);\n}\n\n/* ── readout ─────────────────────────────────────────────────────────── */\n\n.ds-rule__readout {\n  margin-top: var(--ds-space-3);\n  font-family: var(--ds-font-body);\n  font-size: var(--ds-font-size-100);\n  letter-spacing: 0.13em;\n  text-transform: uppercase;\n  color: var(--ds-rule-ink-soft);\n}\n\n.ds-rule__readout-key {\n  opacity: 0.7;\n}\n\n.ds-rule__readout-val {\n  color: var(--ds-rule-ink);\n  border-bottom: 1.5px solid var(--ds-rule-hair);\n}\n\n.ds-rule__readout-num {\n  color: var(--ds-rule-hair);\n  font-variant-numeric: tabular-nums;\n}\n\n.ds-rule__sr-only {\n  position: absolute;\n  width: 1px;\n  height: 1px;\n  padding: 0;\n  margin: -1px;\n  overflow: hidden;\n  clip-path: inset(50%);\n  white-space: nowrap;\n  border: 0;\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .ds-rule__link {\n    transition-duration: 0.01ms;\n  }\n}\n\n/* ── L-I cursor shoes ────────────────────────────────────────────────── */\n\n.ds-rule__shoe {\n  fill: var(--ds-rule-glass-edge);\n}\n\n/* ── L-II slide and index ────────────────────────────────────────────── */\n\n.ds-rule__slide {\n  fill: var(--ds-rule-plate-2);\n  stroke: var(--ds-rule-edge);\n  stroke-width: 1;\n}\n\n.ds-rule__index {\n  fill: var(--ds-rule-hair);\n}\n\n.ds-rule__caption--accent {\n  fill: var(--ds-rule-hair);\n}\n\n/* The window is instrument furniture, not a drag handle — let pointers\n   through to the slide underneath it. */\n.ds-rule__window {\n  pointer-events: none;\n}\n\n/* L-II's labels ride the slide, so they must be clipped to the same window the\n   engraved slide is. clip-path trims them to the window's edges. */\n.ds-rule--slide .ds-rule__stations {\n  clip-path: inset(0 3.33% 0 3.33%);\n}\n\n/* The label rail is moved with a transform, which does not affect layout but\n   *does* extend an ancestor's scrollable area — so `overflow` on the rail\n   itself cannot contain it and the nav grows a stray horizontal scrollbar.\n   The stage has to do the clipping. Only L-II needs this; the other plates\n   hold their labels still. */\n.ds-rule--slide .ds-rule__stage {\n  overflow: hidden;\n}\n"],"mappings":"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","names":[]}

package/dist/components/SlideRuleNav/index.d.ts

@@ -0,0 +1,2 @@
+export { SlideRuleNav } from "./SlideRuleNav.jsx";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/SlideRuleNav/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/SlideRuleNav/index.js"],"names":[],"mappings":""}

package/dist/components/SlideRuleNav/index.js

@@ -0,0 +1,7 @@
+import {
+  SlideRuleNav
+} from "../../chunk-SUYKOWXJ.js";
+export {
+  SlideRuleNav
+};
+//# sourceMappingURL=index.js.map

package/dist/components/SlideRuleNav/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/components/SlideRuleNav/variants/CursorRule.d.ts

@@ -0,0 +1,11 @@
+/**
+ * L-I — Cursor Rule.
+ *
+ * The scale is fixed and the cursor travels: a glass runner with a scarlet
+ * hairline, brass shoes at each end. Mechanically the simplest of the three
+ * linear plates, and a strict subset of L-III.
+ *
+ * Decorative only — the navigation is the HTML list the parent renders above.
+ */
+export const CursorRule: import("react").ForwardRefExoticComponent<import("react").RefAttributes<any>>;
+//# sourceMappingURL=CursorRule.d.ts.map

package/dist/components/SlideRuleNav/variants/CursorRule.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CursorRule.d.ts","sourceRoot":"","sources":["../../../../src/components/SlideRuleNav/variants/CursorRule.jsx"],"names":[],"mappings":"AAIA;;;;;;;;GAQG;AACH,uGAgLG"}

package/dist/components/SlideRuleNav/variants/SlideStator.d.ts

@@ -0,0 +1,13 @@
+/**
+ * L-II — Slide & Stator.
+ *
+ * Inverted from L-I: the index stays put and the slide travels beneath it.
+ * Stations sit at true log10 positions, so the gaps compress toward the right
+ * of the rule and each quarter-detent inherits that compression — the
+ * mechanism genuinely tightens at the far end. The unevenness is the point.
+ *
+ * Decorative only — the navigation is the HTML list the parent renders above,
+ * which rides the same offset this slide does.
+ */
+export const SlideStator: import("react").ForwardRefExoticComponent<import("react").RefAttributes<any>>;
+//# sourceMappingURL=SlideStator.d.ts.map

package/dist/components/SlideRuleNav/variants/SlideStator.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SlideStator.d.ts","sourceRoot":"","sources":["../../../../src/components/SlideRuleNav/variants/SlideStator.jsx"],"names":[],"mappings":"AAkCA;;;;;;;;;;GAUG;AACH,wGAmOG"}

package/dist/components/SlideRuleNav/variants/VernierCarriage.d.ts

@@ -0,0 +1,13 @@
+/**
+ * L-III — Vernier Carriage.
+ *
+ * A notched rail with a sprung pawl and a working vernier: five carriage
+ * divisions span four rail divisions, so at any offset exactly one line pair
+ * coincides and its index gives the fraction. Release and the pawl seats, the
+ * zero lines coincide, and the reading goes whole.
+ *
+ * Everything here is decorative and hidden from assistive technology; the
+ * navigation is the HTML list the parent renders over it.
+ */
+export const VernierCarriage: import("react").ForwardRefExoticComponent<import("react").RefAttributes<any>>;
+//# sourceMappingURL=VernierCarriage.d.ts.map

package/dist/components/SlideRuleNav/variants/VernierCarriage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"VernierCarriage.d.ts","sourceRoot":"","sources":["../../../../src/components/SlideRuleNav/variants/VernierCarriage.jsx"],"names":[],"mappings":"AAIA;;;;;;;;;;GAUG;AACH,4GAwMG"}

package/dist/components/Switch/Switch.d.ts

@@ -0,0 +1,15 @@
+/**
+ * Toggle switch built on a native <input type="checkbox"> — same semantics as
+ * a checkbox, styled as a sliding track. Controlled or uncontrolled via
+ * `...rest` (checked/defaultChecked, onChange).
+ *
+ * @param {object} props
+ * @param {import("react").ReactNode} [props.label] - Visible label text.
+ * @param {string} [props.className]
+ * @returns {import("react").ReactElement}
+ */
+export function Switch({ label, className, ...rest }: {
+    label?: import("react").ReactNode;
+    className?: string | undefined;
+}): import("react").ReactElement;
+//# sourceMappingURL=Switch.d.ts.map

package/dist/components/Switch/Switch.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Switch.d.ts","sourceRoot":"","sources":["../../../src/components/Switch/Switch.jsx"],"names":[],"mappings":"AAEA;;;;;;;;;GASG;AACH,sDAJG;IAA0C,KAAK,GAAvC,OAAO,OAAO,EAAE,SAAS;IACV,SAAS;CAChC,GAAU,OAAO,OAAO,EAAE,YAAY,CAiBxC"}

package/dist/components/Switch/index.css

@@ -0,0 +1,49 @@
+/* src/components/Switch/Switch.css */
+.ds-switch {
+  display: inline-flex;
+  align-items: center;
+  gap: var(--ds-space-2);
+  font-family: var(--ds-font-body);
+  font-size: var(--ds-font-size-200);
+  color: var(--ds-color-font-0);
+  cursor: pointer;
+}
+.ds-switch__input {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  opacity: 0;
+  margin: 0;
+}
+.ds-switch__track {
+  display: inline-flex;
+  align-items: center;
+  width: 2.5rem;
+  height: 1.4rem;
+  flex-shrink: 0;
+  padding: 2px;
+  border-radius: var(--ds-radius-pill);
+  background-color: var(--ds-color-bw-2);
+  transition: background-color var(--ds-motion-duration-base) var(--ds-motion-ease-standard);
+}
+.ds-switch__thumb {
+  width: 1rem;
+  height: 1rem;
+  border-radius: var(--ds-radius-pill);
+  background-color: var(--ds-color-bw-4);
+  transition: transform var(--ds-motion-duration-base) var(--ds-motion-ease-standard);
+}
+.ds-switch__input:checked + .ds-switch__track {
+  background-color: var(--ds-color-bg-2);
+}
+.ds-switch__input:checked + .ds-switch__track .ds-switch__thumb {
+  transform: translateX(1.1rem);
+}
+.ds-switch__input:focus-visible + .ds-switch__track {
+  outline: 2px solid var(--ds-color-focus-ring);
+  outline-offset: 2px;
+}
+.ds-switch__input:disabled ~ * {
+  opacity: 0.5;
+}
+/*# sourceMappingURL=index.css.map */

package/dist/components/Switch/index.css.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/Switch/Switch.css"],"sourcesContent":[".ds-switch {\n  display: inline-flex;\n  align-items: center;\n  gap: var(--ds-space-2);\n  font-family: var(--ds-font-body);\n  font-size: var(--ds-font-size-200);\n  color: var(--ds-color-font-0);\n  cursor: pointer;\n}\n\n.ds-switch__input {\n  position: absolute;\n  width: 1px;\n  height: 1px;\n  opacity: 0;\n  margin: 0;\n}\n\n.ds-switch__track {\n  display: inline-flex;\n  align-items: center;\n  width: 2.5rem;\n  height: 1.4rem;\n  flex-shrink: 0;\n  padding: 2px;\n  border-radius: var(--ds-radius-pill);\n  background-color: var(--ds-color-bw-2);\n  transition: background-color var(--ds-motion-duration-base) var(--ds-motion-ease-standard);\n}\n\n.ds-switch__thumb {\n  width: 1rem;\n  height: 1rem;\n  border-radius: var(--ds-radius-pill);\n  background-color: var(--ds-color-bw-4);\n  transition: transform var(--ds-motion-duration-base) var(--ds-motion-ease-standard);\n}\n\n.ds-switch__input:checked + .ds-switch__track {\n  background-color: var(--ds-color-bg-2);\n}\n\n.ds-switch__input:checked + .ds-switch__track .ds-switch__thumb {\n  transform: translateX(1.1rem);\n}\n\n.ds-switch__input:focus-visible + .ds-switch__track {\n  outline: 2px solid var(--ds-color-focus-ring);\n  outline-offset: 2px;\n}\n\n.ds-switch__input:disabled ~ * {\n  opacity: 0.5;\n}\n"],"mappings":";AAAA,CAAC;AACC,WAAS;AACT,eAAa;AACb,OAAK,IAAI;AACT,eAAa,IAAI;AACjB,aAAW,IAAI;AACf,SAAO,IAAI;AACX,UAAQ;AACV;AAEA,CAAC;AACC,YAAU;AACV,SAAO;AACP,UAAQ;AACR,WAAS;AACT,UAAQ;AACV;AAEA,CAAC;AACC,WAAS;AACT,eAAa;AACb,SAAO;AACP,UAAQ;AACR,eAAa;AACb,WAAS;AACT,iBAAe,IAAI;AACnB,oBAAkB,IAAI;AACtB,cAAY,iBAAiB,IAAI,2BAA2B,IAAI;AAClE;AAEA,CAAC;AACC,SAAO;AACP,UAAQ;AACR,iBAAe,IAAI;AACnB,oBAAkB,IAAI;AACtB,cAAY,UAAU,IAAI,2BAA2B,IAAI;AAC3D;AAEA,CA5BC,gBA4BgB,SAAS,EAAE,CApB3B;AAqBC,oBAAkB,IAAI;AACxB;AAEA,CAhCC,gBAgCgB,SAAS,EAAE,CAxB3B,iBAwB6C,CAZ7C;AAaC,aAAW,WAAW;AACxB;AAEA,CApCC,gBAoCgB,eAAe,EAAE,CA5BjC;AA6BC,WAAS,IAAI,MAAM,IAAI;AACvB,kBAAgB;AAClB;AAEA,CAzCC,gBAyCgB,UAAU,EAAE;AAC3B,WAAS;AACX;","names":[]}

package/dist/components/Switch/index.d.ts

@@ -0,0 +1,2 @@
+export { Switch } from "./Switch.jsx";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/Switch/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Switch/index.js"],"names":[],"mappings":""}

package/dist/components/Switch/index.js

@@ -0,0 +1,7 @@
+import {
+  Switch
+} from "../../chunk-DD5VKG3L.js";
+export {
+  Switch
+};
+//# sourceMappingURL=index.js.map

package/dist/components/Switch/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/components/Tabs/Tabs.d.ts

@@ -0,0 +1,34 @@
+/**
+ * @typedef {object} TabItem
+ * @property {string} id
+ * @property {import("react").ReactNode} label
+ * @property {import("react").ReactNode} content
+ * @property {boolean} [disabled]
+ */
+/**
+ * Accessible tabs. Uncontrolled by default (tracks its own selection); pass
+ * `value` + `onChange` to control it. Left/Right arrows move between tabs with
+ * roving tabindex; Home/End jump to first/last. role=tablist/tab/tabpanel.
+ *
+ * @param {object} props
+ * @param {TabItem[]} props.items
+ * @param {string} [props.value] - Selected tab id (controlled).
+ * @param {string} [props.defaultValue] - Initial tab id (uncontrolled).
+ * @param {(id: string) => void} [props.onChange]
+ * @param {string} [props.className]
+ * @returns {import("react").ReactElement}
+ */
+export function Tabs({ items, value, defaultValue, onChange, className, }: {
+    items: TabItem[];
+    value?: string | undefined;
+    defaultValue?: string | undefined;
+    onChange?: ((id: string) => void) | undefined;
+    className?: string | undefined;
+}): import("react").ReactElement;
+export type TabItem = {
+    id: string;
+    label: import("react").ReactNode;
+    content: import("react").ReactNode;
+    disabled?: boolean | undefined;
+};
+//# sourceMappingURL=Tabs.d.ts.map

package/dist/components/Tabs/Tabs.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tabs.d.ts","sourceRoot":"","sources":["../../../src/components/Tabs/Tabs.jsx"],"names":[],"mappings":"AAGA;;;;;;GAMG;AAEH;;;;;;;;;;;;GAYG;AACH,2EAPG;IAAyB,KAAK,EAAtB,OAAO,EAAE;IACM,KAAK;IACL,YAAY;IACE,QAAQ,SAAhC,MAAM,KAAK,IAAI;IACL,SAAS;CAChC,GAAU,OAAO,OAAO,EAAE,YAAY,CAoFxC;;QArGa,MAAM;WACN,OAAO,OAAO,EAAE,SAAS;aACzB,OAAO,OAAO,EAAE,SAAS"}

package/dist/components/Tabs/index.css

@@ -0,0 +1,54 @@
+/* src/components/Tabs/Tabs.css */
+.ds-tabs__list {
+  display: flex;
+  gap: var(--ds-space-1);
+  border-bottom: 1px solid var(--ds-color-bw-1);
+}
+.ds-tabs__tab {
+  position: relative;
+  padding: var(--ds-space-3) var(--ds-space-4);
+  font-family: var(--ds-font-body);
+  font-size: var(--ds-font-size-200);
+  font-weight: var(--ds-font-weight-medium);
+  color: var(--ds-color-font-1);
+  background: transparent;
+  border: none;
+  cursor: pointer;
+  transition: color var(--ds-motion-duration-base) var(--ds-motion-ease-standard);
+}
+.ds-tabs__tab::after {
+  content: "";
+  position: absolute;
+  left: 0;
+  right: 0;
+  bottom: -1px;
+  height: 2px;
+  background-color: var(--ds-color-bg-2);
+  transform: scaleX(0);
+  transition: transform var(--ds-motion-duration-base) var(--ds-motion-ease-standard);
+}
+.ds-tabs__tab:hover:not(:disabled) {
+  color: var(--ds-color-font-0);
+}
+.ds-tabs__tab--active {
+  color: var(--ds-color-font-0);
+}
+.ds-tabs__tab--active::after {
+  transform: scaleX(1);
+}
+.ds-tabs__tab:focus-visible {
+  outline: 2px solid var(--ds-color-focus-ring);
+  outline-offset: -2px;
+  border-radius: var(--ds-radius-sm);
+}
+.ds-tabs__tab:disabled {
+  opacity: 0.5;
+  cursor: not-allowed;
+}
+.ds-tabs__panel {
+  padding-top: var(--ds-space-4);
+}
+.ds-tabs__panel:focus-visible {
+  outline: none;
+}
+/*# sourceMappingURL=index.css.map */

package/dist/components/Tabs/index.css.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/Tabs/Tabs.css"],"sourcesContent":[".ds-tabs__list {\n  display: flex;\n  gap: var(--ds-space-1);\n  border-bottom: 1px solid var(--ds-color-bw-1);\n}\n\n.ds-tabs__tab {\n  position: relative;\n  padding: var(--ds-space-3) var(--ds-space-4);\n  font-family: var(--ds-font-body);\n  font-size: var(--ds-font-size-200);\n  font-weight: var(--ds-font-weight-medium);\n  color: var(--ds-color-font-1);\n  background: transparent;\n  border: none;\n  cursor: pointer;\n  transition: color var(--ds-motion-duration-base) var(--ds-motion-ease-standard);\n}\n\n.ds-tabs__tab::after {\n  content: \"\";\n  position: absolute;\n  left: 0;\n  right: 0;\n  bottom: -1px;\n  height: 2px;\n  background-color: var(--ds-color-bg-2);\n  transform: scaleX(0);\n  transition: transform var(--ds-motion-duration-base)\n    var(--ds-motion-ease-standard);\n}\n\n.ds-tabs__tab:hover:not(:disabled) {\n  color: var(--ds-color-font-0);\n}\n\n.ds-tabs__tab--active {\n  color: var(--ds-color-font-0);\n}\n\n.ds-tabs__tab--active::after {\n  transform: scaleX(1);\n}\n\n.ds-tabs__tab:focus-visible {\n  outline: 2px solid var(--ds-color-focus-ring);\n  outline-offset: -2px;\n  border-radius: var(--ds-radius-sm);\n}\n\n.ds-tabs__tab:disabled {\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n\n.ds-tabs__panel {\n  padding-top: var(--ds-space-4);\n}\n\n.ds-tabs__panel:focus-visible {\n  outline: none;\n}\n"],"mappings":";AAAA,CAAC;AACC,WAAS;AACT,OAAK,IAAI;AACT,iBAAe,IAAI,MAAM,IAAI;AAC/B;AAEA,CAAC;AACC,YAAU;AACV,WAAS,IAAI,cAAc,IAAI;AAC/B,eAAa,IAAI;AACjB,aAAW,IAAI;AACf,eAAa,IAAI;AACjB,SAAO,IAAI;AACX,cAAY;AACZ,UAAQ;AACR,UAAQ;AACR,cAAY,MAAM,IAAI,2BAA2B,IAAI;AACvD;AAEA,CAbC,YAaY;AACX,WAAS;AACT,YAAU;AACV,QAAM;AACN,SAAO;AACP,UAAQ;AACR,UAAQ;AACR,oBAAkB,IAAI;AACtB,aAAW,OAAO;AAClB,cAAY,UAAU,IAAI,2BACxB,IAAI;AACR;AAEA,CA1BC,YA0BY,MAAM,KAAK;AACtB,SAAO,IAAI;AACb;AAEA,CAAC;AACC,SAAO,IAAI;AACb;AAEA,CAJC,oBAIoB;AACnB,aAAW,OAAO;AACpB;AAEA,CAtCC,YAsCY;AACX,WAAS,IAAI,MAAM,IAAI;AACvB,kBAAgB;AAChB,iBAAe,IAAI;AACrB;AAEA,CA5CC,YA4CY;AACX,WAAS;AACT,UAAQ;AACV;AAEA,CAAC;AACC,eAAa,IAAI;AACnB;AAEA,CAJC,cAIc;AACb,WAAS;AACX;","names":[]}

package/dist/components/Tabs/index.d.ts

@@ -0,0 +1,2 @@
+export { Tabs } from "./Tabs.jsx";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/Tabs/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Tabs/index.js"],"names":[],"mappings":""}

package/dist/components/Tabs/index.js

@@ -0,0 +1,7 @@
+import {
+  Tabs
+} from "../../chunk-ZVUDPTFZ.js";
+export {
+  Tabs
+};
+//# sourceMappingURL=index.js.map

package/dist/components/Tabs/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/components/Textarea/Textarea.d.ts

@@ -0,0 +1,16 @@
+/**
+ * Multi-line text input. Shares Input's field styling. All native <textarea>
+ * props pass through via `...rest`.
+ *
+ * @param {object} props
+ * @param {boolean} [props.invalid] - Applies error styling + aria-invalid.
+ * @param {number} [props.rows] - Default 4.
+ * @param {string} [props.className]
+ * @returns {import("react").ReactElement}
+ */
+export function Textarea({ invalid, rows, className, ...rest }: {
+    invalid?: boolean | undefined;
+    rows?: number | undefined;
+    className?: string | undefined;
+}): import("react").ReactElement;
+//# sourceMappingURL=Textarea.d.ts.map

package/dist/components/Textarea/Textarea.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Textarea.d.ts","sourceRoot":"","sources":["../../../src/components/Textarea/Textarea.jsx"],"names":[],"mappings":"AAEA;;;;;;;;;GASG;AACH,gEALG;IAAwB,OAAO;IACR,IAAI;IACJ,SAAS;CAChC,GAAU,OAAO,OAAO,EAAE,YAAY,CAmBxC"}

package/dist/components/Textarea/index.css

@@ -0,0 +1,36 @@
+/* src/components/Textarea/Textarea.css */
+.ds-textarea {
+  display: block;
+  width: 100%;
+  padding: var(--ds-space-3) var(--ds-space-4);
+  font-family: var(--ds-font-body);
+  font-size: var(--ds-font-size-200);
+  line-height: var(--ds-line-height-normal);
+  color: var(--ds-color-font-0);
+  background-color: var(--ds-color-field-bg);
+  border: 1px solid var(--ds-color-field-border);
+  border-radius: var(--ds-radius-md);
+  resize: vertical;
+  transition: border-color var(--ds-motion-duration-base) var(--ds-motion-ease-standard), box-shadow var(--ds-motion-duration-base) var(--ds-motion-ease-standard);
+}
+.ds-textarea::placeholder {
+  color: var(--ds-color-font-1);
+  opacity: 1;
+}
+.ds-textarea:focus-visible {
+  outline: none;
+  border-color: var(--ds-color-focus-ring);
+  box-shadow: 0 0 0 3px color-mix(in srgb, var(--ds-color-focus-ring) 30%, transparent);
+}
+.ds-textarea--invalid {
+  border-color: var(--ds-color-danger);
+}
+.ds-textarea--invalid:focus-visible {
+  border-color: var(--ds-color-danger);
+  box-shadow: 0 0 0 3px color-mix(in srgb, var(--ds-color-danger) 30%, transparent);
+}
+.ds-textarea:disabled {
+  opacity: 0.5;
+  cursor: not-allowed;
+}
+/*# sourceMappingURL=index.css.map */

package/dist/components/Textarea/index.css.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/Textarea/Textarea.css"],"sourcesContent":[".ds-textarea {\n  display: block;\n  width: 100%;\n  padding: var(--ds-space-3) var(--ds-space-4);\n  font-family: var(--ds-font-body);\n  font-size: var(--ds-font-size-200);\n  line-height: var(--ds-line-height-normal);\n  color: var(--ds-color-font-0);\n  background-color: var(--ds-color-field-bg);\n  border: 1px solid var(--ds-color-field-border);\n  border-radius: var(--ds-radius-md);\n  resize: vertical;\n  transition:\n    border-color var(--ds-motion-duration-base) var(--ds-motion-ease-standard),\n    box-shadow var(--ds-motion-duration-base) var(--ds-motion-ease-standard);\n}\n\n.ds-textarea::placeholder {\n  color: var(--ds-color-font-1);\n  opacity: 1;\n}\n\n.ds-textarea:focus-visible {\n  outline: none;\n  border-color: var(--ds-color-focus-ring);\n  box-shadow: 0 0 0 3px\n    color-mix(in srgb, var(--ds-color-focus-ring) 30%, transparent);\n}\n\n.ds-textarea--invalid {\n  border-color: var(--ds-color-danger);\n}\n\n.ds-textarea--invalid:focus-visible {\n  border-color: var(--ds-color-danger);\n  box-shadow: 0 0 0 3px\n    color-mix(in srgb, var(--ds-color-danger) 30%, transparent);\n}\n\n.ds-textarea:disabled {\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n"],"mappings":";AAAA,CAAC;AACC,WAAS;AACT,SAAO;AACP,WAAS,IAAI,cAAc,IAAI;AAC/B,eAAa,IAAI;AACjB,aAAW,IAAI;AACf,eAAa,IAAI;AACjB,SAAO,IAAI;AACX,oBAAkB,IAAI;AACtB,UAAQ,IAAI,MAAM,IAAI;AACtB,iBAAe,IAAI;AACnB,UAAQ;AACR,cACE,aAAa,IAAI,2BAA2B,IAAI,0BAA0B,EAC1E,WAAW,IAAI,2BAA2B,IAAI;AAClD;AAEA,CAjBC,WAiBW;AACV,SAAO,IAAI;AACX,WAAS;AACX;AAEA,CAtBC,WAsBW;AACV,WAAS;AACT,gBAAc,IAAI;AAClB,cAAY,EAAE,EAAE,EAAE,IAChB,UAAU,GAAG,IAAI,EAAE,IAAI,uBAAuB,GAAG,EAAE;AACvD;AAEA,CAAC;AACC,gBAAc,IAAI;AACpB;AAEA,CAJC,oBAIoB;AACnB,gBAAc,IAAI;AAClB,cAAY,EAAE,EAAE,EAAE,IAChB,UAAU,GAAG,IAAI,EAAE,IAAI,mBAAmB,GAAG,EAAE;AACnD;AAEA,CAvCC,WAuCW;AACV,WAAS;AACT,UAAQ;AACV;","names":[]}

package/dist/components/Textarea/index.d.ts

@@ -0,0 +1,2 @@
+export { Textarea } from "./Textarea.jsx";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/Textarea/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Textarea/index.js"],"names":[],"mappings":""}

package/dist/components/Textarea/index.js

@@ -0,0 +1,7 @@
+import {
+  Textarea
+} from "../../chunk-I3NS5MAC.js";
+export {
+  Textarea
+};
+//# sourceMappingURL=index.js.map

package/dist/components/Textarea/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/components/ThemeSwitcher/ThemeSwitcher.d.ts

@@ -0,0 +1,4 @@
+export function ThemeSwitcher({ className }: {
+    className?: string | undefined;
+}): import("react").JSX.Element;
+//# sourceMappingURL=ThemeSwitcher.d.ts.map

package/dist/components/ThemeSwitcher/ThemeSwitcher.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ThemeSwitcher.d.ts","sourceRoot":"","sources":["../../../src/components/ThemeSwitcher/ThemeSwitcher.jsx"],"names":[],"mappings":"AAGA;;gCAsBC"}

package/dist/components/ThemeSwitcher/index.d.ts

@@ -0,0 +1,2 @@
+export { ThemeSwitcher } from "./ThemeSwitcher.jsx";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/ThemeSwitcher/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/ThemeSwitcher/index.js"],"names":[],"mappings":""}

package/dist/components/Typography/Heading.d.ts

@@ -0,0 +1,9 @@
+export function Heading({ level, size, decorative, className, children, ...rest }: {
+    [x: string]: any;
+    level?: number | undefined;
+    size: any;
+    decorative?: boolean | undefined;
+    className?: string | undefined;
+    children: any;
+}): import("react").JSX.Element;
+//# sourceMappingURL=Heading.d.ts.map

package/dist/components/Typography/Heading.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Heading.d.ts","sourceRoot":"","sources":["../../../src/components/Typography/Heading.jsx"],"names":[],"mappings":"AAIA;;;;;;;gCAwBC"}

package/dist/components/Typography/Text.d.ts

@@ -0,0 +1,9 @@
+export function Text({ as: Component, size, tone, className, children, ...rest }: {
+    [x: string]: any;
+    as?: string | undefined;
+    size?: string | undefined;
+    tone?: string | undefined;
+    className?: string | undefined;
+    children: any;
+}): import("react").JSX.Element;
+//# sourceMappingURL=Text.d.ts.map

package/dist/components/Typography/Text.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Text.d.ts","sourceRoot":"","sources":["../../../src/components/Typography/Text.jsx"],"names":[],"mappings":"AAEA;;;;;;;gCAiBC"}

package/dist/components/Typography/index.d.ts

@@ -0,0 +1,3 @@
+export { Heading } from "./Heading.jsx";
+export { Text } from "./Text.jsx";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/Typography/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Typography/index.js"],"names":[],"mappings":""}