@5voltfx/design-system 0.1.0 → 0.2.0

package/dist/components/Button/index.js

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

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

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

package/dist/components/Card/Card.d.ts

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

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

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

package/{src/components/Card/Card.css → dist/components/Card/index.css}

@@ -1,3 +1,4 @@
+/* src/components/Card/Card.css */
 .ds-card {
   background-color: var(--ds-color-bg-1);
   color: var(--ds-color-font-0);
@@ -5,7 +6,6 @@
   border-radius: var(--ds-radius-lg);
   padding: var(--ds-space-5);
   box-shadow: var(--ds-shadow-sm);
-  transition:
-    box-shadow var(--ds-motion-duration-base) var(--ds-motion-ease-standard),
-    transform var(--ds-motion-duration-base) var(--ds-motion-ease-standard);
+  transition: box-shadow var(--ds-motion-duration-base) var(--ds-motion-ease-standard), transform var(--ds-motion-duration-base) var(--ds-motion-ease-standard);
 }
+/*# sourceMappingURL=index.css.map */

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/Card/Card.css"],"sourcesContent":[".ds-card {\n  background-color: var(--ds-color-bg-1);\n  color: var(--ds-color-font-0);\n  border: 1px solid var(--ds-color-bw-1);\n  border-radius: var(--ds-radius-lg);\n  padding: var(--ds-space-5);\n  box-shadow: var(--ds-shadow-sm);\n  transition:\n    box-shadow var(--ds-motion-duration-base) var(--ds-motion-ease-standard),\n    transform var(--ds-motion-duration-base) var(--ds-motion-ease-standard);\n}\n"],"mappings":";AAAA,CAAC;AACC,oBAAkB,IAAI;AACtB,SAAO,IAAI;AACX,UAAQ,IAAI,MAAM,IAAI;AACtB,iBAAe,IAAI;AACnB,WAAS,IAAI;AACb,cAAY,IAAI;AAChB,cACE,WAAW,IAAI,2BAA2B,IAAI,0BAA0B,EACxE,UAAU,IAAI,2BAA2B,IAAI;AACjD;","names":[]}

package/{src/components/Card/index.js → dist/components/Card/index.d.ts}

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

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

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

package/dist/components/Card/index.js

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

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

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

package/dist/components/Checkbox/Checkbox.d.ts

