@gomiui/theme-dovisual 0.0.1

package/dist/source.mjs

@@ -0,0 +1,474 @@
+import {
+  dovisualIconRegistry
+} from "./chunk-T3V2F3XP.mjs";
+
+// src/dovisualTheme.ts
+import { defineTheme } from "@gomiui/core/theme";
+var dovisualTheme = defineTheme({
+  name: "dovisual",
+  // Typography: Poppins (body) / DM Sans (heading) / JetBrains Mono (code),
+  // ported from the Astryx design system. Scale stays at the platform
+  // default (base=14, ratio=1.2); --text-display-3-leading is overridden
+  // below to give Poppins slightly more breathing room at that size.
+  //
+  // NOTE: defineTheme only ever emits `font-family:` — it never loads a
+  // font file. Poppins, DM Sans, and JetBrains Mono must still be loaded
+  // by the consuming app (Google Fonts <link> or self-hosted @font-face).
+  // See `bun gomiui docs typography` for the snippet.
+  typography: {
+    scale: { base: 14, ratio: 1.2 },
+    body: {
+      family: "Poppins",
+      fallbacks: '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif'
+    },
+    heading: {
+      family: "DM Sans",
+      fallbacks: '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif'
+    },
+    code: {
+      family: "JetBrains Mono",
+      fallbacks: '"SF Mono", Monaco, Consolas, "Liberation Mono", "Courier New", monospace'
+    }
+  },
+  tokens: {
+    "--color-accent": "light-dark(#87E64B, #87E64B)",
+    "--color-accent-muted": "light-dark(#25252a14, #f3f3f520)",
+    "--color-on-accent": "light-dark(#ffffff, #25252a)",
+    "--color-neutral": "light-dark(#25252a0f, #f3f3f51a)",
+    "--color-background-surface": "light-dark(#E0E0E0, #1b1b1f)",
+    "--color-background-body": "light-dark(#F2F2F2, #111015)",
+    "--color-overlay": "light-dark(#25252a80, #28282acc)",
+    "--color-overlay-hover": "light-dark(#25252a0d, #f3f3f50d)",
+    "--color-overlay-pressed": "light-dark(#25252a1a, #f3f3f51a)",
+    "--color-background-muted": "light-dark(#A9A9B2, #3b3b3f)",
+    "--color-text-primary": "light-dark(#25252a, #f3f3f5)",
+    "--color-text-secondary": "light-dark(#5e5e63, #ababb0)",
+    "--color-text-disabled": "light-dark(#d7d7da, #5e5e61)",
+    "--color-text-accent": "light-dark(#25252a, #f3f3f5)",
+    "--color-on-dark": "#FFFFFF",
+    "--color-on-light": "light-dark(#25252a, #28282a)",
+    "--color-icon-accent": "light-dark(#25252a, #f3f3f5)",
+    "--color-icon-primary": "light-dark(#25252a, #f3f3f5)",
+    "--color-icon-secondary": "light-dark(#83838a, #9d9da3)",
+    "--color-icon-disabled": "light-dark(#d7d7da, #5e5e61)",
+    "--color-background-card": "light-dark(#F7F7F7, #242325)",
+    "--color-background-popover": "light-dark(#ffffff, #25252a)",
+    "--color-background-inverted": "light-dark(#25252a, #f3f3f5)",
+    "--color-success": "light-dark(#374c36, #b4cdb2)",
+    "--color-success-muted": "light-dark(#d0e9ce, #b4cdb2)",
+    "--color-on-success": "light-dark(#374c36, #d0e9ce)",
+    "--color-error": "light-dark(#58413e, #dcc0bc)",
+    "--color-error-muted": "light-dark(#f9dcd7, #dcc0bc)",
+    "--color-on-error": "light-dark(#58413e, #f9dcd7)",
+    "--color-warning": "light-dark(#524622, #d7c59c)",
+    "--color-warning-muted": "light-dark(#f4e1b7, #d7c59c)",
+    "--color-on-warning": "light-dark(#524622, #f4e1b7)",
+    "--color-border": "light-dark(#e2e2e8, #f3f3f51a)",
+    "--color-border-emphasized": "light-dark(#83838a, #5e5e61)",
+    "--color-skeleton": "light-dark(#d4d4da, #5e5e64)",
+    "--color-shadow": "light-dark(#25252a1a, #0000004d)",
+    "--color-background-blue": "light-dark(#d7e4f5, #485362)",
+    "--color-border-blue": "light-dark(#c9d6e7, #313c4a)",
+    "--color-icon-blue": "light-dark(#3c4856, #d7e4f5)",
+    "--color-text-blue": "light-dark(#3c4856, #d7e4f5)",
+    "--color-background-cyan": "light-dark(#cce8e5, #3e5755)",
+    "--color-border-cyan": "light-dark(#bedad7, #28403e)",
+    "--color-icon-cyan": "light-dark(#334b49, #cce8e5)",
+    "--color-text-cyan": "light-dark(#334b49, #cce8e5)",
+    "--color-background-gray": "light-dark(#e2e2e8, #525257)",
+    "--color-border-gray": "light-dark(#d4d4da, #3b3b3f)",
+    "--color-icon-gray": "light-dark(#46464b, #e2e2e8)",
+    "--color-text-gray": "light-dark(#46464b, #e2e2e8)",
+    "--color-background-green": "light-dark(#d0e9ce, #425841)",
+    "--color-border-green": "light-dark(#c2dbc0, #2b402b)",
+    "--color-icon-green": "light-dark(#374c36, #d0e9ce)",
+    "--color-text-green": "light-dark(#374c36, #d0e9ce)",
+    "--color-background-orange": "light-dark(#ffdcbb, #684d32)",
+    "--color-border-orange": "light-dark(#f1ceae, #4f361c)",
+    "--color-icon-orange": "light-dark(#5b4227, #ffdcbb)",
+    "--color-text-orange": "light-dark(#5b4227, #ffdcbb)",
+    "--color-background-pink": "light-dark(#f0dde8, #5e4e57)",
+    "--color-border-pink": "light-dark(#e2cfda, #463740)",
+    "--color-icon-pink": "light-dark(#52424c, #f0dde8)",
+    "--color-text-pink": "light-dark(#52424c, #f0dde8)",
+    "--color-background-purple": "light-dark(#e8dff3, #564f60)",
+    "--color-border-purple": "light-dark(#d9d1e5, #3f3949)",
+    "--color-icon-purple": "light-dark(#4b4454, #e8dff3)",
+    "--color-text-purple": "light-dark(#4b4454, #e8dff3)",
+    "--color-background-red": "light-dark(#f9dcd7, #644d49)",
+    "--color-border-red": "light-dark(#ebcec9, #4c3633)",
+    "--color-icon-red": "light-dark(#58413e, #f9dcd7)",
+    "--color-text-red": "light-dark(#58413e, #f9dcd7)",
+    "--color-background-teal": "light-dark(#d4e7dc, #46564d)",
+    "--color-border-teal": "light-dark(#c6d9ce, #303f36)",
+    "--color-icon-teal": "light-dark(#3b4a41, #d4e7dc)",
+    "--color-text-teal": "light-dark(#3b4a41, #d4e7dc)",
+    "--color-background-yellow": "light-dark(#f4e1b7, #5e512d)",
+    "--color-border-yellow": "light-dark(#e5d3a9, #463a18)",
+    "--color-icon-yellow": "light-dark(#524622, #f4e1b7)",
+    "--color-text-yellow": "light-dark(#524622, #f4e1b7)",
+    "--spacing-0-5": "4px",
+    "--spacing-1": "8px",
+    "--spacing-1-5": "12px",
+    "--spacing-2": "16px",
+    "--spacing-3": "24px",
+    "--spacing-4": "32px",
+    "--spacing-5": "40px",
+    "--spacing-6": "48px",
+    "--spacing-7": "56px",
+    "--spacing-8": "64px",
+    "--spacing-9": "72px",
+    "--spacing-10": "80px",
+    "--spacing-11": "88px",
+    "--spacing-12": "96px",
+    "--radius-inner": "8px",
+    "--radius-element": "16px",
+    "--radius-container": "24px",
+    "--radius-page": "56px",
+    "--radius-chat": "56px",
+    "--text-display-3-leading": "1.3793",
+    "--shadow-low": "0 2px 4px #28282A0D, 0 4px 8px #28282A1A",
+    "--shadow-med": "0 2px 4px #28282A0D, 0 4px 12px #28282A1A",
+    "--shadow-high": "0 4px 6px #28282A1A, 0 12px 24px #28282A26",
+    "--shadow-inset-hover": "inset 0px 0px 0px 2px #28282A30",
+    "--shadow-inset-selected": "inset 0px 0px 0px 2px #28282A50",
+    "--shadow-inset-success": "inset 0px 0px 0px 2px #83838a30",
+    "--shadow-inset-warning": "inset 0px 0px 0px 2px #83838a30",
+    "--shadow-inset-error": "inset 0px 0px 0px 2px #83838a30",
+    "--duration-fast-min": "95ms",
+    "--duration-fast": "125ms",
+    "--duration-fast-max": "165ms",
+    "--duration-medium-min": "225ms",
+    "--duration-medium": "300ms",
+    "--duration-medium-max": "400ms",
+    "--duration-slow-min": "525ms",
+    "--duration-slow": "700ms",
+    "--duration-slow-max": "935ms",
+    "--color-syntax-keyword": "light-dark(#645a72, #b2a7c1)",
+    "--color-syntax-string": "light-dark(#4e6357, #9bb19a)",
+    "--color-syntax-comment": "light-dark(#5e5e5e, #ababb0)",
+    "--color-syntax-number": "light-dark(#755752, #bea792)",
+    "--color-syntax-function": "light-dark(#506072, #99adc6)",
+    "--color-syntax-type": "light-dark(#645a72, #b2a7c1)",
+    "--color-syntax-variable": "light-dark(#5e5e5e, #ababb0)",
+    "--color-syntax-operator": "light-dark(#5e5e5e, #ababb0)",
+    "--color-syntax-constant": "light-dark(#755752, #bea792)",
+    "--color-syntax-tag": "light-dark(#775751, #c7a39d)",
+    "--color-syntax-attribute": "light-dark(#79693f, #b6aa90)",
+    "--color-syntax-property": "light-dark(#4e6357, #94b2a0)",
+    "--color-syntax-punctuation": "light-dark(#5e5e5e, #ababb0)",
+    "--color-syntax-background": "light-dark(#f3f3f5, #171719)"
+  },
+  components: {
+    "heading": {
+      "level:1": {
+        "fontFamily": "var(--font-family-heading)",
+        "fontSize": "var(--text-heading-1-size)",
+        "fontWeight": "var(--text-heading-1-weight)",
+        "lineHeight": "var(--text-heading-1-leading)"
+      },
+      "level:2": {
+        "fontFamily": "var(--font-family-heading)",
+        "fontSize": "var(--text-heading-2-size)",
+        "fontWeight": "var(--text-heading-2-weight)",
+        "lineHeight": "var(--text-heading-2-leading)"
+      },
+      "level:3": {
+        "fontFamily": "var(--font-family-heading)",
+        "fontSize": "var(--text-heading-3-size)",
+        "fontWeight": "var(--text-heading-3-weight)",
+        "lineHeight": "var(--text-heading-3-leading)"
+      },
+      "level:4": {
+        "fontFamily": "var(--font-family-heading)",
+        "fontSize": "var(--text-heading-4-size)",
+        "fontWeight": "var(--text-heading-4-weight)",
+        "lineHeight": "var(--text-heading-4-leading)"
+      },
+      "level:5": {
+        "fontFamily": "var(--font-family-heading)",
+        "fontSize": "var(--text-heading-5-size)",
+        "fontWeight": "var(--text-heading-5-weight)",
+        "lineHeight": "var(--text-heading-5-leading)"
+      },
+      "level:6": {
+        "fontFamily": "var(--font-family-heading)",
+        "fontSize": "var(--text-heading-6-size)",
+        "fontWeight": "var(--text-heading-6-weight)",
+        "lineHeight": "var(--text-heading-6-leading)"
+      },
+      "type:display-1": {
+        "fontFamily": "var(--font-family-heading)",
+        "fontSize": "var(--text-display-1-size)",
+        "lineHeight": "var(--text-display-1-leading)"
+      },
+      "type:display-2": {
+        "fontFamily": "var(--font-family-heading)",
+        "fontSize": "var(--text-display-2-size)",
+        "lineHeight": "var(--text-display-2-leading)"
+      },
+      "type:display-3": {
+        "fontFamily": "var(--font-family-heading)",
+        "fontSize": "var(--text-display-3-size)",
+        "lineHeight": "var(--text-display-3-leading)"
+      }
+    },
+    "text": {
+      "type:body": {
+        "fontFamily": "var(--font-family-body)",
+        "fontSize": "var(--text-body-size)",
+        "lineHeight": "var(--text-body-leading)"
+      },
+      "type:large": {
+        "fontFamily": "var(--font-family-body)",
+        "fontSize": "var(--text-large-size)",
+        "lineHeight": "var(--text-large-leading)"
+      },
+      "type:label": {
+        "fontFamily": "var(--font-family-body)",
+        "fontSize": "var(--text-label-size)",
+        "lineHeight": "var(--text-label-leading)"
+      },
+      "type:code": {
+        "fontFamily": "var(--font-family-code)",
+        "fontSize": "var(--text-code-size)",
+        "lineHeight": "var(--text-code-leading)"
+      },
+      "type:supporting": {
+        "fontFamily": "var(--font-family-body)",
+        "fontSize": "var(--text-supporting-size)",
+        "lineHeight": "var(--text-supporting-leading)"
+      },
+      "type:display-1": {
+        "fontFamily": "var(--font-family-heading)",
+        "fontSize": "var(--text-display-1-size)",
+        "lineHeight": "var(--text-display-1-leading)"
+      },
+      "type:display-2": {
+        "fontFamily": "var(--font-family-heading)",
+        "fontSize": "var(--text-display-2-size)",
+        "lineHeight": "var(--text-display-2-leading)"
+      },
+      "type:display-3": {
+        "fontFamily": "var(--font-family-heading)",
+        "fontSize": "var(--text-display-3-size)",
+        "lineHeight": "var(--text-display-3-leading)"
+      }
+    },
+    "button": {
+      "base": {
+        "borderRadius": "var(--radius-full)"
+      },
+      "variant:secondary": {
+        "backgroundColor": "transparent",
+        "borderWidth": "1.5px",
+        "borderStyle": "solid",
+        "borderColor": "var(--color-border-emphasized)",
+        ":hover": {
+          "backgroundColor": "var(--color-neutral)"
+        }
+      },
+      "variant:destructive": {
+        "backgroundColor": "var(--color-background-red)",
+        "color": "var(--color-text-red)"
+      }
+    },
+    "badge": {
+      "variant:info": {
+        "backgroundColor": "var(--color-background-blue)",
+        "color": "var(--color-text-blue)"
+      },
+      "variant:neutral": {
+        "backgroundColor": "var(--color-background-gray)",
+        "color": "var(--color-text-gray)"
+      },
+      "variant:success": {
+        "backgroundColor": "var(--color-background-green)",
+        "color": "var(--color-text-green)"
+      },
+      "variant:warning": {
+        "backgroundColor": "var(--color-background-yellow)",
+        "color": "var(--color-text-yellow)"
+      },
+      "variant:error": {
+        "backgroundColor": "var(--color-background-red)",
+        "color": "var(--color-text-red)"
+      }
+    },
+    "banner": {
+      "status:info": {
+        "--color-accent-muted": "var(--color-background-blue)",
+        "--color-text-primary": "var(--color-text-blue)",
+        "--color-text-secondary": "var(--color-text-blue)",
+        "--color-accent": "var(--color-text-blue)"
+      },
+      "status:success": {
+        "--color-success-muted": "var(--color-background-green)",
+        "--color-text-primary": "var(--color-text-green)",
+        "--color-text-secondary": "var(--color-text-green)",
+        "--color-success": "var(--color-text-green)"
+      },
+      "status:warning": {
+        "--color-warning-muted": "var(--color-background-yellow)",
+        "--color-text-primary": "var(--color-text-yellow)",
+        "--color-text-secondary": "var(--color-text-yellow)",
+        "--color-warning": "var(--color-text-yellow)"
+      },
+      "status:error": {
+        "--color-error-muted": "var(--color-background-red)",
+        "--color-text-primary": "var(--color-text-red)",
+        "--color-text-secondary": "var(--color-text-red)",
+        "--color-error": "var(--color-text-red)"
+      }
+    },
+    "progressbar-fill": {
+      "variant:accent": {
+        "backgroundColor": "light-dark(#d7e4f5, #a0acbc)"
+      },
+      "variant:success": {
+        "backgroundColor": "light-dark(#d0e9ce, #9ab298)"
+      },
+      "variant:warning": {
+        "backgroundColor": "light-dark(#f4e1b7, #bbaa82)"
+      },
+      "variant:error": {
+        "backgroundColor": "light-dark(#f9dcd7, #c0a5a0)"
+      }
+    },
+    "progressbar-track": {
+      "base": {
+        "backgroundColor": "var(--color-skeleton)"
+      }
+    },
+    "switch": {
+      "base": {
+        "--color-background-gray": "var(--color-skeleton)"
+      }
+    },
+    "field-status": {
+      "type:success": {
+        "backgroundColor": "var(--color-background-green)"
+      },
+      "type:warning": {
+        "backgroundColor": "var(--color-background-yellow)"
+      },
+      "type:error": {
+        "backgroundColor": "var(--color-background-red)"
+      }
+    },
+    "text-input": {
+      "status:success": {
+        "--color-success": "light-dark(#7f977e, #99b298)"
+      },
+      "status:warning": {
+        "--color-warning": "light-dark(#9f8f68, #bbaa81)"
+      },
+      "status:error": {
+        "--color-error": "light-dark(#a58b86, #c0a5a1)"
+      }
+    },
+    "textarea": {
+      "status:success": {
+        "--color-success": "light-dark(#7f977e, #99b298)"
+      },
+      "status:warning": {
+        "--color-warning": "light-dark(#9f8f68, #bbaa81)"
+      },
+      "status:error": {
+        "--color-error": "light-dark(#a58b86, #c0a5a1)"
+      }
+    },
+    "number-input": {
+      "status:success": {
+        "--color-success": "light-dark(#7f977e, #99b298)"
+      },
+      "status:warning": {
+        "--color-warning": "light-dark(#9f8f68, #bbaa81)"
+      },
+      "status:error": {
+        "--color-error": "light-dark(#a58b86, #c0a5a1)"
+      }
+    },
+    "date-input": {
+      "status:success": {
+        "--color-success": "light-dark(#7f977e, #99b298)"
+      },
+      "status:warning": {
+        "--color-warning": "light-dark(#9f8f68, #bbaa81)"
+      },
+      "status:error": {
+        "--color-error": "light-dark(#a58b86, #c0a5a1)"
+      }
+    },
+    "time-input": {
+      "status:success": {
+        "--color-success": "light-dark(#7f977e, #99b298)"
+      },
+      "status:warning": {
+        "--color-warning": "light-dark(#9f8f68, #bbaa81)"
+      },
+      "status:error": {
+        "--color-error": "light-dark(#a58b86, #c0a5a1)"
+      }
+    },
+    "selector": {
+      "status:success": {
+        "--color-success": "light-dark(#7f977e, #99b298)"
+      },
+      "status:warning": {
+        "--color-warning": "light-dark(#9f8f68, #bbaa81)"
+      },
+      "status:error": {
+        "--color-error": "light-dark(#a58b86, #c0a5a1)"
+      }
+    },
+    "multi-selector": {
+      "status:success": {
+        "--color-success": "light-dark(#7f977e, #99b298)"
+      },
+      "status:warning": {
+        "--color-warning": "light-dark(#9f8f68, #bbaa81)"
+      },
+      "status:error": {
+        "--color-error": "light-dark(#a58b86, #c0a5a1)"
+      }
+    },
+    "typeahead": {
+      "status:success": {
+        "--color-success": "light-dark(#7f977e, #99b298)"
+      },
+      "status:warning": {
+        "--color-warning": "light-dark(#9f8f68, #bbaa81)"
+      },
+      "status:error": {
+        "--color-error": "light-dark(#a58b86, #c0a5a1)"
+      }
+    },
+    "tokenizer": {
+      "status:success": {
+        "--color-success": "light-dark(#7f977e, #99b298)"
+      },
+      "status:warning": {
+        "--color-warning": "light-dark(#9f8f68, #bbaa81)"
+      },
+      "status:error": {
+        "--color-error": "light-dark(#a58b86, #c0a5a1)"
+      }
+    },
+    "card": {
+      "base": {
+        "padding": "var(--spacing-3)"
+      }
+    },
+    "section": {
+      "base": {
+        "padding": "var(--spacing-3)"
+      }
+    }
+  },
+  icons: dovisualIconRegistry
+});
+export {
+  dovisualIconRegistry,
+  dovisualTheme
+};