@5voltfx/design-system 0.1.0 → 0.1.1

package/dist/index.css

@@ -0,0 +1,544 @@
+/* src/tokens/colors.css */
+:root {
+  --ds-color-url: #ff8787;
+  --ds-color-visited: #ffb4a2;
+  --ds-color-bg-0: #1a2f2f;
+  --ds-color-bg-1: #2d4a4a;
+  --ds-color-bg-2: #ff6b6b;
+  --ds-color-bg-3: #5c8a8a;
+  --ds-color-bg-4: #f7f0eb;
+  --ds-color-font-0: #fff5f0;
+  --ds-color-font-1: #ffb4a2;
+  --ds-color-font-2: #ff6b6b;
+  --ds-color-font-3: #2d4a4a;
+  --ds-color-font-4: #1a2f2f;
+  --ds-color-bw-0: #142424;
+  --ds-color-bw-1: #2d4a4a;
+  --ds-color-bw-2: #5c8a8a;
+  --ds-color-bw-3: #c5d5d5;
+  --ds-color-bw-4: #fff;
+  --ds-color-highlight: #7c3aed;
+}
+
+/* src/tokens/themes.css */
+[data-theme=ink] {
+  --ds-color-url: #818cf8;
+  --ds-color-visited: #a5b4fc;
+  --ds-color-bg-0: #0d0f14;
+  --ds-color-bg-1: #1a1f2e;
+  --ds-color-bg-2: #6366f1;
+  --ds-color-bg-3: #2d3348;
+  --ds-color-bg-4: #384260;
+  --ds-color-font-0: #ffffff;
+  --ds-color-font-1: #9aa8d4;
+  --ds-color-font-2: #818cf8;
+  --ds-color-font-3: #c5cce8;
+  --ds-color-font-4: #f0f2ff;
+  --ds-color-bw-0: #000;
+  --ds-color-bw-1: #1e2230;
+  --ds-color-bw-2: #4a5068;
+  --ds-color-bw-3: #5a6380;
+  --ds-color-bw-4: #fff;
+  --ds-color-highlight: #fbbf24;
+}
+[data-theme=sage] {
+  --ds-color-url: #7a8578;
+  --ds-color-visited: #8a9388;
+  --ds-color-bg-0: #3a3f38;
+  --ds-color-bg-1: #4a5248;
+  --ds-color-bg-2: #6b7568;
+  --ds-color-bg-3: #9aa392;
+  --ds-color-bg-4: #d4d8d0;
+  --ds-color-font-0: #e8ebe6;
+  --ds-color-font-1: #c5cbc0;
+  --ds-color-font-2: #6b7568;
+  --ds-color-font-3: #5c6359;
+  --ds-color-font-4: #3a3f38;
+  --ds-color-bw-0: #323632;
+  --ds-color-bw-1: #4a5248;
+  --ds-color-bw-2: #6b7568;
+  --ds-color-bw-3: #9aa392;
+  --ds-color-bw-4: #e8ebe6;
+  --ds-color-highlight: #6b4c9a;
+}
+[data-theme=coral] {
+  --ds-color-url: #ff8787;
+  --ds-color-visited: #ffb4a2;
+  --ds-color-bg-0: #1a2f2f;
+  --ds-color-bg-1: #2d4a4a;
+  --ds-color-bg-2: #ff6b6b;
+  --ds-color-bg-3: #5c8a8a;
+  --ds-color-bg-4: #f7f0eb;
+  --ds-color-font-0: #fff5f0;
+  --ds-color-font-1: #ffb4a2;
+  --ds-color-font-2: #ff6b6b;
+  --ds-color-font-3: #2d4a4a;
+  --ds-color-font-4: #1a2f2f;
+  --ds-color-bw-0: #142424;
+  --ds-color-bw-1: #2d4a4a;
+  --ds-color-bw-2: #5c8a8a;
+  --ds-color-bw-3: #c5d5d5;
+  --ds-color-bw-4: #fff;
+  --ds-color-highlight: #7c3aed;
+}
+[data-theme=midnight] {
+  --ds-color-url: #0099cc;
+  --ds-color-visited: #007aa3;
+  --ds-color-bg-0: #000000;
+  --ds-color-bg-1: #111111;
+  --ds-color-bg-2: #00d4ff;
+  --ds-color-bg-3: #ececec;
+  --ds-color-bg-4: #ffffff;
+  --ds-color-font-0: #ffffff;
+  --ds-color-font-1: #555555;
+  --ds-color-font-2: #007799;
+  --ds-color-font-3: #333333;
+  --ds-color-font-4: #000000;
+  --ds-color-bw-0: #000;
+  --ds-color-bw-1: #222;
+  --ds-color-bw-2: #666;
+  --ds-color-bw-3: #bbb;
+  --ds-color-bw-4: #fff;
+  --ds-color-highlight: #ff6600;
+}
+[data-theme=amber] {
+  --ds-color-url: #a0522d;
+  --ds-color-visited: #8b4513;
+  --ds-color-bg-0: #1a1510;
+  --ds-color-bg-1: #2c2218;
+  --ds-color-bg-2: #b8652a;
+  --ds-color-bg-3: #d9cbb0;
+  --ds-color-bg-4: #f5efe3;
+  --ds-color-font-0: #faf6ef;
+  --ds-color-font-1: #6b5344;
+  --ds-color-font-2: #8b6914;
+  --ds-color-font-3: #4a3d30;
+  --ds-color-font-4: #1a1510;
+  --ds-color-bw-0: #100c08;
+  --ds-color-bw-1: #3d2e1f;
+  --ds-color-bw-2: #6b5344;
+  --ds-color-bw-3: #b8a088;
+  --ds-color-bw-4: #fff;
+  --ds-color-highlight: #1d4ed8;
+}
+[data-theme=harvest] {
+  --ds-color-url: #f4230c;
+  --ds-color-visited: #9bb4e2;
+  --ds-color-bg-0: #005558;
+  --ds-color-bg-1: #684022;
+  --ds-color-bg-2: #9f5508;
+  --ds-color-bg-3: #decebd;
+  --ds-color-bg-4: #fdf7e3;
+  --ds-color-font-0: #fdf7e3;
+  --ds-color-font-1: #decebd;
+  --ds-color-font-2: #9f5508;
+  --ds-color-font-3: #684022;
+  --ds-color-font-4: #005558;
+  --ds-color-bw-0: #000;
+  --ds-color-bw-1: #333;
+  --ds-color-bw-2: #666;
+  --ds-color-bw-3: #ccc;
+  --ds-color-bw-4: #fff;
+  --ds-color-highlight: #f4230c;
+}
+
+/* src/tokens/base.css */
+html,
+body {
+  background-color: var(--ds-color-bg-0);
+  color: var(--ds-color-font-0);
+}
+body {
+  margin: 0;
+  min-height: 100vh;
+  font-family: var(--ds-font-body);
+}
+* {
+  box-sizing: border-box;
+}
+
+/* src/tokens/typography.css */
+:root {
+  --ds-font-body:
+    "Space Grotesk",
+    system-ui,
+    -apple-system,
+    "Segoe UI",
+    Roboto,
+    Helvetica,
+    Arial,
+    sans-serif;
+  --ds-font-decorative: "Pangolin", cursive;
+  --ds-font-weight-regular: 400;
+  --ds-font-weight-medium: 500;
+  --ds-font-weight-semibold: 600;
+  --ds-font-weight-bold: 700;
+  --ds-line-height-tight: 1.15;
+  --ds-line-height-normal: 1.5;
+  --ds-line-height-relaxed: 1.7;
+  --ds-font-size-100: 0.8rem;
+  --ds-font-size-200: 1rem;
+  --ds-font-size-300: 1.25rem;
+  --ds-font-size-400: 1.563rem;
+  --ds-font-size-500: 1.953rem;
+  --ds-font-size-600: 2.441rem;
+  --ds-font-size-700: 3.052rem;
+}
+
+/* src/tokens/spacing.css */
+:root {
+  --ds-space-1: 0.25rem;
+  --ds-space-2: 0.5rem;
+  --ds-space-3: 0.75rem;
+  --ds-space-4: 1rem;
+  --ds-space-5: 1.5rem;
+  --ds-space-6: 2rem;
+  --ds-space-7: 3rem;
+  --ds-space-8: 4rem;
+}
+
+/* src/tokens/radius.css */
+:root {
+  --ds-radius-sm: 6px;
+  --ds-radius-md: 10px;
+  --ds-radius-lg: 16px;
+  --ds-radius-pill: 999px;
+}
+
+/* src/tokens/elevation.css */
+:root {
+  --ds-shadow-sm: 0 1px 3px color-mix(in srgb, var(--ds-color-bg-2) 18%, transparent);
+  --ds-shadow-md: 0 6px 16px color-mix(in srgb, var(--ds-color-bg-2) 20%, transparent);
+  --ds-shadow-lg: 0 16px 40px color-mix(in srgb, var(--ds-color-bg-2) 24%, transparent);
+}
+
+/* src/tokens/motion.css */
+:root {
+  --ds-motion-duration-fast: 120ms;
+  --ds-motion-duration-base: 200ms;
+  --ds-motion-duration-slow: 320ms;
+  --ds-motion-ease-standard: cubic-bezier(0.2, 0, 0, 1);
+}
+
+/* src/tokens/index.css */
+
+/* src/components/Button/Button.css */
+.ds-button {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  gap: var(--ds-space-2);
+  border: 1px solid transparent;
+  border-radius: var(--ds-radius-pill);
+  font-family: var(--ds-font-body);
+  font-weight: var(--ds-font-weight-semibold);
+  font-size: var(--ds-font-size-200);
+  line-height: var(--ds-line-height-tight);
+  text-decoration: none;
+  cursor: pointer;
+  transition:
+    background-color var(--ds-motion-duration-base) var(--ds-motion-ease-standard),
+    border-color var(--ds-motion-duration-base) var(--ds-motion-ease-standard),
+    color var(--ds-motion-duration-base) var(--ds-motion-ease-standard),
+    transform var(--ds-motion-duration-fast) var(--ds-motion-ease-standard),
+    box-shadow var(--ds-motion-duration-base) var(--ds-motion-ease-standard);
+}
+.ds-button--md {
+  padding: var(--ds-space-3) var(--ds-space-5);
+}
+.ds-button--sm {
+  padding: var(--ds-space-2) var(--ds-space-4);
+  font-size: var(--ds-font-size-100);
+}
+.ds-button--lg {
+  padding: var(--ds-space-4) var(--ds-space-6);
+  font-size: var(--ds-font-size-300);
+}
+.ds-button--primary {
+  background-color: var(--ds-color-bg-2);
+  color: var(--ds-color-font-0);
+  box-shadow: var(--ds-shadow-sm);
+}
+.ds-button--primary:hover {
+  transform: translateY(-1px);
+  box-shadow: var(--ds-shadow-md);
+}
+.ds-button--secondary {
+  background-color: transparent;
+  color: var(--ds-color-font-0);
+  border-color: var(--ds-color-bw-3);
+}
+.ds-button--secondary:hover {
+  background-color: var(--ds-color-bw-1);
+}
+.ds-button--ghost {
+  background: transparent;
+  color: var(--ds-color-font-1);
+  padding-inline: var(--ds-space-3);
+}
+.ds-button--ghost:hover {
+  color: var(--ds-color-font-0);
+}
+.ds-button:focus-visible {
+  outline: 2px solid var(--ds-color-bg-2);
+  outline-offset: 2px;
+}
+.ds-button:disabled {
+  opacity: 0.5;
+  cursor: not-allowed;
+  transform: none;
+  box-shadow: none;
+}
+
+/* src/components/Card/Card.css */
+.ds-card {
+  background-color: var(--ds-color-bg-1);
+  color: var(--ds-color-font-0);
+  border: 1px solid var(--ds-color-bw-1);
+  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);
+}
+
+/* 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);
+  }
+}
+
+/* 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;
+  padding: var(--ds-space-4) var(--ds-space-6);
+  display: flex;
+  align-items: center;
+  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;
+  }
+}
+
+/* src/components/Typography/Typography.css */
+.ds-heading {
+  margin: 0;
+  font-family: var(--ds-font-body);
+  font-weight: var(--ds-font-weight-bold);
+  line-height: var(--ds-line-height-tight);
+  color: var(--ds-color-font-0);
+}
+.ds-heading--decorative {
+  font-family: var(--ds-font-decorative);
+  font-weight: var(--ds-font-weight-regular);
+}
+.ds-heading--700 {
+  font-size: var(--ds-font-size-700);
+}
+.ds-heading--600 {
+  font-size: var(--ds-font-size-600);
+}
+.ds-heading--500 {
+  font-size: var(--ds-font-size-500);
+}
+.ds-heading--400 {
+  font-size: var(--ds-font-size-400);
+}
+.ds-heading--300 {
+  font-size: var(--ds-font-size-300);
+}
+.ds-heading--200 {
+  font-size: var(--ds-font-size-200);
+}
+.ds-text {
+  margin: 0;
+  font-family: var(--ds-font-body);
+  font-weight: var(--ds-font-weight-regular);
+  line-height: var(--ds-line-height-normal);
+  color: var(--ds-color-font-0);
+}
+.ds-text--100 {
+  font-size: var(--ds-font-size-100);
+}
+.ds-text--200 {
+  font-size: var(--ds-font-size-200);
+}
+.ds-text--300 {
+  font-size: var(--ds-font-size-300);
+}
+.ds-text--muted {
+  color: var(--ds-color-font-1);
+}
+
+/* src/components/Layout/Layout.css */
+.ds-container {
+  max-width: 1200px;
+  margin: 0 auto;
+  padding: 0 var(--ds-space-6);
+}
+@media (width <= 660px) {
+  .ds-container {
+    padding: 0 var(--ds-space-4);
+  }
+}
+.ds-stack {
+  display: flex;
+  gap: var(--ds-stack-gap, var(--ds-space-4));
+}
+.ds-grid {
+  display: grid;
+}
+@media (width <= 660px) {
+  .ds-grid {
+    grid-template-columns: 1fr !important;
+  }
+}
+/*# sourceMappingURL=index.css.map */