@@ -0,0 +1,15 @@
+/**
+ * Checkbox with a styled indicator over a native <input type="checkbox">, so
+ * keyboard/focus/toggle behavior stays native. 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 Checkbox({ label, className, ...rest }: {
+    label?: import("react").ReactNode;
+    className?: string | undefined;
+}): import("react").ReactElement;
+//# sourceMappingURL=Checkbox.d.ts.map

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

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

package/dist/components/Checkbox/index.css

@@ -0,0 +1,57 @@
+/* src/components/Checkbox/Checkbox.css */
+.ds-checkbox {
+  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-checkbox__input {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  opacity: 0;
+  margin: 0;
+}
+.ds-checkbox__box {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 1.15rem;
+  height: 1.15rem;
+  flex-shrink: 0;
+  border: 1px solid var(--ds-color-field-border);
+  border-radius: var(--ds-radius-sm);
+  background-color: var(--ds-color-field-bg);
+  transition: background-color var(--ds-motion-duration-fast) var(--ds-motion-ease-standard), border-color var(--ds-motion-duration-fast) var(--ds-motion-ease-standard);
+}
+.ds-checkbox__box::after {
+  content: "";
+  width: 0.3rem;
+  height: 0.55rem;
+  border: solid var(--ds-color-on-info);
+  border-width: 0 2px 2px 0;
+  transform: rotate(45deg) scale(0);
+  transition: transform var(--ds-motion-duration-fast) var(--ds-motion-ease-standard);
+  margin-top: -2px;
+}
+.ds-checkbox__input:checked + .ds-checkbox__box {
+  background-color: var(--ds-color-bg-2);
+  border-color: var(--ds-color-bg-2);
+}
+.ds-checkbox__input:checked + .ds-checkbox__box::after {
+  transform: rotate(45deg) scale(1);
+}
+.ds-checkbox__input:focus-visible + .ds-checkbox__box {
+  outline: 2px solid var(--ds-color-focus-ring);
+  outline-offset: 2px;
+}
+.ds-checkbox__input:disabled ~ * {
+  opacity: 0.5;
+}
+.ds-checkbox:has(.ds-checkbox__input:disabled) {
+  cursor: not-allowed;
+}
+/*# sourceMappingURL=index.css.map */

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/Checkbox/Checkbox.css"],"sourcesContent":[".ds-checkbox {\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/* Native input kept in the DOM (accessibility) but visually replaced */\n.ds-checkbox__input {\n  position: absolute;\n  width: 1px;\n  height: 1px;\n  opacity: 0;\n  margin: 0;\n}\n\n.ds-checkbox__box {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: 1.15rem;\n  height: 1.15rem;\n  flex-shrink: 0;\n  border: 1px solid var(--ds-color-field-border);\n  border-radius: var(--ds-radius-sm);\n  background-color: var(--ds-color-field-bg);\n  transition:\n    background-color var(--ds-motion-duration-fast) var(--ds-motion-ease-standard),\n    border-color var(--ds-motion-duration-fast) var(--ds-motion-ease-standard);\n}\n\n.ds-checkbox__box::after {\n  content: \"\";\n  width: 0.3rem;\n  height: 0.55rem;\n  border: solid var(--ds-color-on-info);\n  border-width: 0 2px 2px 0;\n  transform: rotate(45deg) scale(0);\n  transition: transform var(--ds-motion-duration-fast) var(--ds-motion-ease-standard);\n  margin-top: -2px;\n}\n\n.ds-checkbox__input:checked + .ds-checkbox__box {\n  background-color: var(--ds-color-bg-2);\n  border-color: var(--ds-color-bg-2);\n}\n\n.ds-checkbox__input:checked + .ds-checkbox__box::after {\n  transform: rotate(45deg) scale(1);\n}\n\n.ds-checkbox__input:focus-visible + .ds-checkbox__box {\n  outline: 2px solid var(--ds-color-focus-ring);\n  outline-offset: 2px;\n}\n\n.ds-checkbox__input:disabled ~ * {\n  opacity: 0.5;\n}\n\n.ds-checkbox:has(.ds-checkbox__input:disabled) {\n  cursor: not-allowed;\n}\n"],"mappings":";AAAA,CAAC;AACC,WAAS;AACT,eAAa;AACb,OAAK,IAAI;AACT,eAAa,IAAI;AACjB,aAAW,IAAI;AACf,SAAO,IAAI;AACX,UAAQ;AACV;AAGA,CAAC;AACC,YAAU;AACV,SAAO;AACP,UAAQ;AACR,WAAS;AACT,UAAQ;AACV;AAEA,CAAC;AACC,WAAS;AACT,eAAa;AACb,mBAAiB;AACjB,SAAO;AACP,UAAQ;AACR,eAAa;AACb,UAAQ,IAAI,MAAM,IAAI;AACtB,iBAAe,IAAI;AACnB,oBAAkB,IAAI;AACtB,cACE,iBAAiB,IAAI,2BAA2B,IAAI,0BAA0B,EAC9E,aAAa,IAAI,2BAA2B,IAAI;AACpD;AAEA,CAfC,gBAegB;AACf,WAAS;AACT,SAAO;AACP,UAAQ;AACR,UAAQ,MAAM,IAAI;AAClB,gBAAc,EAAE,IAAI,IAAI;AACxB,aAAW,OAAO,OAAO,MAAM;AAC/B,cAAY,UAAU,IAAI,2BAA2B,IAAI;AACzD,cAAY;AACd;AAEA,CAlCC,kBAkCkB,SAAS,EAAE,CA1B7B;AA2BC,oBAAkB,IAAI;AACtB,gBAAc,IAAI;AACpB;AAEA,CAvCC,kBAuCkB,SAAS,EAAE,CA/B7B,gBA+B8C;AAC7C,aAAW,OAAO,OAAO,MAAM;AACjC;AAEA,CA3CC,kBA2CkB,eAAe,EAAE,CAnCnC;AAoCC,WAAS,IAAI,MAAM,IAAI;AACvB,kBAAgB;AAClB;AAEA,CAhDC,kBAgDkB,UAAU,EAAE;AAC7B,WAAS;AACX;AAEA,CA/DC,WA+DW,KAAK,CApDhB,kBAoDmC;AAClC,UAAQ;AACV;","names":[]}

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

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

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

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

package/dist/components/Checkbox/index.js

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

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

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

package/dist/components/Footer/Footer.d.ts

@@ -0,0 +1,15 @@
+/**
+ * Generalizes the 3 existing footers: 5voltfx.com's simple centered
+ * copyright, song-chart's minimal bar, and mattwelker.com's 3-column
+ * layout (auth links / theme swatches / copyright). `left` and `right`
+ * default to nothing and a copyright string respectively, so a single
+ * centered ThemeSwitcher is the only thing rendered out of the box.
+ */
+export function Footer({ brand, showThemeSwitcher, left, right, className, }: {
+    brand?: string | undefined;
+    showThemeSwitcher?: boolean | undefined;
+    left: any;
+    right: any;
+    className?: string | undefined;
+}): import("react").JSX.Element;
+//# sourceMappingURL=Footer.d.ts.map

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

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

package/{src/components/Footer/Footer.css → dist/components/Footer/index.css}

@@ -1,10 +1,36 @@
+/* src/components/ThemeSwitcher/ThemeSwitcher.css */
+.ds-theme-switcher {
+  display: flex;
+  align-items: center;
+  gap: var(--ds-space-2);
+}
+.ds-theme-switcher__swatch {
+  width: 20px;
+  height: 20px;
+  border-radius: var(--ds-radius-pill);
+  border: 2px solid transparent;
+  cursor: pointer;
+  padding: 0;
+  transition: transform var(--ds-motion-duration-fast) var(--ds-motion-ease-standard), border-color var(--ds-motion-duration-base) var(--ds-motion-ease-standard);
+}
+.ds-theme-switcher__swatch:hover {
+  transform: scale(1.15);
+}
+.ds-theme-switcher__swatch--active {
+  border-color: var(--ds-color-font-0);
+}
+.ds-theme-switcher__swatch:focus-visible {
+  outline: 2px solid var(--ds-color-bg-2);
+  outline-offset: 2px;
+}
+
+/* src/components/Footer/Footer.css */
 .ds-footer {
   background-color: var(--ds-color-bg-1);
   color: var(--ds-color-font-1);
   border-top: 1px solid var(--ds-color-bw-1);
   font-family: var(--ds-font-body);
 }
-
 .ds-footer__inner {
   max-width: 1200px;
   margin: 0 auto;
@@ -14,35 +40,30 @@
   justify-content: space-between;
   gap: var(--ds-space-4);
 }
-
 .ds-footer__left,
 .ds-footer__right {
   flex: 1;
   display: flex;
   align-items: center;
 }
-
 .ds-footer__right {
   justify-content: flex-end;
 }
-
 .ds-footer__center {
   display: flex;
   justify-content: center;
 }
-
 .ds-footer__copyright {
   font-size: var(--ds-font-size-100);
 }
-
 @media (width <= 660px) {
   .ds-footer__inner {
     flex-direction: column;
     padding: var(--ds-space-4);
   }
-
   .ds-footer__left,
   .ds-footer__right {
     justify-content: center;
   }
 }
+/*# sourceMappingURL=index.css.map */

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/ThemeSwitcher/ThemeSwitcher.css","../../../src/components/Footer/Footer.css"],"sourcesContent":[".ds-theme-switcher {\n  display: flex;\n  align-items: center;\n  gap: var(--ds-space-2);\n}\n\n.ds-theme-switcher__swatch {\n  width: 20px;\n  height: 20px;\n  border-radius: var(--ds-radius-pill);\n  border: 2px solid transparent;\n  cursor: pointer;\n  padding: 0;\n  transition:\n    transform var(--ds-motion-duration-fast) var(--ds-motion-ease-standard),\n    border-color var(--ds-motion-duration-base) var(--ds-motion-ease-standard);\n}\n\n.ds-theme-switcher__swatch:hover {\n  transform: scale(1.15);\n}\n\n.ds-theme-switcher__swatch--active {\n  border-color: var(--ds-color-font-0);\n}\n\n.ds-theme-switcher__swatch:focus-visible {\n  outline: 2px solid var(--ds-color-bg-2);\n  outline-offset: 2px;\n}\n",".ds-footer {\n  background-color: var(--ds-color-bg-1);\n  color: var(--ds-color-font-1);\n  border-top: 1px solid var(--ds-color-bw-1);\n  font-family: var(--ds-font-body);\n}\n\n.ds-footer__inner {\n  max-width: 1200px;\n  margin: 0 auto;\n  padding: var(--ds-space-4) var(--ds-space-6);\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: var(--ds-space-4);\n}\n\n.ds-footer__left,\n.ds-footer__right {\n  flex: 1;\n  display: flex;\n  align-items: center;\n}\n\n.ds-footer__right {\n  justify-content: flex-end;\n}\n\n.ds-footer__center {\n  display: flex;\n  justify-content: center;\n}\n\n.ds-footer__copyright {\n  font-size: var(--ds-font-size-100);\n}\n\n@media (width <= 660px) {\n  .ds-footer__inner {\n    flex-direction: column;\n    padding: var(--ds-space-4);\n  }\n\n  .ds-footer__left,\n  .ds-footer__right {\n    justify-content: center;\n  }\n}\n"],"mappings":";AAAA,CAAC;AACC,WAAS;AACT,eAAa;AACb,OAAK,IAAI;AACX;AAEA,CAAC;AACC,SAAO;AACP,UAAQ;AACR,iBAAe,IAAI;AACnB,UAAQ,IAAI,MAAM;AAClB,UAAQ;AACR,WAAS;AACT,cACE,UAAU,IAAI,2BAA2B,IAAI,0BAA0B,EACvE,aAAa,IAAI,2BAA2B,IAAI;AACpD;AAEA,CAZC,yBAYyB;AACxB,aAAW,MAAM;AACnB;AAEA,CAAC;AACC,gBAAc,IAAI;AACpB;AAEA,CApBC,yBAoByB;AACxB,WAAS,IAAI,MAAM,IAAI;AACvB,kBAAgB;AAClB;;;AC7BA,CAAC;AACC,oBAAkB,IAAI;AACtB,SAAO,IAAI;AACX,cAAY,IAAI,MAAM,IAAI;AAC1B,eAAa,IAAI;AACnB;AAEA,CAAC;AACC,aAAW;AACX,UAAQ,EAAE;AACV,WAAS,IAAI,cAAc,IAAI;AAC/B,WAAS;AACT,eAAa;AACb,mBAAiB;AACjB,OAAK,IAAI;AACX;AAEA,CAAC;AACD,CAAC;AACC,QAAM;AACN,WAAS;AACT,eAAa;AACf;AAEA,CANC;AAOC,mBAAiB;AACnB;AAEA,CAAC;AACC,WAAS;AACT,mBAAiB;AACnB;AAEA,CAAC;AACC,aAAW,IAAI;AACjB;AAEA,QAAQ,SAAS;AACf,GA/BD;AAgCG,oBAAgB;AAChB,aAAS,IAAI;AACf;AAEA,GA1BD;AAAA,EA2BC,CA1BD;AA2BG,qBAAiB;AACnB;AACF;","names":[]}

package/{src/components/Footer/index.js → dist/components/Footer/index.d.ts}

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

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

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

package/dist/components/Footer/index.js

@@ -0,0 +1,8 @@
+import {
+  Footer
+} from "../../chunk-5KN5TPGG.js";
+import "../../chunk-YCZXDQJZ.js";
+export {
+  Footer
+};
+//# sourceMappingURL=index.js.map

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

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

package/dist/components/FormField/FormField.d.ts

@@ -0,0 +1,27 @@
+/**
+ * Wraps a single form control with a label plus optional help/error text, and
+ * wires up accessibility: it generates an id, links the label via `htmlFor`,
+ * connects help/error text through `aria-describedby`, and sets `aria-invalid`
+ * + the control's `invalid` styling when `error` is present. The control is
+ * passed as the only child (Input, Textarea, Select, etc.).
+ *
+ * @param {object} props
+ * @param {import("react").ReactNode} [props.label]
+ * @param {import("react").ReactNode} [props.help] - Hint text below the control.
+ * @param {import("react").ReactNode} [props.error] - Error text; also marks the control invalid.
+ * @param {boolean} [props.required]
+ * @param {string} [props.htmlFor] - Override the auto-generated control id.
+ * @param {import("react").ReactElement} props.children - The control element.
+ * @param {string} [props.className]
+ * @returns {import("react").ReactElement}
+ */
+export function FormField({ label, help, error, required, htmlFor, children, className, ...rest }: {
+    label?: import("react").ReactNode;
+    help?: import("react").ReactNode;
+    error?: import("react").ReactNode;
+    required?: boolean | undefined;
+    htmlFor?: string | undefined;
+    children: import("react").ReactElement;
+    className?: string | undefined;
+}): import("react").ReactElement;
+//# sourceMappingURL=FormField.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"FormField.d.ts","sourceRoot":"","sources":["../../../src/components/FormField/FormField.jsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;GAgBG;AACH,mGATG;IAA0C,KAAK,GAAvC,OAAO,OAAO,EAAE,SAAS;IACS,IAAI,GAAtC,OAAO,OAAO,EAAE,SAAS;IACS,KAAK,GAAvC,OAAO,OAAO,EAAE,SAAS;IACT,QAAQ;IACT,OAAO;IACc,QAAQ,EAA5C,OAAO,OAAO,EAAE,YAAY;IACb,SAAS;CAChC,GAAU,OAAO,OAAO,EAAE,YAAY,CAsDxC"}

package/dist/components/FormField/index.css

@@ -0,0 +1,31 @@
+/* src/components/Label/Label.css */
+.ds-label {
+  display: inline-flex;
+  align-items: center;
+  gap: var(--ds-space-1);
+  font-family: var(--ds-font-body);
+  font-size: var(--ds-font-size-100);
+  font-weight: var(--ds-font-weight-medium);
+  color: var(--ds-color-font-0);
+}
+.ds-label__required {
+  color: var(--ds-color-danger);
+}
+
+/* src/components/FormField/FormField.css */
+.ds-form-field {
+  display: flex;
+  flex-direction: column;
+  gap: var(--ds-space-2);
+}
+.ds-form-field__help {
+  font-family: var(--ds-font-body);
+  font-size: var(--ds-font-size-100);
+  color: var(--ds-color-font-1);
+}
+.ds-form-field__error {
+  font-family: var(--ds-font-body);
+  font-size: var(--ds-font-size-100);
+  color: var(--ds-color-danger);
+}
+/*# sourceMappingURL=index.css.map */

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/Label/Label.css","../../../src/components/FormField/FormField.css"],"sourcesContent":[".ds-label {\n  display: inline-flex;\n  align-items: center;\n  gap: var(--ds-space-1);\n  font-family: var(--ds-font-body);\n  font-size: var(--ds-font-size-100);\n  font-weight: var(--ds-font-weight-medium);\n  color: var(--ds-color-font-0);\n}\n\n.ds-label__required {\n  color: var(--ds-color-danger);\n}\n",".ds-form-field {\n  display: flex;\n  flex-direction: column;\n  gap: var(--ds-space-2);\n}\n\n.ds-form-field__help {\n  font-family: var(--ds-font-body);\n  font-size: var(--ds-font-size-100);\n  color: var(--ds-color-font-1);\n}\n\n.ds-form-field__error {\n  font-family: var(--ds-font-body);\n  font-size: var(--ds-font-size-100);\n  color: var(--ds-color-danger);\n}\n"],"mappings":";AAAA,CAAC;AACC,WAAS;AACT,eAAa;AACb,OAAK,IAAI;AACT,eAAa,IAAI;AACjB,aAAW,IAAI;AACf,eAAa,IAAI;AACjB,SAAO,IAAI;AACb;AAEA,CAAC;AACC,SAAO,IAAI;AACb;;;ACZA,CAAC;AACC,WAAS;AACT,kBAAgB;AAChB,OAAK,IAAI;AACX;AAEA,CAAC;AACC,eAAa,IAAI;AACjB,aAAW,IAAI;AACf,SAAO,IAAI;AACb;AAEA,CAAC;AACC,eAAa,IAAI;AACjB,aAAW,IAAI;AACf,SAAO,IAAI;AACb;","names":[]}

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

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

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

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

package/dist/components/FormField/index.js

@@ -0,0 +1,8 @@
+import {
+  FormField
+} from "../../chunk-LPEUQ2DE.js";
+import "../../chunk-VRGTUKSJ.js";
+export {
+  FormField
+};
+//# sourceMappingURL=index.js.map

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

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

package/dist/components/Header/Header.d.ts

@@ -0,0 +1,15 @@
+/**
+ * Generic header shell with brand/nav/actions slots, so each site's
+ * bespoke chrome (song-chart's auth-aware menu + fullscreen toggle,
+ * mattwelker.com's audio-loop toggle + Venmo link, 5voltfx.com's plain
+ * logo-with-text-fallback) stays app-specific and is passed in rather
+ * than encoded into this component.
+ */
+export function Header({ brand, brandHref, links, actions, className, }: {
+    brand: any;
+    brandHref?: string | undefined;
+    links?: never[] | undefined;
+    actions: any;
+    className?: string | undefined;
+}): import("react").JSX.Element;
+//# sourceMappingURL=Header.d.ts.map

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

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

package/dist/components/Header/index.css

@@ -0,0 +1,98 @@
+/* src/components/Nav/Nav.css */
+.ds-nav__list {
+  display: flex;
+  align-items: center;
+  gap: var(--ds-space-5);
+  list-style: none;
+  margin: 0;
+  padding: 0;
+}
+.ds-nav__link {
+  position: relative;
+  display: inline-block;
+  padding: var(--ds-space-2) 0;
+  color: var(--ds-color-font-1);
+  font-family: var(--ds-font-body);
+  font-weight: var(--ds-font-weight-medium);
+  font-size: var(--ds-font-size-100);
+  text-transform: uppercase;
+  letter-spacing: 0.04em;
+  text-decoration: none;
+  transition: color var(--ds-motion-duration-base) var(--ds-motion-ease-standard);
+}
+.ds-nav__link::after {
+  content: "";
+  position: absolute;
+  left: 0;
+  bottom: -2px;
+  width: 100%;
+  height: 2px;
+  background-color: var(--ds-color-bg-2);
+  transform: scaleX(0);
+  transform-origin: left;
+  transition: transform var(--ds-motion-duration-base) var(--ds-motion-ease-standard);
+}
+.ds-nav__link:hover {
+  color: var(--ds-color-font-0);
+}
+.ds-nav__link:hover::after {
+  transform: scaleX(1);
+}
+.ds-nav__link--active {
+  color: var(--ds-color-font-0);
+}
+.ds-nav__link--active::after {
+  transform: scaleX(1);
+}
+@media (width <= 660px) {
+  .ds-nav__list {
+    gap: var(--ds-space-3);
+  }
+  .ds-nav__link {
+    font-size: 0.75rem;
+  }
+}
+
+/* src/components/Header/Header.css */
+.ds-header {
+  background-color: var(--ds-color-bg-0);
+  color: var(--ds-color-font-0);
+  border-bottom: 1px solid var(--ds-color-bw-1);
+  font-family: var(--ds-font-body);
+}
+.ds-header__inner {
+  max-width: 1200px;
+  margin: 0 auto;
+  padding: var(--ds-space-4) var(--ds-space-6);
+  display: flex;
+  align-items: center;
+  gap: var(--ds-space-6);
+}
+.ds-header__brand {
+  display: flex;
+  align-items: center;
+  color: var(--ds-color-font-0);
+  text-decoration: none;
+  font-weight: var(--ds-font-weight-bold);
+  font-size: var(--ds-font-size-300);
+  letter-spacing: 0.02em;
+}
+.ds-header__nav {
+  flex: 1;
+}
+.ds-header__actions {
+  display: flex;
+  align-items: center;
+  gap: var(--ds-space-3);
+  margin-left: auto;
+}
+@media (width <= 480px) {
+  .ds-header__inner {
+    padding: var(--ds-space-3) var(--ds-space-4);
+    gap: var(--ds-space-4);
+  }
+  .ds-header__brand {
+    font-size: var(--ds-font-size-200);
+  }
+}
+/*# sourceMappingURL=index.css.map */

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/Nav/Nav.css","../../../src/components/Header/Header.css"],"sourcesContent":[".ds-nav__list {\n  display: flex;\n  align-items: center;\n  gap: var(--ds-space-5);\n  list-style: none;\n  margin: 0;\n  padding: 0;\n}\n\n.ds-nav__link {\n  position: relative;\n  display: inline-block;\n  padding: var(--ds-space-2) 0;\n  color: var(--ds-color-font-1);\n  font-family: var(--ds-font-body);\n  font-weight: var(--ds-font-weight-medium);\n  font-size: var(--ds-font-size-100);\n  text-transform: uppercase;\n  letter-spacing: 0.04em;\n  text-decoration: none;\n  transition: color var(--ds-motion-duration-base) var(--ds-motion-ease-standard);\n}\n\n.ds-nav__link::after {\n  content: \"\";\n  position: absolute;\n  left: 0;\n  bottom: -2px;\n  width: 100%;\n  height: 2px;\n  background-color: var(--ds-color-bg-2);\n  transform: scaleX(0);\n  transform-origin: left;\n  transition: transform var(--ds-motion-duration-base) var(--ds-motion-ease-standard);\n}\n\n.ds-nav__link:hover {\n  color: var(--ds-color-font-0);\n}\n\n.ds-nav__link:hover::after {\n  transform: scaleX(1);\n}\n\n.ds-nav__link--active {\n  color: var(--ds-color-font-0);\n}\n\n.ds-nav__link--active::after {\n  transform: scaleX(1);\n}\n\n@media (width <= 660px) {\n  .ds-nav__list {\n    gap: var(--ds-space-3);\n  }\n\n  .ds-nav__link {\n    font-size: 0.75rem;\n  }\n}\n",".ds-header {\n  background-color: var(--ds-color-bg-0);\n  color: var(--ds-color-font-0);\n  border-bottom: 1px solid var(--ds-color-bw-1);\n  font-family: var(--ds-font-body);\n}\n\n.ds-header__inner {\n  max-width: 1200px;\n  margin: 0 auto;\n  padding: var(--ds-space-4) var(--ds-space-6);\n  display: flex;\n  align-items: center;\n  gap: var(--ds-space-6);\n}\n\n.ds-header__brand {\n  display: flex;\n  align-items: center;\n  color: var(--ds-color-font-0);\n  text-decoration: none;\n  font-weight: var(--ds-font-weight-bold);\n  font-size: var(--ds-font-size-300);\n  letter-spacing: 0.02em;\n}\n\n.ds-header__nav {\n  flex: 1;\n}\n\n.ds-header__actions {\n  display: flex;\n  align-items: center;\n  gap: var(--ds-space-3);\n  margin-left: auto;\n}\n\n@media (width <= 480px) {\n  .ds-header__inner {\n    padding: var(--ds-space-3) var(--ds-space-4);\n    gap: var(--ds-space-4);\n  }\n\n  .ds-header__brand {\n    font-size: var(--ds-font-size-200);\n  }\n}\n"],"mappings":";AAAA,CAAC;AACC,WAAS;AACT,eAAa;AACb,OAAK,IAAI;AACT,cAAY;AACZ,UAAQ;AACR,WAAS;AACX;AAEA,CAAC;AACC,YAAU;AACV,WAAS;AACT,WAAS,IAAI,cAAc;AAC3B,SAAO,IAAI;AACX,eAAa,IAAI;AACjB,eAAa,IAAI;AACjB,aAAW,IAAI;AACf,kBAAgB;AAChB,kBAAgB;AAChB,mBAAiB;AACjB,cAAY,MAAM,IAAI,2BAA2B,IAAI;AACvD;AAEA,CAdC,YAcY;AACX,WAAS;AACT,YAAU;AACV,QAAM;AACN,UAAQ;AACR,SAAO;AACP,UAAQ;AACR,oBAAkB,IAAI;AACtB,aAAW,OAAO;AAClB,oBAAkB;AAClB,cAAY,UAAU,IAAI,2BAA2B,IAAI;AAC3D;AAEA,CA3BC,YA2BY;AACX,SAAO,IAAI;AACb;AAEA,CA/BC,YA+BY,MAAM;AACjB,aAAW,OAAO;AACpB;AAEA,CAAC;AACC,SAAO,IAAI;AACb;AAEA,CAJC,oBAIoB;AACnB,aAAW,OAAO;AACpB;AAEA,QAAQ,SAAS;AACf,GArDD;AAsDG,SAAK,IAAI;AACX;AAEA,GAhDD;AAiDG,eAAW;AACb;AACF;;;AC5DA,CAAC;AACC,oBAAkB,IAAI;AACtB,SAAO,IAAI;AACX,iBAAe,IAAI,MAAM,IAAI;AAC7B,eAAa,IAAI;AACnB;AAEA,CAAC;AACC,aAAW;AACX,UAAQ,EAAE;AACV,WAAS,IAAI,cAAc,IAAI;AAC/B,WAAS;AACT,eAAa;AACb,OAAK,IAAI;AACX;AAEA,CAAC;AACC,WAAS;AACT,eAAa;AACb,SAAO,IAAI;AACX,mBAAiB;AACjB,eAAa,IAAI;AACjB,aAAW,IAAI;AACf,kBAAgB;AAClB;AAEA,CAAC;AACC,QAAM;AACR;AAEA,CAAC;AACC,WAAS;AACT,eAAa;AACb,OAAK,IAAI;AACT,eAAa;AACf;AAEA,QAAQ,SAAS;AACf,GA/BD;AAgCG,aAAS,IAAI,cAAc,IAAI;AAC/B,SAAK,IAAI;AACX;AAEA,GA3BD;AA4BG,eAAW,IAAI;AACjB;AACF;","names":[]}

