@flamingo-stack/openframe-frontend-core 0.0.469 → 0.0.470
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/{chunk-TISXEAGH.cjs → chunk-27ZGHJDS.cjs} +7 -7
- package/dist/{chunk-TISXEAGH.cjs.map → chunk-27ZGHJDS.cjs.map} +1 -1
- package/dist/{chunk-HVLMAT4T.cjs → chunk-2W3BAKMP.cjs} +5 -5
- package/dist/{chunk-HVLMAT4T.cjs.map → chunk-2W3BAKMP.cjs.map} +1 -1
- package/dist/{chunk-VYUEOKI6.js → chunk-6O47KXGR.js} +2 -2
- package/dist/{chunk-EZESVVIM.js → chunk-7HNLEZ6N.js} +4 -4
- package/dist/{chunk-O2QOC5FA.js → chunk-7WT3K34L.js} +4 -4
- package/dist/{chunk-AEM7ADDG.js → chunk-AYNDMF5C.js} +2 -2
- package/dist/{chunk-J6CE6HZS.cjs → chunk-C667B74I.cjs} +11 -11
- package/dist/{chunk-J6CE6HZS.cjs.map → chunk-C667B74I.cjs.map} +1 -1
- package/dist/{chunk-3PLQWO4H.cjs → chunk-CGUYR6DR.cjs} +39 -25
- package/dist/chunk-CGUYR6DR.cjs.map +1 -0
- package/dist/{chunk-L3BWGFHT.cjs → chunk-DK42EGBQ.cjs} +15 -15
- package/dist/{chunk-L3BWGFHT.cjs.map → chunk-DK42EGBQ.cjs.map} +1 -1
- package/dist/{chunk-IUMPVRSH.js → chunk-H5SCS5XW.js} +2 -2
- package/dist/{chunk-3TU6QURP.js → chunk-JI24IMOW.js} +2 -2
- package/dist/{chunk-MULVIGIN.cjs → chunk-MAZGXV4D.cjs} +59 -59
- package/dist/{chunk-MULVIGIN.cjs.map → chunk-MAZGXV4D.cjs.map} +1 -1
- package/dist/{chunk-3I34MUEG.cjs → chunk-MCO55ART.cjs} +62 -62
- package/dist/{chunk-3I34MUEG.cjs.map → chunk-MCO55ART.cjs.map} +1 -1
- package/dist/{chunk-P5SLNM3C.js → chunk-NPN4WYOI.js} +39 -25
- package/dist/chunk-NPN4WYOI.js.map +1 -0
- package/dist/{chunk-2WZAR2MB.cjs → chunk-O7N2PGM2.cjs} +37 -37
- package/dist/{chunk-2WZAR2MB.cjs.map → chunk-O7N2PGM2.cjs.map} +1 -1
- package/dist/{chunk-QTGYQ2U7.js → chunk-QA5LN5NS.js} +2 -2
- package/dist/{chunk-CLW2S55N.js → chunk-QNWYTEM6.js} +4 -4
- package/dist/{chunk-ELIY4AO2.cjs → chunk-RRCWF5N3.cjs} +26 -26
- package/dist/{chunk-ELIY4AO2.cjs.map → chunk-RRCWF5N3.cjs.map} +1 -1
- package/dist/{chunk-QZJN5OHK.js → chunk-V3SOAVX4.js} +4 -4
- package/dist/{chunk-VHFH3BG6.cjs → chunk-V6OVMRXL.cjs} +31 -31
- package/dist/{chunk-VHFH3BG6.cjs.map → chunk-V6OVMRXL.cjs.map} +1 -1
- package/dist/{chunk-JW3UNHGW.js → chunk-VWNYNJWU.js} +2 -2
- package/dist/{chunk-X77X3RKH.cjs → chunk-WPNVOQ4O.cjs} +9 -9
- package/dist/{chunk-X77X3RKH.cjs.map → chunk-WPNVOQ4O.cjs.map} +1 -1
- package/dist/{chunk-VRJXY6TM.cjs → chunk-WSKUYW3G.cjs} +26 -26
- package/dist/{chunk-VRJXY6TM.cjs.map → chunk-WSKUYW3G.cjs.map} +1 -1
- package/dist/{chunk-HTSWLPMU.js → chunk-ZWVQULAJ.js} +2 -2
- package/dist/components/announcement-bar.d.ts.map +1 -1
- package/dist/components/case-studies/index.cjs +8 -8
- package/dist/components/case-studies/index.js +2 -2
- package/dist/components/chat/index.cjs +2 -2
- package/dist/components/chat/index.js +1 -1
- package/dist/components/contact/index.cjs +3 -3
- package/dist/components/contact/index.js +2 -2
- package/dist/components/docs/index.cjs +5 -5
- package/dist/components/docs/index.js +4 -4
- package/dist/components/embeds/index.cjs +3 -3
- package/dist/components/embeds/index.js +2 -2
- package/dist/components/faq/index.cjs +3 -3
- package/dist/components/faq/index.js +2 -2
- package/dist/components/features/index.cjs +2 -2
- package/dist/components/features/index.js +1 -1
- package/dist/components/help-center-pages/index.cjs +20 -20
- package/dist/components/help-center-pages/index.js +11 -11
- package/dist/components/index.cjs +142 -141
- package/dist/components/index.cjs.map +1 -1
- package/dist/components/index.js +21 -20
- package/dist/components/index.js.map +1 -1
- package/dist/components/navigation/index.cjs +2 -2
- package/dist/components/navigation/index.js +1 -1
- package/dist/components/onboarding-guides/index.cjs +5 -5
- package/dist/components/onboarding-guides/index.js +4 -4
- package/dist/components/related-content/index.cjs +3 -3
- package/dist/components/related-content/index.js +2 -2
- package/dist/components/tickets/index.cjs +5 -5
- package/dist/components/tickets/index.js +4 -4
- package/dist/components/ui/announcement-bar-view.d.ts +26 -28
- package/dist/components/ui/announcement-bar-view.d.ts.map +1 -1
- package/dist/components/ui/badge.d.ts.map +1 -1
- package/dist/components/ui/index.cjs +2 -2
- package/dist/components/ui/index.js +1 -1
- package/dist/components/ui/status-badge.d.ts.map +1 -1
- package/dist/index.cjs +2 -2
- package/dist/index.js +1 -1
- package/dist/tailwind.config.cjs +9 -0
- package/dist/tailwind.config.cjs.map +1 -1
- package/dist/tailwind.config.js +9 -0
- package/dist/tailwind.config.js.map +1 -1
- package/package.json +1 -1
- package/src/ODS_TOKEN_RULES.md +7 -0
- package/src/components/announcement-bar.tsx +21 -22
- package/src/components/ui/announcement-bar-view.tsx +68 -51
- package/src/components/ui/badge.tsx +4 -1
- package/src/components/ui/status-badge.tsx +11 -1
- package/src/styles/ods-responsive-tokens.css +9 -0
- package/tailwind.config.ts +9 -0
- package/dist/chunk-3PLQWO4H.cjs.map +0 -1
- package/dist/chunk-P5SLNM3C.js.map +0 -1
- /package/dist/{chunk-VYUEOKI6.js.map → chunk-6O47KXGR.js.map} +0 -0
- /package/dist/{chunk-EZESVVIM.js.map → chunk-7HNLEZ6N.js.map} +0 -0
- /package/dist/{chunk-O2QOC5FA.js.map → chunk-7WT3K34L.js.map} +0 -0
- /package/dist/{chunk-AEM7ADDG.js.map → chunk-AYNDMF5C.js.map} +0 -0
- /package/dist/{chunk-IUMPVRSH.js.map → chunk-H5SCS5XW.js.map} +0 -0
- /package/dist/{chunk-3TU6QURP.js.map → chunk-JI24IMOW.js.map} +0 -0
- /package/dist/{chunk-QTGYQ2U7.js.map → chunk-QA5LN5NS.js.map} +0 -0
- /package/dist/{chunk-CLW2S55N.js.map → chunk-QNWYTEM6.js.map} +0 -0
- /package/dist/{chunk-QZJN5OHK.js.map → chunk-V3SOAVX4.js.map} +0 -0
- /package/dist/{chunk-JW3UNHGW.js.map → chunk-VWNYNJWU.js.map} +0 -0
- /package/dist/{chunk-HTSWLPMU.js.map → chunk-ZWVQULAJ.js.map} +0 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../node_modules/tailwindcss/lib/util/createPlugin.js","../node_modules/tailwindcss/lib/public/create-plugin.js","../node_modules/tailwindcss/plugin.js","../tailwind.config.ts"],"names":["plugin","config"],"mappings":"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","file":"tailwind.config.js","sourcesContent":["\"use strict\";\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\nObject.defineProperty(exports, \"default\", {\n enumerable: true,\n get: function() {\n return _default;\n }\n});\nfunction createPlugin(plugin, config) {\n return {\n handler: plugin,\n config\n };\n}\ncreatePlugin.withOptions = function(pluginFunction, configFunction = ()=>({})) {\n const optionsFunction = function(options) {\n return {\n __options: options,\n handler: pluginFunction(options),\n config: configFunction(options)\n };\n };\n optionsFunction.__isOptionsFunction = true;\n // Expose plugin dependencies so that `object-hash` returns a different\n // value if anything here changes, to ensure a rebuild is triggered.\n optionsFunction.__pluginFunction = pluginFunction;\n optionsFunction.__configFunction = configFunction;\n return optionsFunction;\n};\nconst _default = createPlugin;\n","\"use strict\";\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\nObject.defineProperty(exports, \"default\", {\n enumerable: true,\n get: function() {\n return _default;\n }\n});\nconst _createPlugin = /*#__PURE__*/ _interop_require_default(require(\"../util/createPlugin\"));\nfunction _interop_require_default(obj) {\n return obj && obj.__esModule ? obj : {\n default: obj\n };\n}\nconst _default = _createPlugin.default;\n","let createPlugin = require('./lib/public/create-plugin')\nmodule.exports = (createPlugin.__esModule ? createPlugin : { default: createPlugin }).default\n","import type { Config } from 'tailwindcss'\nimport plugin from 'tailwindcss/plugin'\nimport tailwindcssAnimate from 'tailwindcss-animate'\nimport containerQueries from '@tailwindcss/container-queries'\n\nconst odsTypographyPlugin = plugin(({ addUtilities }) => {\n addUtilities({\n '.text-h1': {\n fontFamily: 'var(--font-h1-family)',\n fontWeight: 'var(--font-h1-weight)',\n fontSize: 'var(--font-size-h1-title)',\n lineHeight: 'var(--font-line-space-h1-main-title)',\n letterSpacing: '-0.02em',\n },\n '.text-h2': {\n fontFamily: 'var(--font-h2-family)',\n fontWeight: 'var(--font-h2-weight)',\n fontSize: 'var(--font-size-h2-sub-title)',\n lineHeight: 'var(--font-line-space-h2-sub-title)',\n letterSpacing: '-0.02em',\n },\n '.text-h3': {\n fontFamily: 'var(--font-h3-family)',\n fontWeight: 'var(--font-h3-weight)',\n fontSize: 'var(--font-size-h3-body)',\n lineHeight: 'var(--font-line-space-h3-body)',\n letterSpacing: '-0.02em',\n },\n '.text-h4': {\n fontFamily: 'var(--font-h4-family)',\n fontWeight: 'var(--font-h4-weight)',\n fontSize: 'var(--font-size-h4-body)',\n lineHeight: 'var(--font-line-space-h4-body)',\n },\n '.text-h5': {\n fontFamily: 'var(--font-h5-family)',\n fontWeight: 'var(--font-h5-weight)',\n fontSize: 'var(--font-size-h5-caption)',\n lineHeight: 'var(--font-line-space-h5-caption)',\n textTransform: 'uppercase',\n letterSpacing: '-0.02em',\n },\n '.text-h6': {\n fontFamily: 'var(--font-h6-family)',\n fontWeight: 'var(--font-h6-weight)',\n fontSize: 'var(--font-size-h6-caption)',\n lineHeight: 'var(--font-line-space-h6-caption)',\n },\n // Monospace body/code text (commands, ids, paths, code blocks): Azeret Mono\n // at the h6 responsive scale, no transform, neutral letter-spacing (unlike\n // text-h5's uppercase -0.02em label styling).\n '.text-code': {\n fontFamily: 'var(--font-family-heading)',\n fontWeight: 'var(--font-weight-medium)',\n fontSize: 'var(--font-size-h6-caption)',\n lineHeight: 'var(--font-line-space-h6-caption)',\n },\n })\n})\n\n/**\n * Make Tailwind opacity modifiers (`bg-ods-error/10`, `hover:bg-ods-accent/90`, …)\n * actually work on var()-based ODS tokens. Without `<alpha-value>` in the color\n * definition Tailwind v3 silently generates NOTHING for `ods-*\\/N` classes — the\n * element loses that declaration entirely. `color-mix` keeps un-suffixed classes\n * visually identical (a 100% mix is the color itself) while letting the modifier\n * scale the alpha.\n */\nconst withAlphaValue = (color: string) => `color-mix(in srgb, ${color} calc(<alpha-value> * 100%), transparent)`\n\ntype ColorTree = { [key: string]: string | ColorTree }\nconst withAlphaSupport = (tree: ColorTree): ColorTree =>\n Object.fromEntries(\n Object.entries(tree).map(([key, value]) => [\n key,\n typeof value === 'string' ? withAlphaValue(value) : withAlphaSupport(value),\n ]),\n )\n\nconst config: Config = {\n content: [\n \"./src/**/*.{js,ts,jsx,tsx}\",\n ],\n safelist: [\n // Dynamically generated classes for table hide/show functionality\n 'hidden',\n 'md:hidden',\n 'lg:hidden',\n 'md:flex',\n 'lg:flex',\n ],\n theme: {\n container: {\n center: true,\n padding: \"2rem\",\n screens: {\n \"2xl\": \"1400px\",\n },\n },\n extend: {\n colors: {\n // Shadcn/ui base colors (keep for compatibility)\n border: \"hsl(var(--border))\",\n input: \"hsl(var(--input))\",\n ring: \"hsl(var(--ring))\",\n background: \"hsl(var(--background))\",\n foreground: \"hsl(var(--foreground))\",\n primary: {\n DEFAULT: \"hsl(var(--primary))\",\n foreground: \"hsl(var(--primary-foreground))\",\n },\n secondary: {\n DEFAULT: \"hsl(var(--secondary))\",\n foreground: \"hsl(var(--secondary-foreground))\",\n },\n destructive: {\n DEFAULT: \"hsl(var(--destructive))\",\n foreground: \"hsl(var(--destructive-foreground))\",\n },\n muted: {\n DEFAULT: \"hsl(var(--muted))\",\n foreground: \"hsl(var(--muted-foreground))\",\n },\n accent: {\n DEFAULT: \"hsl(var(--accent))\",\n foreground: \"hsl(var(--accent-foreground))\",\n },\n popover: {\n DEFAULT: \"hsl(var(--popover))\",\n foreground: \"hsl(var(--popover-foreground))\",\n },\n card: {\n DEFAULT: \"hsl(var(--card))\",\n foreground: \"hsl(var(--card-foreground))\",\n },\n\n // =================================================\n // ODS (Open Design System) COLORS\n // =================================================\n // Single nested structure: generates bg-ods-*, text-ods-*, border-ods-* utilities\n ods: withAlphaSupport({\n // Backgrounds\n bg: \"var(--color-bg)\",\n card: \"var(--color-bg-card)\",\n overlay: \"var(--color-bg-overlay)\",\n skeleton: \"var(--color-bg-skeleton)\",\n \"bg-hover\": \"var(--color-bg-hover)\",\n \"bg-active\": \"var(--color-bg-active)\",\n \"bg-surface\": \"var(--color-bg-surface)\",\n \"bg-surface-hover\": \"var(--color-bg-surface-hover)\",\n \"bg-surface-active\": \"var(--color-bg-surface-active)\",\n \"card-hover\": \"var(--color-bg-hover)\",\n divider: \"var(--color-divider)\",\n\n // Borders\n border: {\n DEFAULT: \"var(--color-border-default)\",\n hover: \"var(--color-border-hover)\",\n active: \"var(--color-border-active)\",\n focus: \"var(--color-border-focus)\",\n },\n\n // Text\n text: {\n primary: \"var(--color-text-primary)\",\n secondary: \"var(--color-text-secondary)\",\n tertiary: \"var(--color-text-tertiary)\",\n muted: \"var(--color-text-muted)\",\n subtle: \"var(--color-text-subtle)\",\n disabled: \"var(--color-text-disabled)\",\n \"on-accent\": \"var(--color-text-on-accent)\",\n \"on-dark\": \"var(--color-text-on-dark)\",\n },\n\n // Accent\n accent: {\n DEFAULT: \"var(--color-accent-primary)\",\n hover: \"var(--color-accent-hover)\",\n active: \"var(--color-accent-active)\",\n focus: \"var(--color-accent-focus)\",\n disabled: \"var(--color-accent-disabled)\",\n },\n\n // Status\n success: {\n DEFAULT: \"var(--color-success)\",\n hover: \"var(--color-success-hover)\",\n active: \"var(--color-success-active)\",\n secondary: \"var(--color-success-secondary)\",\n \"secondary-hover\": \"var(--color-success-secondary-hover)\",\n \"secondary-active\": \"var(--color-success-secondary-active)\",\n },\n error: {\n DEFAULT: \"var(--color-error)\",\n hover: \"var(--color-error-hover)\",\n active: \"var(--color-error-active)\",\n secondary: \"var(--color-error-secondary)\",\n \"secondary-hover\": \"var(--color-error-secondary-hover)\",\n \"secondary-active\": \"var(--color-error-secondary-active)\",\n },\n warning: {\n DEFAULT: \"var(--color-warning)\",\n hover: \"var(--color-warning-hover)\",\n active: \"var(--color-warning-active)\",\n secondary: \"var(--color-warning-secondary)\",\n \"secondary-hover\": \"var(--color-warning-secondary-hover)\",\n \"secondary-active\": \"var(--color-warning-secondary-active)\",\n },\n info: {\n DEFAULT: \"var(--color-info)\",\n hover: \"var(--color-info-hover)\",\n active: \"var(--color-info-active)\",\n },\n\n // Interactive states\n disabled: \"var(--color-disabled)\",\n focus: \"var(--color-focus-ring)\",\n \"focus-visible\": \"var(--color-focus-visible)\",\n\n // Links\n link: {\n DEFAULT: \"var(--color-link)\",\n hover: \"var(--color-link-hover)\",\n visited: \"var(--color-link-visited)\",\n },\n\n // Brand colors (theme-independent)\n flamingo: {\n pink: {\n DEFAULT: \"var(--ods-flamingo-pink-base)\",\n hover: \"var(--ods-flamingo-pink-hover)\",\n secondary: \"var(--ods-flamingo-pink-secondary)\",\n \"secondary-hover\": \"var(--ods-flamingo-pink-secondary-hover)\",\n \"secondary-active\": \"var(--ods-flamingo-pink-secondary-action)\",\n },\n cyan: {\n DEFAULT: \"var(--ods-flamingo-cyan-base)\",\n hover: \"var(--ods-flamingo-cyan-hover)\",\n secondary: \"var(--ods-flamingo-cyan-secondary)\",\n \"secondary-hover\": \"var(--ods-flamingo-cyan-secondary-hover)\",\n \"secondary-active\": \"var(--ods-flamingo-cyan-secondary-action)\",\n },\n },\n \"open-yellow\": {\n DEFAULT: \"var(--ods-open-yellow-base)\",\n hover: \"var(--ods-open-yellow-hover)\",\n action: \"var(--ods-open-yellow-action)\",\n secondary: \"var(--ods-open-yellow-secondary)\",\n \"secondary-hover\": \"var(--ods-open-yellow-secondary-hover)\",\n \"secondary-action\": \"var(--ods-open-yellow-secondary-action)\",\n light: \"var(--ods-open-yellow-light)\",\n \"light-hover\": \"var(--ods-open-yellow-light-hover)\",\n \"light-action\": \"var(--ods-open-yellow-light-action)\",\n },\n\n // Attention tokens (ods-colors.css). Components reference these BY\n // NAME (error-state.tsx: `border-ods-attention-red-error` etc.) —\n // without these mappings Tailwind silently generates NOTHING for\n // the class and the component renders colorless in every consumer.\n attention: {\n \"red-error\": \"var(--ods-attention-red-error)\",\n \"red-error-hover\": \"var(--ods-attention-red-error-hover)\",\n \"red-error-action\": \"var(--ods-attention-red-error-action)\",\n \"red-error-secondary\": \"var(--ods-attention-red-error-secondary)\",\n \"red-error-secondary-hover\": \"var(--ods-attention-red-error-secondary-hover)\",\n \"red-error-secondary-action\": \"var(--ods-attention-red-error-secondary-action)\",\n \"yellow-warning\": \"var(--ods-attention-yellow-warning)\",\n \"yellow-warning-hover\": \"var(--ods-attention-yellow-warning-hover)\",\n \"yellow-warning-action\": \"var(--ods-attention-yellow-warning-action)\",\n \"yellow-warning-secondary\": \"var(--ods-attention-yellow-warning-secondary)\",\n \"yellow-warning-secondary-hover\": \"var(--ods-attention-yellow-warning-secondary-hover)\",\n \"yellow-warning-secondary-action\": \"var(--ods-attention-yellow-warning-secondary-action)\",\n \"green-success\": \"var(--ods-attention-green-success)\",\n \"green-success-hover\": \"var(--ods-attention-green-success-hover)\",\n \"green-success-action\": \"var(--ods-attention-green-success-action)\",\n \"green-success-secondary\": \"var(--ods-attention-green-success-secondary)\",\n \"green-success-secondary-hover\": \"var(--ods-attention-green-success-secondary-hover)\",\n \"green-success-secondary-action\": \"var(--ods-attention-green-success-secondary-action)\",\n },\n\n // Adaptive platform color\n current: \"var(--ods-current)\",\n }),\n },\n // Custom breakpoints (aligned with ODS responsive tokens from Figma)\n screens: {\n 'md': '800px', // Tablet: 50rem\n 'lg': '1280px', // Desktop: 80rem\n 'xl': '1440px', // Large desktop: 90rem\n },\n\n borderRadius: {\n lg: \"var(--radius)\", // 8px\n md: \"calc(var(--radius) - 2px)\", // 6px\n sm: \"calc(var(--radius) - 4px)\", // 4px\n xs: \"calc(var(--radius) - 6px)\", // 2px\n },\n\n maxWidth: {\n 'ods-content-narrow': '600px',\n },\n\n fontFamily: {\n sans: [\"var(--font-family-body)\"],\n mono: [\"var(--font-family-heading)\"],\n body: [\"var(--font-family-body)\"],\n heading: [\"var(--font-family-heading)\"],\n },\n\n // =================================================\n // TYPOGRAPHY\n // =================================================\n fontSize: {\n // Responsive heading sizes (from ods-responsive-tokens.css)\n 'heading-1': ['var(--font-size-h1-title)', { lineHeight: 'var(--font-line-space-h1-main-title)' }],\n 'heading-2': ['var(--font-size-h2-sub-title)', { lineHeight: 'var(--font-line-space-h2-sub-title)' }],\n 'heading-3': ['var(--font-size-h3-body)', { lineHeight: 'var(--font-line-space-h3-body)' }],\n 'heading-4': ['var(--font-size-h4-body)', { lineHeight: 'var(--font-line-space-h4-body)' }],\n 'heading-5': ['var(--font-size-h5-caption)', { lineHeight: 'var(--font-line-space-h5-caption)' }],\n 'heading-6': ['var(--font-size-h6-caption)', { lineHeight: 'var(--font-line-space-h6-caption)' }],\n },\n\n // =================================================\n // SHADOWS\n // =================================================\n boxShadow: {\n 'card': 'var(--shadow-card)',\n 'card-hover': 'var(--shadow-card-hover)',\n 'modal': 'var(--shadow-modal)',\n 'dropdown': 'var(--shadow-dropdown)',\n 'tooltip': 'var(--shadow-tooltip)',\n 'focus': 'var(--shadow-focus)',\n 'accent': 'var(--shadow-accent)',\n 'accent-lg': 'var(--shadow-accent-lg)',\n },\n\n // =================================================\n // TRANSITIONS\n // =================================================\n transitionDuration: {\n 'fast': 'var(--duration-fast)',\n 'normal': 'var(--duration-normal)',\n 'slow': 'var(--duration-slow)',\n 'slower': 'var(--duration-slower)',\n },\n transitionTimingFunction: {\n 'bounce': 'var(--ease-bounce)',\n 'elastic': 'var(--ease-elastic)',\n },\n\n // =================================================\n // Z-INDEX\n // =================================================\n zIndex: {\n 'dropdown': 'var(--z-dropdown)',\n 'sticky': 'var(--z-sticky)',\n 'fixed': 'var(--z-fixed)',\n 'modal-backdrop': 'var(--z-modal-backdrop)',\n 'modal': 'var(--z-modal)',\n 'popover': 'var(--z-popover)',\n 'tooltip': 'var(--z-tooltip)',\n 'notification': 'var(--z-notification)',\n 'debug': 'var(--z-debug)',\n },\n\n // =================================================\n // ANIMATIONS\n // =================================================\n keyframes: {\n \"accordion-down\": {\n from: { height: \"0\" },\n to: { height: \"var(--radix-accordion-content-height)\" },\n },\n \"accordion-up\": {\n from: { height: \"var(--radix-accordion-content-height)\" },\n to: { height: \"0\" },\n },\n \"fade-in\": {\n from: { opacity: \"0\" },\n to: { opacity: \"1\" },\n },\n },\n animation: {\n \"accordion-down\": \"accordion-down 0.2s ease-out\",\n \"accordion-up\": \"accordion-up 0.2s ease-out\",\n \"fade-in\": \"fade-in 0.3s ease-out\",\n },\n },\n },\n plugins: [tailwindcssAnimate, odsTypographyPlugin, containerQueries],\n}\n\nexport default config\n"]}
|
|
1
|
+
{"version":3,"sources":["../node_modules/tailwindcss/lib/util/createPlugin.js","../node_modules/tailwindcss/lib/public/create-plugin.js","../node_modules/tailwindcss/plugin.js","../tailwind.config.ts"],"names":["plugin","config"],"mappings":"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","file":"tailwind.config.js","sourcesContent":["\"use strict\";\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\nObject.defineProperty(exports, \"default\", {\n enumerable: true,\n get: function() {\n return _default;\n }\n});\nfunction createPlugin(plugin, config) {\n return {\n handler: plugin,\n config\n };\n}\ncreatePlugin.withOptions = function(pluginFunction, configFunction = ()=>({})) {\n const optionsFunction = function(options) {\n return {\n __options: options,\n handler: pluginFunction(options),\n config: configFunction(options)\n };\n };\n optionsFunction.__isOptionsFunction = true;\n // Expose plugin dependencies so that `object-hash` returns a different\n // value if anything here changes, to ensure a rebuild is triggered.\n optionsFunction.__pluginFunction = pluginFunction;\n optionsFunction.__configFunction = configFunction;\n return optionsFunction;\n};\nconst _default = createPlugin;\n","\"use strict\";\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\nObject.defineProperty(exports, \"default\", {\n enumerable: true,\n get: function() {\n return _default;\n }\n});\nconst _createPlugin = /*#__PURE__*/ _interop_require_default(require(\"../util/createPlugin\"));\nfunction _interop_require_default(obj) {\n return obj && obj.__esModule ? obj : {\n default: obj\n };\n}\nconst _default = _createPlugin.default;\n","let createPlugin = require('./lib/public/create-plugin')\nmodule.exports = (createPlugin.__esModule ? createPlugin : { default: createPlugin }).default\n","import type { Config } from 'tailwindcss'\nimport plugin from 'tailwindcss/plugin'\nimport tailwindcssAnimate from 'tailwindcss-animate'\nimport containerQueries from '@tailwindcss/container-queries'\n\nconst odsTypographyPlugin = plugin(({ addUtilities }) => {\n addUtilities({\n '.text-h1': {\n fontFamily: 'var(--font-h1-family)',\n fontWeight: 'var(--font-h1-weight)',\n fontSize: 'var(--font-size-h1-title)',\n lineHeight: 'var(--font-line-space-h1-main-title)',\n letterSpacing: '-0.02em',\n },\n '.text-h2': {\n fontFamily: 'var(--font-h2-family)',\n fontWeight: 'var(--font-h2-weight)',\n fontSize: 'var(--font-size-h2-sub-title)',\n lineHeight: 'var(--font-line-space-h2-sub-title)',\n letterSpacing: '-0.02em',\n },\n '.text-h3': {\n fontFamily: 'var(--font-h3-family)',\n fontWeight: 'var(--font-h3-weight)',\n fontSize: 'var(--font-size-h3-body)',\n lineHeight: 'var(--font-line-space-h3-body)',\n letterSpacing: '-0.02em',\n },\n '.text-h4': {\n fontFamily: 'var(--font-h4-family)',\n fontWeight: 'var(--font-h4-weight)',\n fontSize: 'var(--font-size-h4-body)',\n lineHeight: 'var(--font-line-space-h4-body)',\n },\n '.text-h5': {\n fontFamily: 'var(--font-h5-family)',\n fontWeight: 'var(--font-h5-weight)',\n fontSize: 'var(--font-size-h5-caption)',\n lineHeight: 'var(--font-line-space-h5-caption)',\n textTransform: 'uppercase',\n letterSpacing: '-0.02em',\n },\n '.text-h6': {\n fontFamily: 'var(--font-h6-family)',\n fontWeight: 'var(--font-h6-weight)',\n fontSize: 'var(--font-size-h6-caption)',\n lineHeight: 'var(--font-line-space-h6-caption)',\n },\n // Monospace body/code text (commands, ids, paths, code blocks): Azeret Mono\n // at the h6 responsive scale, no transform, neutral letter-spacing (unlike\n // text-h5's uppercase -0.02em label styling).\n '.text-code': {\n fontFamily: 'var(--font-family-heading)',\n fontWeight: 'var(--font-weight-medium)',\n fontSize: 'var(--font-size-h6-caption)',\n lineHeight: 'var(--font-line-space-h6-caption)',\n },\n // Badge / stamp SCALE — size only, deliberately NOT a composite: it\n // carries no family, weight or casing, so it composes with whatever the\n // badge already sets (h5 tokens on StatusBadge, DM Sans on Badge). Use it\n // for badges and chips instead of a raw `text-[10px]`; it is a component\n // token, not a step in the h1-h6 scale.\n '.text-badge': {\n fontSize: 'var(--font-size-badge)',\n lineHeight: 'var(--font-line-space-badge)',\n },\n })\n})\n\n/**\n * Make Tailwind opacity modifiers (`bg-ods-error/10`, `hover:bg-ods-accent/90`, …)\n * actually work on var()-based ODS tokens. Without `<alpha-value>` in the color\n * definition Tailwind v3 silently generates NOTHING for `ods-*\\/N` classes — the\n * element loses that declaration entirely. `color-mix` keeps un-suffixed classes\n * visually identical (a 100% mix is the color itself) while letting the modifier\n * scale the alpha.\n */\nconst withAlphaValue = (color: string) => `color-mix(in srgb, ${color} calc(<alpha-value> * 100%), transparent)`\n\ntype ColorTree = { [key: string]: string | ColorTree }\nconst withAlphaSupport = (tree: ColorTree): ColorTree =>\n Object.fromEntries(\n Object.entries(tree).map(([key, value]) => [\n key,\n typeof value === 'string' ? withAlphaValue(value) : withAlphaSupport(value),\n ]),\n )\n\nconst config: Config = {\n content: [\n \"./src/**/*.{js,ts,jsx,tsx}\",\n ],\n safelist: [\n // Dynamically generated classes for table hide/show functionality\n 'hidden',\n 'md:hidden',\n 'lg:hidden',\n 'md:flex',\n 'lg:flex',\n ],\n theme: {\n container: {\n center: true,\n padding: \"2rem\",\n screens: {\n \"2xl\": \"1400px\",\n },\n },\n extend: {\n colors: {\n // Shadcn/ui base colors (keep for compatibility)\n border: \"hsl(var(--border))\",\n input: \"hsl(var(--input))\",\n ring: \"hsl(var(--ring))\",\n background: \"hsl(var(--background))\",\n foreground: \"hsl(var(--foreground))\",\n primary: {\n DEFAULT: \"hsl(var(--primary))\",\n foreground: \"hsl(var(--primary-foreground))\",\n },\n secondary: {\n DEFAULT: \"hsl(var(--secondary))\",\n foreground: \"hsl(var(--secondary-foreground))\",\n },\n destructive: {\n DEFAULT: \"hsl(var(--destructive))\",\n foreground: \"hsl(var(--destructive-foreground))\",\n },\n muted: {\n DEFAULT: \"hsl(var(--muted))\",\n foreground: \"hsl(var(--muted-foreground))\",\n },\n accent: {\n DEFAULT: \"hsl(var(--accent))\",\n foreground: \"hsl(var(--accent-foreground))\",\n },\n popover: {\n DEFAULT: \"hsl(var(--popover))\",\n foreground: \"hsl(var(--popover-foreground))\",\n },\n card: {\n DEFAULT: \"hsl(var(--card))\",\n foreground: \"hsl(var(--card-foreground))\",\n },\n\n // =================================================\n // ODS (Open Design System) COLORS\n // =================================================\n // Single nested structure: generates bg-ods-*, text-ods-*, border-ods-* utilities\n ods: withAlphaSupport({\n // Backgrounds\n bg: \"var(--color-bg)\",\n card: \"var(--color-bg-card)\",\n overlay: \"var(--color-bg-overlay)\",\n skeleton: \"var(--color-bg-skeleton)\",\n \"bg-hover\": \"var(--color-bg-hover)\",\n \"bg-active\": \"var(--color-bg-active)\",\n \"bg-surface\": \"var(--color-bg-surface)\",\n \"bg-surface-hover\": \"var(--color-bg-surface-hover)\",\n \"bg-surface-active\": \"var(--color-bg-surface-active)\",\n \"card-hover\": \"var(--color-bg-hover)\",\n divider: \"var(--color-divider)\",\n\n // Borders\n border: {\n DEFAULT: \"var(--color-border-default)\",\n hover: \"var(--color-border-hover)\",\n active: \"var(--color-border-active)\",\n focus: \"var(--color-border-focus)\",\n },\n\n // Text\n text: {\n primary: \"var(--color-text-primary)\",\n secondary: \"var(--color-text-secondary)\",\n tertiary: \"var(--color-text-tertiary)\",\n muted: \"var(--color-text-muted)\",\n subtle: \"var(--color-text-subtle)\",\n disabled: \"var(--color-text-disabled)\",\n \"on-accent\": \"var(--color-text-on-accent)\",\n \"on-dark\": \"var(--color-text-on-dark)\",\n },\n\n // Accent\n accent: {\n DEFAULT: \"var(--color-accent-primary)\",\n hover: \"var(--color-accent-hover)\",\n active: \"var(--color-accent-active)\",\n focus: \"var(--color-accent-focus)\",\n disabled: \"var(--color-accent-disabled)\",\n },\n\n // Status\n success: {\n DEFAULT: \"var(--color-success)\",\n hover: \"var(--color-success-hover)\",\n active: \"var(--color-success-active)\",\n secondary: \"var(--color-success-secondary)\",\n \"secondary-hover\": \"var(--color-success-secondary-hover)\",\n \"secondary-active\": \"var(--color-success-secondary-active)\",\n },\n error: {\n DEFAULT: \"var(--color-error)\",\n hover: \"var(--color-error-hover)\",\n active: \"var(--color-error-active)\",\n secondary: \"var(--color-error-secondary)\",\n \"secondary-hover\": \"var(--color-error-secondary-hover)\",\n \"secondary-active\": \"var(--color-error-secondary-active)\",\n },\n warning: {\n DEFAULT: \"var(--color-warning)\",\n hover: \"var(--color-warning-hover)\",\n active: \"var(--color-warning-active)\",\n secondary: \"var(--color-warning-secondary)\",\n \"secondary-hover\": \"var(--color-warning-secondary-hover)\",\n \"secondary-active\": \"var(--color-warning-secondary-active)\",\n },\n info: {\n DEFAULT: \"var(--color-info)\",\n hover: \"var(--color-info-hover)\",\n active: \"var(--color-info-active)\",\n },\n\n // Interactive states\n disabled: \"var(--color-disabled)\",\n focus: \"var(--color-focus-ring)\",\n \"focus-visible\": \"var(--color-focus-visible)\",\n\n // Links\n link: {\n DEFAULT: \"var(--color-link)\",\n hover: \"var(--color-link-hover)\",\n visited: \"var(--color-link-visited)\",\n },\n\n // Brand colors (theme-independent)\n flamingo: {\n pink: {\n DEFAULT: \"var(--ods-flamingo-pink-base)\",\n hover: \"var(--ods-flamingo-pink-hover)\",\n secondary: \"var(--ods-flamingo-pink-secondary)\",\n \"secondary-hover\": \"var(--ods-flamingo-pink-secondary-hover)\",\n \"secondary-active\": \"var(--ods-flamingo-pink-secondary-action)\",\n },\n cyan: {\n DEFAULT: \"var(--ods-flamingo-cyan-base)\",\n hover: \"var(--ods-flamingo-cyan-hover)\",\n secondary: \"var(--ods-flamingo-cyan-secondary)\",\n \"secondary-hover\": \"var(--ods-flamingo-cyan-secondary-hover)\",\n \"secondary-active\": \"var(--ods-flamingo-cyan-secondary-action)\",\n },\n },\n \"open-yellow\": {\n DEFAULT: \"var(--ods-open-yellow-base)\",\n hover: \"var(--ods-open-yellow-hover)\",\n action: \"var(--ods-open-yellow-action)\",\n secondary: \"var(--ods-open-yellow-secondary)\",\n \"secondary-hover\": \"var(--ods-open-yellow-secondary-hover)\",\n \"secondary-action\": \"var(--ods-open-yellow-secondary-action)\",\n light: \"var(--ods-open-yellow-light)\",\n \"light-hover\": \"var(--ods-open-yellow-light-hover)\",\n \"light-action\": \"var(--ods-open-yellow-light-action)\",\n },\n\n // Attention tokens (ods-colors.css). Components reference these BY\n // NAME (error-state.tsx: `border-ods-attention-red-error` etc.) —\n // without these mappings Tailwind silently generates NOTHING for\n // the class and the component renders colorless in every consumer.\n attention: {\n \"red-error\": \"var(--ods-attention-red-error)\",\n \"red-error-hover\": \"var(--ods-attention-red-error-hover)\",\n \"red-error-action\": \"var(--ods-attention-red-error-action)\",\n \"red-error-secondary\": \"var(--ods-attention-red-error-secondary)\",\n \"red-error-secondary-hover\": \"var(--ods-attention-red-error-secondary-hover)\",\n \"red-error-secondary-action\": \"var(--ods-attention-red-error-secondary-action)\",\n \"yellow-warning\": \"var(--ods-attention-yellow-warning)\",\n \"yellow-warning-hover\": \"var(--ods-attention-yellow-warning-hover)\",\n \"yellow-warning-action\": \"var(--ods-attention-yellow-warning-action)\",\n \"yellow-warning-secondary\": \"var(--ods-attention-yellow-warning-secondary)\",\n \"yellow-warning-secondary-hover\": \"var(--ods-attention-yellow-warning-secondary-hover)\",\n \"yellow-warning-secondary-action\": \"var(--ods-attention-yellow-warning-secondary-action)\",\n \"green-success\": \"var(--ods-attention-green-success)\",\n \"green-success-hover\": \"var(--ods-attention-green-success-hover)\",\n \"green-success-action\": \"var(--ods-attention-green-success-action)\",\n \"green-success-secondary\": \"var(--ods-attention-green-success-secondary)\",\n \"green-success-secondary-hover\": \"var(--ods-attention-green-success-secondary-hover)\",\n \"green-success-secondary-action\": \"var(--ods-attention-green-success-secondary-action)\",\n },\n\n // Adaptive platform color\n current: \"var(--ods-current)\",\n }),\n },\n // Custom breakpoints (aligned with ODS responsive tokens from Figma)\n screens: {\n 'md': '800px', // Tablet: 50rem\n 'lg': '1280px', // Desktop: 80rem\n 'xl': '1440px', // Large desktop: 90rem\n },\n\n borderRadius: {\n lg: \"var(--radius)\", // 8px\n md: \"calc(var(--radius) - 2px)\", // 6px\n sm: \"calc(var(--radius) - 4px)\", // 4px\n xs: \"calc(var(--radius) - 6px)\", // 2px\n },\n\n maxWidth: {\n 'ods-content-narrow': '600px',\n },\n\n fontFamily: {\n sans: [\"var(--font-family-body)\"],\n mono: [\"var(--font-family-heading)\"],\n body: [\"var(--font-family-body)\"],\n heading: [\"var(--font-family-heading)\"],\n },\n\n // =================================================\n // TYPOGRAPHY\n // =================================================\n fontSize: {\n // Responsive heading sizes (from ods-responsive-tokens.css)\n 'heading-1': ['var(--font-size-h1-title)', { lineHeight: 'var(--font-line-space-h1-main-title)' }],\n 'heading-2': ['var(--font-size-h2-sub-title)', { lineHeight: 'var(--font-line-space-h2-sub-title)' }],\n 'heading-3': ['var(--font-size-h3-body)', { lineHeight: 'var(--font-line-space-h3-body)' }],\n 'heading-4': ['var(--font-size-h4-body)', { lineHeight: 'var(--font-line-space-h4-body)' }],\n 'heading-5': ['var(--font-size-h5-caption)', { lineHeight: 'var(--font-line-space-h5-caption)' }],\n 'heading-6': ['var(--font-size-h6-caption)', { lineHeight: 'var(--font-line-space-h6-caption)' }],\n },\n\n // =================================================\n // SHADOWS\n // =================================================\n boxShadow: {\n 'card': 'var(--shadow-card)',\n 'card-hover': 'var(--shadow-card-hover)',\n 'modal': 'var(--shadow-modal)',\n 'dropdown': 'var(--shadow-dropdown)',\n 'tooltip': 'var(--shadow-tooltip)',\n 'focus': 'var(--shadow-focus)',\n 'accent': 'var(--shadow-accent)',\n 'accent-lg': 'var(--shadow-accent-lg)',\n },\n\n // =================================================\n // TRANSITIONS\n // =================================================\n transitionDuration: {\n 'fast': 'var(--duration-fast)',\n 'normal': 'var(--duration-normal)',\n 'slow': 'var(--duration-slow)',\n 'slower': 'var(--duration-slower)',\n },\n transitionTimingFunction: {\n 'bounce': 'var(--ease-bounce)',\n 'elastic': 'var(--ease-elastic)',\n },\n\n // =================================================\n // Z-INDEX\n // =================================================\n zIndex: {\n 'dropdown': 'var(--z-dropdown)',\n 'sticky': 'var(--z-sticky)',\n 'fixed': 'var(--z-fixed)',\n 'modal-backdrop': 'var(--z-modal-backdrop)',\n 'modal': 'var(--z-modal)',\n 'popover': 'var(--z-popover)',\n 'tooltip': 'var(--z-tooltip)',\n 'notification': 'var(--z-notification)',\n 'debug': 'var(--z-debug)',\n },\n\n // =================================================\n // ANIMATIONS\n // =================================================\n keyframes: {\n \"accordion-down\": {\n from: { height: \"0\" },\n to: { height: \"var(--radix-accordion-content-height)\" },\n },\n \"accordion-up\": {\n from: { height: \"var(--radix-accordion-content-height)\" },\n to: { height: \"0\" },\n },\n \"fade-in\": {\n from: { opacity: \"0\" },\n to: { opacity: \"1\" },\n },\n },\n animation: {\n \"accordion-down\": \"accordion-down 0.2s ease-out\",\n \"accordion-up\": \"accordion-up 0.2s ease-out\",\n \"fade-in\": \"fade-in 0.3s ease-out\",\n },\n },\n },\n plugins: [tailwindcssAnimate, odsTypographyPlugin, containerQueries],\n}\n\nexport default config\n"]}
|
package/package.json
CHANGED
package/src/ODS_TOKEN_RULES.md
CHANGED
|
@@ -101,6 +101,13 @@ Key distinctions:
|
|
|
101
101
|
- `text-h3` vs `text-h4`: same size (18px) but h3 is **bold**, h4 is **medium** — h4 for stat values, h3 for bold headings.
|
|
102
102
|
- `text-h5` vs `text-h6`: same size (14px) but h5 is **Azeret Mono uppercase** (section labels like "POLICY TESTING"), h6 is **DM Sans sentence case** (regular labels like "Started", "Duration").
|
|
103
103
|
|
|
104
|
+
**Component scale tokens.** `text-badge` (10/12, fixed across breakpoints) is the badge/chip stamp
|
|
105
|
+
size. It is **not** a step in the scale above and carries no family, weight or casing — it sets size
|
|
106
|
+
and line-height only, so it composes with whichever h5/h6 treatment the badge already uses. Reach
|
|
107
|
+
for it on badges and chips instead of a raw `text-[10px]`; anything a user reads belongs on
|
|
108
|
+
`text-h5`/`text-h6` or larger. Stamps are fixed on purpose — growing them on desktop is what
|
|
109
|
+
balloons a badge out of the row it sits in.
|
|
110
|
+
|
|
104
111
|
## General
|
|
105
112
|
|
|
106
113
|
- Convert hardcoded values to ODS tokens even when copying patterns from existing code.
|
|
@@ -183,13 +183,10 @@ export function AnnouncementBar({ initialAnnouncement, previewMode = false, clas
|
|
|
183
183
|
style={{ gridTemplateRows: expanded ? '1fr' : '0fr' }}
|
|
184
184
|
>
|
|
185
185
|
{/*
|
|
186
|
-
Markup is the shared pure view (AnnouncementBarView,
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
breakpoint (it replaced the old whole-bar mobile tap target, which
|
|
191
|
-
also retires the 768px window.innerWidth check that disagreed with
|
|
192
|
-
the md:800px breakpoint).
|
|
186
|
+
Markup is the shared pure view (AnnouncementBarView), which carries the
|
|
187
|
+
bar's anatomy: ONE line of text inside a 44px strip, ONE compact CTA on
|
|
188
|
+
the right (hidden below `md`, where the content row is the tap target),
|
|
189
|
+
and a ghost-icon dismiss. Surface + content treatment stay here.
|
|
193
190
|
*/}
|
|
194
191
|
<div
|
|
195
192
|
className={`min-h-0 overflow-hidden ${themeScope}`}
|
|
@@ -197,6 +194,8 @@ export function AnnouncementBar({ initialAnnouncement, previewMode = false, clas
|
|
|
197
194
|
>
|
|
198
195
|
<AnnouncementBarView
|
|
199
196
|
className="text-[color:var(--color-text-primary)]"
|
|
197
|
+
contentClassName={hasCta ? 'cursor-pointer md:cursor-default' : undefined}
|
|
198
|
+
onContentClick={hasCta ? handleCtaClick : undefined}
|
|
200
199
|
startAdornment={
|
|
201
200
|
/* ONE unified icon path (shared with the chat): uploaded image URL
|
|
202
201
|
wins, else a library glyph by name (+ props), via <EntityIcon>. */
|
|
@@ -207,23 +206,21 @@ export function AnnouncementBar({ initialAnnouncement, previewMode = false, clas
|
|
|
207
206
|
props: displayAnnouncement.icon_props,
|
|
208
207
|
}}
|
|
209
208
|
size={24}
|
|
210
|
-
// `!` is required: logo
|
|
211
|
-
// icon-library) drive
|
|
212
|
-
//
|
|
213
|
-
//
|
|
214
|
-
|
|
209
|
+
// 20px below `md`, 24px from `md` up. `!` is required: logo
|
|
210
|
+
// glyphs (LogoOpenframeIcon / sizedLogo in icon-library) drive
|
|
211
|
+
// their size via an inline style, which a plain class loses to.
|
|
212
|
+
// Not `--icon-size-icon-size` — that token is 16/24 and would
|
|
213
|
+
// shrink the mobile glyph.
|
|
214
|
+
className="relative !size-5 shrink-0 md:!size-6"
|
|
215
215
|
/>
|
|
216
216
|
}
|
|
217
217
|
title={
|
|
218
|
-
/* Single-line message: title + description inline,
|
|
219
|
-
one unit
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
middot (house rule: no en/em dashes in copy). */
|
|
225
|
-
<p className="min-w-0 max-w-full text-h4 truncate mb-0">
|
|
226
|
-
<span>{displayAnnouncement.title}</span>
|
|
218
|
+
/* Single-line message: bold title + regular description inline,
|
|
219
|
+
truncating as one unit, at the strip's caption scale (`text-h6`
|
|
220
|
+
= 13/14px — the same treatment string titles get from the view).
|
|
221
|
+
Separator is a middot (house rule: no en/em dashes in copy). */
|
|
222
|
+
<p className="min-w-0 max-w-full text-h6 truncate mb-0">
|
|
223
|
+
<span className="font-[number:var(--font-weight-semibold)]">{displayAnnouncement.title}</span>
|
|
227
224
|
{displayAnnouncement.description && (
|
|
228
225
|
<span className="hidden sm:inline opacity-80"> · {displayAnnouncement.description}</span>
|
|
229
226
|
)}
|
|
@@ -236,7 +233,9 @@ export function AnnouncementBar({ initialAnnouncement, previewMode = false, clas
|
|
|
236
233
|
announcement colors are data, not token surfaces). Inline
|
|
237
234
|
styles win over the variant's hover classes on every state,
|
|
238
235
|
so hover feedback is opacity (the bar's original treatment);
|
|
239
|
-
nothing can render dark-on-dark.
|
|
236
|
+
nothing can render dark-on-dark. The view CSS-hides it below
|
|
237
|
+
`md`, where the whole content row is the tap target — this
|
|
238
|
+
Button stays the keyboard/AT path (known tradeoff).
|
|
240
239
|
|
|
241
240
|
Geometry + type come from the design system's size="compact"
|
|
242
241
|
(24px caption-scale pill for slim strips — rationale documented
|
|
@@ -3,91 +3,108 @@
|
|
|
3
3
|
import type { CSSProperties, ReactElement, ReactNode } from 'react';
|
|
4
4
|
import { cn } from '../../utils/cn';
|
|
5
5
|
|
|
6
|
+
/**
|
|
7
|
+
* Mirrors `screens.md` in tailwind.config.ts (800px), which is also where the
|
|
8
|
+
* ODS responsive tokens step up (ods-responsive-tokens.css). ONE breakpoint
|
|
9
|
+
* for the whole bar: the `md:` variants below and the `onContentClick` guard
|
|
10
|
+
* must never disagree (they did before — the guard read a stale 768px while
|
|
11
|
+
* the CSS switched at 800px).
|
|
12
|
+
*/
|
|
13
|
+
const MD_QUERY = '(min-width: 800px)';
|
|
14
|
+
|
|
6
15
|
export interface AnnouncementBarViewProps {
|
|
7
16
|
/**
|
|
8
|
-
* Leading slot — typically an icon
|
|
9
|
-
*
|
|
10
|
-
*
|
|
17
|
+
* Leading slot — typically an icon, at content width before the title. Size
|
|
18
|
+
* it in the slot: the bar's icon runs 20px below `md` and 24px from `md` up,
|
|
19
|
+
* and no ODS icon token carries that pair (`--icon-size-icon-size` is 16/24).
|
|
11
20
|
*/
|
|
12
21
|
startAdornment?: ReactNode;
|
|
13
22
|
/**
|
|
14
|
-
* Bar message. A plain string gets the
|
|
15
|
-
*
|
|
16
|
-
*
|
|
23
|
+
* Bar message, always ONE line. A plain string gets the strip's text
|
|
24
|
+
* treatment (`text-h6`, truncating); pass a ReactElement to own the markup
|
|
25
|
+
* (e.g. bold title + inline description truncating as one unit).
|
|
17
26
|
*/
|
|
18
27
|
title?: string | ReactElement;
|
|
19
28
|
/**
|
|
20
|
-
* Primary CTA
|
|
21
|
-
*
|
|
22
|
-
*
|
|
23
|
-
* collapse that row — the bar height then follows the remaining content.
|
|
29
|
+
* Primary CTA, at content width after the title. Hidden below `md`, where
|
|
30
|
+
* the content row becomes the tap target instead (`onContentClick`) — the
|
|
31
|
+
* banner pattern's touch-first tradeoff.
|
|
24
32
|
*/
|
|
25
33
|
actionBlock?: ReactElement;
|
|
34
|
+
/** Trailing slot (e.g. a dismiss button). Outside the tap target, every breakpoint. */
|
|
35
|
+
endAdornment?: ReactElement;
|
|
26
36
|
/**
|
|
27
|
-
*
|
|
28
|
-
*
|
|
29
|
-
*
|
|
30
|
-
* `actionBlock` present the element is mounted twice (one copy per
|
|
31
|
-
* breakpoint, the inactive one `display:none`) — keep it stateless.
|
|
37
|
+
* Below `md` only: fires when the content row is tapped, standing in for the
|
|
38
|
+
* `actionBlock` that is CSS-hidden at that width. No-op from `md` up, where
|
|
39
|
+
* the CTA is visible and owns the interaction.
|
|
32
40
|
*/
|
|
33
|
-
|
|
41
|
+
onContentClick?: () => void;
|
|
42
|
+
/** Extra classes for the padded content row (e.g. a cursor affordance). */
|
|
43
|
+
contentClassName?: string;
|
|
34
44
|
/** Surface styling (background, text color, theme scope) is the consumer's — pass it here. */
|
|
35
45
|
className?: string;
|
|
36
46
|
style?: CSSProperties;
|
|
37
47
|
}
|
|
38
48
|
|
|
39
49
|
/**
|
|
40
|
-
* Pure presentational announcement/notification bar
|
|
41
|
-
*
|
|
42
|
-
* navigation — consumers own state and pass content through slots.
|
|
50
|
+
* Pure presentational announcement/notification bar. No data fetching,
|
|
51
|
+
* storage, or navigation — consumers own state and pass content through slots.
|
|
43
52
|
*
|
|
44
|
-
*
|
|
45
|
-
*
|
|
46
|
-
*
|
|
47
|
-
*
|
|
48
|
-
* the
|
|
49
|
-
*
|
|
50
|
-
* row; the bar height follows the content. Spacing/typography use responsive
|
|
51
|
-
* ODS tokens, so paddings and font sizes track the breakpoint automatically.
|
|
53
|
+
* Anatomy follows the announcement-bar industry standard: ONE line of text at
|
|
54
|
+
* 13-14px inside a 44px-tall strip (guides converge on 40-60px with a single
|
|
55
|
+
* sentence; two stacked 18px rows blow past that), ONE compact CTA on the
|
|
56
|
+
* right, and a trailing dismiss slot. Spacing is the ODS responsive tokens,
|
|
57
|
+
* which step at the same 800px as `md`: `l` = 16/24px edge padding, `s` =
|
|
58
|
+
* 8/12px gap, `m` = CTA offset, `xs` = 4/8px.
|
|
52
59
|
*/
|
|
53
60
|
export function AnnouncementBarView({
|
|
54
61
|
startAdornment,
|
|
55
62
|
title,
|
|
56
63
|
actionBlock,
|
|
57
64
|
endAdornment,
|
|
65
|
+
onContentClick,
|
|
66
|
+
contentClassName,
|
|
58
67
|
className,
|
|
59
68
|
style,
|
|
60
69
|
}: AnnouncementBarViewProps) {
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
70
|
+
const handleContentClick = onContentClick
|
|
71
|
+
? () => {
|
|
72
|
+
if (!window.matchMedia(MD_QUERY).matches) onContentClick();
|
|
73
|
+
}
|
|
74
|
+
: undefined;
|
|
66
75
|
|
|
67
76
|
return (
|
|
68
|
-
<div
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
+
<div className={cn('flex w-full max-w-full min-h-11 items-center', className)} style={style}>
|
|
78
|
+
{/* Content row — the tap target below `md`, where the CTA is hidden.
|
|
79
|
+
Its vertical padding never drives the height; the 44px strip does. */}
|
|
80
|
+
<div
|
|
81
|
+
className={cn(
|
|
82
|
+
'flex min-w-0 flex-1 flex-row items-center gap-[var(--spacing-system-s)] py-[var(--spacing-system-xs)] pl-[var(--spacing-system-l)]',
|
|
83
|
+
contentClassName,
|
|
84
|
+
)}
|
|
85
|
+
onClick={handleContentClick}
|
|
86
|
+
>
|
|
87
|
+
{startAdornment && <div className="flex shrink-0 items-center">{startAdornment}</div>}
|
|
77
88
|
{typeof title === 'string' ? (
|
|
78
|
-
<p className="min-w-0 flex-1
|
|
89
|
+
<p className="mb-0 min-w-0 max-w-full flex-1 truncate text-h6">{title}</p>
|
|
79
90
|
) : (
|
|
80
|
-
title != null && <div className="min-w-0 flex-1">{title}</div>
|
|
91
|
+
title != null && <div className="min-w-0 max-w-full flex-1">{title}</div>
|
|
92
|
+
)}
|
|
93
|
+
{/* Below `md` the CTA is visually replaced by the row-wide tap target,
|
|
94
|
+
but a `display:none` button is unreachable by keyboard and AT. So
|
|
95
|
+
it is only visually hidden there (`sr-only`) and reveals itself on
|
|
96
|
+
focus — the row stays the touch affordance while Tab still reaches
|
|
97
|
+
a real, labelled control. `md:` restores the normal inline CTA. */}
|
|
98
|
+
{actionBlock && (
|
|
99
|
+
<div className="ml-[var(--spacing-system-m)] sr-only shrink-0 focus-within:not-sr-only md:not-sr-only md:flex">
|
|
100
|
+
{actionBlock}
|
|
101
|
+
</div>
|
|
81
102
|
)}
|
|
82
|
-
{/* Mobile home of the trailing adornment — and its only home when
|
|
83
|
-
there is no action row to share from `md` up. */}
|
|
84
|
-
{endAdornment && <div className={cn(adornmentBox, actionBlock && 'md:hidden')}>{endAdornment}</div>}
|
|
85
103
|
</div>
|
|
86
|
-
{
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
</div>
|
|
104
|
+
{/* Trailing slot. Its own 32px hit box optically re-centers the glyph
|
|
105
|
+
against the 16/24px left edge. */}
|
|
106
|
+
{endAdornment && (
|
|
107
|
+
<div className="ml-[var(--spacing-system-xs)] mr-[var(--spacing-system-m)] shrink-0">{endAdornment}</div>
|
|
91
108
|
)}
|
|
92
109
|
</div>
|
|
93
110
|
);
|
|
@@ -6,7 +6,10 @@ import { cva, type VariantProps } from "class-variance-authority"
|
|
|
6
6
|
import { cn } from "../../utils/cn"
|
|
7
7
|
|
|
8
8
|
const badgeVariants = cva(
|
|
9
|
-
|
|
9
|
+
// Weight from the ODS token. Scale stays at 12px rather than the `text-h6`
|
|
10
|
+
// composite: a badge is a stamp, and that composite is 14/20 on desktop —
|
|
11
|
+
// moving badges onto it grew every one of them.
|
|
12
|
+
"inline-flex items-center rounded-full border px-2.5 py-0.5 text-xs font-[number:var(--font-weight-semibold)] transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2",
|
|
10
13
|
{
|
|
11
14
|
variants: {
|
|
12
15
|
variant: {
|
|
@@ -8,9 +8,19 @@ const statusBadgeVariants = cva(
|
|
|
8
8
|
"inline-flex items-center justify-center rounded",
|
|
9
9
|
{
|
|
10
10
|
variants: {
|
|
11
|
+
// Two densities, not one style at two paddings. Both are the ODS h5
|
|
12
|
+
// label treatment (Azeret Mono 500, uppercase, -0.02em); they differ in
|
|
13
|
+
// scale. Putting BOTH on `text-h5` is what regressed the stamp: at
|
|
14
|
+
// 14/20 on desktop every inline badge grew ~40% and its box doubled,
|
|
15
|
+
// because the caption line-height replaced `leading-none`.
|
|
11
16
|
variant: {
|
|
17
|
+
// Standalone badge — the ODS caption composite, unmodified.
|
|
12
18
|
card: "px-3 py-1.5 text-h5",
|
|
13
|
-
|
|
19
|
+
// Dense inline stamp. Family, weight and casing come from the SAME h5
|
|
20
|
+
// tokens as `card`; only the scale is set here, because ODS has no
|
|
21
|
+
// step below the 12/14px caption and this stamp is 10px by design.
|
|
22
|
+
button:
|
|
23
|
+
"px-2 py-0.5 font-[family-name:var(--font-h5-family)] font-[number:var(--font-h5-weight)] text-badge uppercase tracking-[-0.02em]",
|
|
14
24
|
},
|
|
15
25
|
colorScheme: {
|
|
16
26
|
cyan: "bg-[var(--ods-flamingo-cyan-base)] text-ods-text-on-accent",
|
|
@@ -48,6 +48,15 @@
|
|
|
48
48
|
--font-line-space-h5-caption: 1rem; /* 16px */
|
|
49
49
|
--font-line-space-h6-caption: 1rem; /* 16px */
|
|
50
50
|
|
|
51
|
+
/* BADGE / STAMP SCALE — a COMPONENT token, not a step in the h1-h6 scale.
|
|
52
|
+
* Family, weight and casing still come from the h5/h6 tokens; this only
|
|
53
|
+
* carries the size a stamp renders at. Deliberately FIXED across
|
|
54
|
+
* breakpoints: a badge must stay subordinate to the row it sits in, and
|
|
55
|
+
* scaling it up on desktop is what ballooned every badge when they were
|
|
56
|
+
* moved onto the 14/20 caption step. */
|
|
57
|
+
--font-size-badge: 0.625rem; /* 10px */
|
|
58
|
+
--font-line-space-badge: 0.75rem; /* 12px */
|
|
59
|
+
|
|
51
60
|
/* =================================================== */
|
|
52
61
|
/* RESPONSIVE ICON SYSTEM */
|
|
53
62
|
/* =================================================== */
|
package/tailwind.config.ts
CHANGED
|
@@ -55,6 +55,15 @@ const odsTypographyPlugin = plugin(({ addUtilities }) => {
|
|
|
55
55
|
fontSize: 'var(--font-size-h6-caption)',
|
|
56
56
|
lineHeight: 'var(--font-line-space-h6-caption)',
|
|
57
57
|
},
|
|
58
|
+
// Badge / stamp SCALE — size only, deliberately NOT a composite: it
|
|
59
|
+
// carries no family, weight or casing, so it composes with whatever the
|
|
60
|
+
// badge already sets (h5 tokens on StatusBadge, DM Sans on Badge). Use it
|
|
61
|
+
// for badges and chips instead of a raw `text-[10px]`; it is a component
|
|
62
|
+
// token, not a step in the h1-h6 scale.
|
|
63
|
+
'.text-badge': {
|
|
64
|
+
fontSize: 'var(--font-size-badge)',
|
|
65
|
+
lineHeight: 'var(--font-line-space-badge)',
|
|
66
|
+
},
|
|
58
67
|
})
|
|
59
68
|
})
|
|
60
69
|
|