package/dist/index.css.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/tokens/colors.css","../src/tokens/themes.css","../src/tokens/base.css","../src/tokens/typography.css","../src/tokens/spacing.css","../src/tokens/radius.css","../src/tokens/elevation.css","../src/tokens/motion.css","../src/components/Button/Button.css","../src/components/Card/Card.css","../src/components/Nav/Nav.css","../src/components/Header/Header.css","../src/components/ThemeSwitcher/ThemeSwitcher.css","../src/components/Footer/Footer.css","../src/components/Typography/Typography.css","../src/components/Layout/Layout.css"],"sourcesContent":["/*\n  Base color token shape. Every theme in themes.css overrides this full set\n  via [data-theme=\"<id>\"]. These :root values are the default (coral) theme,\n  so components render sensibly even before ThemeProvider sets data-theme.\n*/\n:root {\n  --ds-color-url: #ff8787;\n  --ds-color-visited: #ffb4a2;\n\n  --ds-color-bg-0: #1a2f2f;\n  --ds-color-bg-1: #2d4a4a;\n  --ds-color-bg-2: #ff6b6b;\n  --ds-color-bg-3: #5c8a8a;\n  --ds-color-bg-4: #f7f0eb;\n\n  --ds-color-font-0: #fff5f0;\n  --ds-color-font-1: #ffb4a2;\n  --ds-color-font-2: #ff6b6b;\n  --ds-color-font-3: #2d4a4a;\n  --ds-color-font-4: #1a2f2f;\n\n  --ds-color-bw-0: #142424;\n  --ds-color-bw-1: #2d4a4a;\n  --ds-color-bw-2: #5c8a8a;\n  --ds-color-bw-3: #c5d5d5;\n  --ds-color-bw-4: #fff;\n\n  --ds-color-highlight: #7c3aed;\n}\n","/*\n  Canonical theme set. Carries song-chart's 5 themes forward near-verbatim\n  (ink, sage, coral, midnight, amber) plus one new \"harvest\" theme\n  consolidating mattwelker.com's warm/retro/cirro family into a single palette.\n  Applied via ThemeProvider setting data-theme=\"<id>\" on <html>.\n*/\n\n[data-theme=\"ink\"] {\n  --ds-color-url: #818cf8;\n  --ds-color-visited: #a5b4fc;\n\n  --ds-color-bg-0: #0d0f14;\n  --ds-color-bg-1: #1a1f2e;\n  --ds-color-bg-2: #6366f1;\n  --ds-color-bg-3: #2d3348;\n  --ds-color-bg-4: #384260;\n\n  --ds-color-font-0: #ffffff;\n  --ds-color-font-1: #9aa8d4;\n  --ds-color-font-2: #818cf8;\n  --ds-color-font-3: #c5cce8;\n  --ds-color-font-4: #f0f2ff;\n\n  --ds-color-bw-0: #000;\n  --ds-color-bw-1: #1e2230;\n  --ds-color-bw-2: #4a5068;\n  --ds-color-bw-3: #5a6380;\n  --ds-color-bw-4: #fff;\n\n  --ds-color-highlight: #fbbf24;\n}\n\n[data-theme=\"sage\"] {\n  --ds-color-url: #7a8578;\n  --ds-color-visited: #8a9388;\n\n  --ds-color-bg-0: #3a3f38;\n  --ds-color-bg-1: #4a5248;\n  --ds-color-bg-2: #6b7568;\n  --ds-color-bg-3: #9aa392;\n  --ds-color-bg-4: #d4d8d0;\n\n  --ds-color-font-0: #e8ebe6;\n  --ds-color-font-1: #c5cbc0;\n  --ds-color-font-2: #6b7568;\n  --ds-color-font-3: #5c6359;\n  --ds-color-font-4: #3a3f38;\n\n  --ds-color-bw-0: #323632;\n  --ds-color-bw-1: #4a5248;\n  --ds-color-bw-2: #6b7568;\n  --ds-color-bw-3: #9aa392;\n  --ds-color-bw-4: #e8ebe6;\n\n  --ds-color-highlight: #6b4c9a;\n}\n\n[data-theme=\"coral\"] {\n  --ds-color-url: #ff8787;\n  --ds-color-visited: #ffb4a2;\n\n  --ds-color-bg-0: #1a2f2f;\n  --ds-color-bg-1: #2d4a4a;\n  --ds-color-bg-2: #ff6b6b;\n  --ds-color-bg-3: #5c8a8a;\n  --ds-color-bg-4: #f7f0eb;\n\n  --ds-color-font-0: #fff5f0;\n  --ds-color-font-1: #ffb4a2;\n  --ds-color-font-2: #ff6b6b;\n  --ds-color-font-3: #2d4a4a;\n  --ds-color-font-4: #1a2f2f;\n\n  --ds-color-bw-0: #142424;\n  --ds-color-bw-1: #2d4a4a;\n  --ds-color-bw-2: #5c8a8a;\n  --ds-color-bw-3: #c5d5d5;\n  --ds-color-bw-4: #fff;\n\n  --ds-color-highlight: #7c3aed;\n}\n\n[data-theme=\"midnight\"] {\n  --ds-color-url: #0099cc;\n  --ds-color-visited: #007aa3;\n\n  --ds-color-bg-0: #000000;\n  --ds-color-bg-1: #111111;\n  --ds-color-bg-2: #00d4ff;\n  --ds-color-bg-3: #ececec;\n  --ds-color-bg-4: #ffffff;\n\n  --ds-color-font-0: #ffffff;\n  --ds-color-font-1: #555555;\n  --ds-color-font-2: #007799;\n  --ds-color-font-3: #333333;\n  --ds-color-font-4: #000000;\n\n  --ds-color-bw-0: #000;\n  --ds-color-bw-1: #222;\n  --ds-color-bw-2: #666;\n  --ds-color-bw-3: #bbb;\n  --ds-color-bw-4: #fff;\n\n  --ds-color-highlight: #ff6600;\n}\n\n[data-theme=\"amber\"] {\n  --ds-color-url: #a0522d;\n  --ds-color-visited: #8b4513;\n\n  --ds-color-bg-0: #1a1510;\n  --ds-color-bg-1: #2c2218;\n  --ds-color-bg-2: #b8652a;\n  --ds-color-bg-3: #d9cbb0;\n  --ds-color-bg-4: #f5efe3;\n\n  --ds-color-font-0: #faf6ef;\n  --ds-color-font-1: #6b5344;\n  --ds-color-font-2: #8b6914;\n  --ds-color-font-3: #4a3d30;\n  --ds-color-font-4: #1a1510;\n\n  --ds-color-bw-0: #100c08;\n  --ds-color-bw-1: #3d2e1f;\n  --ds-color-bw-2: #6b5344;\n  --ds-color-bw-3: #b8a088;\n  --ds-color-bw-4: #fff;\n\n  --ds-color-highlight: #1d4ed8;\n}\n\n[data-theme=\"harvest\"] {\n  --ds-color-url: #f4230c;\n  --ds-color-visited: #9bb4e2;\n\n  --ds-color-bg-0: #005558;\n  --ds-color-bg-1: #684022;\n  --ds-color-bg-2: #9f5508;\n  --ds-color-bg-3: #decebd;\n  --ds-color-bg-4: #fdf7e3;\n\n  --ds-color-font-0: #fdf7e3;\n  --ds-color-font-1: #decebd;\n  --ds-color-font-2: #9f5508;\n  --ds-color-font-3: #684022;\n  --ds-color-font-4: #005558;\n\n  --ds-color-bw-0: #000;\n  --ds-color-bw-1: #333;\n  --ds-color-bw-2: #666;\n  --ds-color-bw-3: #ccc;\n  --ds-color-bw-4: #fff;\n\n  --ds-color-highlight: #f4230c;\n}\n","/*\n  Every theme pairs bg-0 (page surface) with font-0 (on-surface text) —\n  without this, the page background stays the browser default (white) while\n  text/components assume a themed surface behind them, e.g. font-0 is\n  near-white in every theme because it's meant to sit on the dark bg-0.\n*/\nhtml,\nbody {\n  background-color: var(--ds-color-bg-0);\n  color: var(--ds-color-font-0);\n}\n\nbody {\n  margin: 0;\n  min-height: 100vh;\n  font-family: var(--ds-font-body);\n}\n\n* {\n  box-sizing: border-box;\n}\n","/*\n  Shared type scale. Space Grotesk is already used by song-chart and\n  mattwelker.com; consuming apps must load the Google Fonts <link> themselves\n  (this package doesn't inject font-loading side effects). Pangolin is kept\n  as an optional decorative token for mattwelker.com's setlist page only.\n*/\n:root {\n  --ds-font-body: \"Space Grotesk\", system-ui, -apple-system, \"Segoe UI\", Roboto,\n    Helvetica, Arial, sans-serif;\n  --ds-font-decorative: \"Pangolin\", cursive;\n\n  --ds-font-weight-regular: 400;\n  --ds-font-weight-medium: 500;\n  --ds-font-weight-semibold: 600;\n  --ds-font-weight-bold: 700;\n\n  --ds-line-height-tight: 1.15;\n  --ds-line-height-normal: 1.5;\n  --ds-line-height-relaxed: 1.7;\n\n  /* modular scale, ~1.25 ratio, base 1rem */\n  --ds-font-size-100: 0.8rem;\n  --ds-font-size-200: 1rem;\n  --ds-font-size-300: 1.25rem;\n  --ds-font-size-400: 1.563rem;\n  --ds-font-size-500: 1.953rem;\n  --ds-font-size-600: 2.441rem;\n  --ds-font-size-700: 3.052rem;\n}\n",":root {\n  --ds-space-1: 0.25rem;\n  --ds-space-2: 0.5rem;\n  --ds-space-3: 0.75rem;\n  --ds-space-4: 1rem;\n  --ds-space-5: 1.5rem;\n  --ds-space-6: 2rem;\n  --ds-space-7: 3rem;\n  --ds-space-8: 4rem;\n}\n",":root {\n  --ds-radius-sm: 6px;\n  --ds-radius-md: 10px;\n  --ds-radius-lg: 16px;\n  --ds-radius-pill: 999px;\n}\n","/*\n  Shadows are tinted with the active theme's accent (--ds-color-bg-2) at low\n  opacity rather than flat black, since none of the 3 sites uses any shadow\n  today and a flat-black shadow would read as generic rather than \"on-brand\".\n*/\n:root {\n  --ds-shadow-sm: 0 1px 3px color-mix(in srgb, var(--ds-color-bg-2) 18%, transparent);\n  --ds-shadow-md: 0 6px 16px color-mix(in srgb, var(--ds-color-bg-2) 20%, transparent);\n  --ds-shadow-lg: 0 16px 40px color-mix(in srgb, var(--ds-color-bg-2) 24%, transparent);\n}\n",":root {\n  --ds-motion-duration-fast: 120ms;\n  --ds-motion-duration-base: 200ms;\n  --ds-motion-duration-slow: 320ms;\n  --ds-motion-ease-standard: cubic-bezier(0.2, 0, 0, 1);\n}\n",".ds-button {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  gap: var(--ds-space-2);\n  border: 1px solid transparent;\n  border-radius: var(--ds-radius-pill);\n  font-family: var(--ds-font-body);\n  font-weight: var(--ds-font-weight-semibold);\n  font-size: var(--ds-font-size-200);\n  line-height: var(--ds-line-height-tight);\n  text-decoration: none;\n  cursor: pointer;\n  transition:\n    background-color var(--ds-motion-duration-base) var(--ds-motion-ease-standard),\n    border-color var(--ds-motion-duration-base) var(--ds-motion-ease-standard),\n    color var(--ds-motion-duration-base) var(--ds-motion-ease-standard),\n    transform var(--ds-motion-duration-fast) var(--ds-motion-ease-standard),\n    box-shadow var(--ds-motion-duration-base) var(--ds-motion-ease-standard);\n}\n\n.ds-button--md {\n  padding: var(--ds-space-3) var(--ds-space-5);\n}\n\n.ds-button--sm {\n  padding: var(--ds-space-2) var(--ds-space-4);\n  font-size: var(--ds-font-size-100);\n}\n\n.ds-button--lg {\n  padding: var(--ds-space-4) var(--ds-space-6);\n  font-size: var(--ds-font-size-300);\n}\n\n.ds-button--primary {\n  background-color: var(--ds-color-bg-2);\n  color: var(--ds-color-font-0);\n  box-shadow: var(--ds-shadow-sm);\n}\n\n.ds-button--primary:hover {\n  transform: translateY(-1px);\n  box-shadow: var(--ds-shadow-md);\n}\n\n.ds-button--secondary {\n  background-color: transparent;\n  color: var(--ds-color-font-0);\n  border-color: var(--ds-color-bw-3);\n}\n\n.ds-button--secondary:hover {\n  background-color: var(--ds-color-bw-1);\n}\n\n.ds-button--ghost {\n  background: transparent;\n  color: var(--ds-color-font-1);\n  padding-inline: var(--ds-space-3);\n}\n\n.ds-button--ghost:hover {\n  color: var(--ds-color-font-0);\n}\n\n.ds-button:focus-visible {\n  outline: 2px solid var(--ds-color-bg-2);\n  outline-offset: 2px;\n}\n\n.ds-button:disabled {\n  opacity: 0.5;\n  cursor: not-allowed;\n  transform: none;\n  box-shadow: none;\n}\n",".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",".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",".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",".ds-heading {\n  margin: 0;\n  font-family: var(--ds-font-body);\n  font-weight: var(--ds-font-weight-bold);\n  line-height: var(--ds-line-height-tight);\n  color: var(--ds-color-font-0);\n}\n\n.ds-heading--decorative {\n  font-family: var(--ds-font-decorative);\n  font-weight: var(--ds-font-weight-regular);\n}\n\n.ds-heading--700 { font-size: var(--ds-font-size-700); }\n.ds-heading--600 { font-size: var(--ds-font-size-600); }\n.ds-heading--500 { font-size: var(--ds-font-size-500); }\n.ds-heading--400 { font-size: var(--ds-font-size-400); }\n.ds-heading--300 { font-size: var(--ds-font-size-300); }\n.ds-heading--200 { font-size: var(--ds-font-size-200); }\n\n.ds-text {\n  margin: 0;\n  font-family: var(--ds-font-body);\n  font-weight: var(--ds-font-weight-regular);\n  line-height: var(--ds-line-height-normal);\n  color: var(--ds-color-font-0);\n}\n\n.ds-text--100 { font-size: var(--ds-font-size-100); }\n.ds-text--200 { font-size: var(--ds-font-size-200); }\n.ds-text--300 { font-size: var(--ds-font-size-300); }\n\n.ds-text--muted {\n  color: var(--ds-color-font-1);\n}\n",".ds-container {\n  max-width: 1200px;\n  margin: 0 auto;\n  padding: 0 var(--ds-space-6);\n}\n\n@media (width <= 660px) {\n  .ds-container {\n    padding: 0 var(--ds-space-4);\n  }\n}\n\n.ds-stack {\n  display: flex;\n  gap: var(--ds-stack-gap, var(--ds-space-4));\n}\n\n.ds-grid {\n  display: grid;\n}\n\n@media (width <= 660px) {\n  .ds-grid {\n    grid-template-columns: 1fr !important;\n  }\n}\n"],"mappings":"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","names":[]}

package/dist/index.js

@@ -0,0 +1,116 @@
+import "./chunk-AYAMNHNF.js";
+import {
+  Button
+} from "./chunk-U6JTDANG.js";
+import {
+  Card
+} from "./chunk-3LTHHL5C.js";
+import {
+  Footer
+} from "./chunk-5KN5TPGG.js";
+import {
+  ThemeContext,
+  ThemeSwitcher,
+  useTheme
+} from "./chunk-YCZXDQJZ.js";
+import {
+  Header
+} from "./chunk-BOPVPQLB.js";
+import "./chunk-NE25337V.js";
+import {
+  Nav
+} from "./chunk-TNWQQ56F.js";
+import {
+  Container,
+  Grid,
+  Stack
+} from "./chunk-SFECTSQP.js";
+import {
+  Heading,
+  Text
+} from "./chunk-EW3S3GK6.js";
+
+// src/theme/ThemeProvider.jsx
+import { useCallback, useLayoutEffect, useMemo, useState } from "react";
+
+// src/theme/themeConstants.js
+var THEMES = [
+  { id: "coral", label: "Coral \u2014 creative warm", swatch: "#ff6b6b" },
+  { id: "ink", label: "Ink \u2014 dark indigo", swatch: "#6366f1" },
+  { id: "sage", label: "Sage \u2014 muted olive", swatch: "#6b7568" },
+  { id: "midnight", label: "Midnight \u2014 high contrast", swatch: "#00d4ff" },
+  { id: "amber", label: "Amber \u2014 golden", swatch: "#b8652a" },
+  { id: "harvest", label: "Harvest \u2014 earthy warm", swatch: "#9f5508" }
+];
+var THEME_IDS = THEMES.map((theme) => theme.id);
+var DEFAULT_THEME = "coral";
+
+// src/theme/ThemeProvider.jsx
+import { jsx } from "react/jsx-runtime";
+function readStoredTheme(storageKey, fallback) {
+  if (typeof window === "undefined") return fallback;
+  try {
+    const stored = window.localStorage.getItem(storageKey);
+    return THEME_IDS.includes(stored) ? stored : fallback;
+  } catch {
+    return fallback;
+  }
+}
+function ThemeProvider({
+  children,
+  storageKey = "ds.theme",
+  defaultTheme = DEFAULT_THEME,
+  onThemeChange
+}) {
+  const [theme, setThemeState] = useState(
+    () => readStoredTheme(storageKey, defaultTheme)
+  );
+  useLayoutEffect(() => {
+    document.documentElement.setAttribute("data-theme", theme);
+    try {
+      window.localStorage.setItem(storageKey, theme);
+    } catch {
+    }
+  }, [theme, storageKey]);
+  useLayoutEffect(() => {
+    function handleStorage(event) {
+      if (event.key === storageKey && THEME_IDS.includes(event.newValue)) {
+        setThemeState(event.newValue);
+      }
+    }
+    window.addEventListener("storage", handleStorage);
+    return () => window.removeEventListener("storage", handleStorage);
+  }, [storageKey]);
+  const setTheme = useCallback(
+    (id) => {
+      if (!THEME_IDS.includes(id)) return;
+      setThemeState(id);
+      onThemeChange?.(id);
+    },
+    [onThemeChange]
+  );
+  const value = useMemo(
+    () => ({ theme, setTheme, themes: THEMES }),
+    [theme, setTheme]
+  );
+  return /* @__PURE__ */ jsx(ThemeContext.Provider, { value, children });
+}
+export {
+  Button,
+  Card,
+  Container,
+  DEFAULT_THEME,
+  Footer,
+  Grid,
+  Header,
+  Heading,
+  Nav,
+  Stack,
+  THEMES,
+  THEME_IDS,
+  Text,
+  ThemeProvider,
+  ThemeSwitcher,
+  useTheme
+};
+//# sourceMappingURL=index.js.map