package/{src/components/Header/index.js → dist/components/Header/index.d.ts}

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

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

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

package/dist/components/Header/index.js

@@ -0,0 +1,8 @@
+import {
+  Header
+} from "../../chunk-BOPVPQLB.js";
+import "../../chunk-TNWQQ56F.js";
+export {
+  Header
+};
+//# sourceMappingURL=index.js.map

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

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

package/dist/components/Input/Input.d.ts

@@ -0,0 +1,16 @@
+/**
+ * Text-like input. Controlled or uncontrolled — all native <input> props pass
+ * through via `...rest` (value/defaultValue, onChange, type, placeholder, …).
+ *
+ * @param {object} props
+ * @param {"sm"|"md"|"lg"} [props.size] - Control height/padding. Default "md".
+ * @param {boolean} [props.invalid] - Applies error styling + aria-invalid.
+ * @param {string} [props.className]
+ * @returns {import("react").ReactElement}
+ */
+export function Input({ size, invalid, className, ...rest }: {
+    size?: "md" | "sm" | "lg" | undefined;
+    invalid?: boolean | undefined;
+    className?: string | undefined;
+}): import("react").ReactElement;
+//# sourceMappingURL=Input.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../../src/components/Input/Input.jsx"],"names":[],"mappings":"AAEA;;;;;;;;;GASG;AACH,6DALG;IAA+B,IAAI;IACX,OAAO;IACR,SAAS;CAChC,GAAU,OAAO,OAAO,EAAE,YAAY,CAexC"}

package/dist/components/Input/index.css

@@ -0,0 +1,45 @@
+/* src/components/Input/Input.css */
+.ds-input {
+  display: block;
+  width: 100%;
+  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);
+  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-input::placeholder {
+  color: var(--ds-color-font-1);
+  opacity: 1;
+}
+.ds-input--sm {
+  padding: var(--ds-space-2) var(--ds-space-3);
+  font-size: var(--ds-font-size-100);
+}
+.ds-input--md {
+  padding: var(--ds-space-3) var(--ds-space-4);
+}
+.ds-input--lg {
+  padding: var(--ds-space-4) var(--ds-space-5);
+  font-size: var(--ds-font-size-300);
+}
+.ds-input: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-input--invalid {
+  border-color: var(--ds-color-danger);
+}
+.ds-input--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-input:disabled {
+  opacity: 0.5;
+  cursor: not-allowed;
+}
+/*# sourceMappingURL=index.css.map */

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/Input/Input.css"],"sourcesContent":[".ds-input {\n  display: block;\n  width: 100%;\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  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-input::placeholder {\n  color: var(--ds-color-font-1);\n  opacity: 1;\n}\n\n.ds-input--sm {\n  padding: var(--ds-space-2) var(--ds-space-3);\n  font-size: var(--ds-font-size-100);\n}\n\n.ds-input--md {\n  padding: var(--ds-space-3) var(--ds-space-4);\n}\n\n.ds-input--lg {\n  padding: var(--ds-space-4) var(--ds-space-5);\n  font-size: var(--ds-font-size-300);\n}\n\n.ds-input: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-input--invalid {\n  border-color: var(--ds-color-danger);\n}\n\n.ds-input--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-input:disabled {\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n"],"mappings":";AAAA,CAAC;AACC,WAAS;AACT,SAAO;AACP,eAAa,IAAI;AACjB,aAAW,IAAI;AACf,eAAa,IAAI;AACjB,SAAO,IAAI;AACX,oBAAkB,IAAI;AACtB,UAAQ,IAAI,MAAM,IAAI;AACtB,iBAAe,IAAI;AACnB,cACE,aAAa,IAAI,2BAA2B,IAAI,0BAA0B,EAC1E,WAAW,IAAI,2BAA2B,IAAI;AAClD;AAEA,CAfC,QAeQ;AACP,SAAO,IAAI;AACX,WAAS;AACX;AAEA,CAAC;AACC,WAAS,IAAI,cAAc,IAAI;AAC/B,aAAW,IAAI;AACjB;AAEA,CAAC;AACC,WAAS,IAAI,cAAc,IAAI;AACjC;AAEA,CAAC;AACC,WAAS,IAAI,cAAc,IAAI;AAC/B,aAAW,IAAI;AACjB;AAEA,CAlCC,QAkCQ;AACP,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,iBAIiB;AAChB,gBAAc,IAAI;AAClB,cAAY,EAAE,EAAE,EAAE,IAChB,UAAU,GAAG,IAAI,EAAE,IAAI,mBAAmB,GAAG,EAAE;AACnD;AAEA,CAnDC,QAmDQ;AACP,WAAS;AACT,UAAQ;AACV;","names":[]}

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

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

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

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

package/dist/components/Input/index.js

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

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

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

package/dist/components/Label/Label.d.ts

@@ -0,0 +1,15 @@
+/**
+ * Form label primitive. Used standalone or rendered internally by FormField.
+ *
+ * @param {object} props
+ * @param {import("react").ReactNode} [props.children]
+ * @param {boolean} [props.required] - Appends a required marker.
+ * @param {string} [props.className]
+ * @returns {import("react").ReactElement}
+ */
+export function Label({ required, className, children, ...rest }: {
+    children?: import("react").ReactNode;
+    required?: boolean | undefined;
+    className?: string | undefined;
+}): import("react").ReactElement;
+//# sourceMappingURL=Label.d.ts.map