erp-pro-ui 0.1.4 → 0.1.6

package/dist/chunks/color-palette-BU1cI6XP.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"color-palette-BU1cI6XP.mjs","names":[],"sources":["../../src/components/data-display/color-palette/ColorPalette.tsx"],"sourcesContent":["import React from \"react\";\n\nexport interface ColorSwatch {\n  name: string;\n  value: string;\n  textColor?: \"light\" | \"dark\";\n}\n\nexport interface ColorGroup {\n  name: string;\n  colors: ColorSwatch[];\n}\n\nexport interface ColorPaletteProps {\n  groups?: ColorGroup[];\n  theme?: \"light\" | \"dark\" | \"all\";\n  showGradients?: boolean;\n  showUsageExamples?: boolean;\n  className?: string;\n}\n\nconst lightThemeGroups: ColorGroup[] = [\n  {\n    name: \"Active Accent Scale\",\n    colors: [\n      { name: \"primary-50\", value: \"var(--ds-accent-50)\", textColor: \"dark\" },\n      { name: \"primary-100\", value: \"var(--ds-accent-100)\", textColor: \"dark\" },\n      { name: \"primary-200\", value: \"var(--ds-accent-200)\", textColor: \"dark\" },\n      { name: \"primary-300\", value: \"var(--ds-accent-300)\", textColor: \"dark\" },\n      {\n        name: \"primary-400\",\n        value: \"var(--ds-accent-400)\",\n        textColor: \"light\",\n      },\n      {\n        name: \"primary-500\",\n        value: \"var(--ds-accent-500)\",\n        textColor: \"light\",\n      },\n      {\n        name: \"primary-600\",\n        value: \"var(--ds-accent-600)\",\n        textColor: \"light\",\n      },\n      {\n        name: \"primary-700\",\n        value: \"var(--ds-accent-700)\",\n        textColor: \"light\",\n      },\n      {\n        name: \"primary-800\",\n        value: \"var(--ds-accent-800)\",\n        textColor: \"light\",\n      },\n      {\n        name: \"primary-900\",\n        value: \"var(--ds-accent-900)\",\n        textColor: \"light\",\n      },\n    ],\n  },\n  {\n    name: \"Semantic Surfaces\",\n    colors: [\n      {\n        name: \"bg-ds-canvas\",\n        value: \"var(--ds-color-bg-canvas)\",\n        textColor: \"dark\",\n      },\n      {\n        name: \"bg-ds-surface-1\",\n        value: \"var(--ds-color-bg-surface)\",\n        textColor: \"dark\",\n      },\n      {\n        name: \"bg-ds-surface-2\",\n        value: \"var(--ds-color-bg-elevated)\",\n        textColor: \"dark\",\n      },\n      {\n        name: \"bg-ds-surface-3\",\n        value: \"var(--ds-color-bg-ds-surface-3)\",\n        textColor: \"dark\",\n      },\n      {\n        name: \"accent-subtle\",\n        value: \"var(--ds-color-accent-subtle)\",\n        textColor: \"dark\",\n      },\n    ],\n  },\n  {\n    name: \"Semantic Foreground\",\n    colors: [\n      { name: \"fg\", value: \"var(--ds-color-fg)\", textColor: \"light\" },\n      {\n        name: \"fg-muted\",\n        value: \"var(--ds-color-fg-muted)\",\n        textColor: \"light\",\n      },\n      {\n        name: \"fg-subtle\",\n        value: \"var(--ds-color-fg-subtle)\",\n        textColor: \"light\",\n      },\n      {\n        name: \"on-accent\",\n        value: \"var(--ds-color-on-accent)\",\n        textColor: \"dark\",\n      },\n    ],\n  },\n  {\n    name: \"Semantic Borders\",\n    colors: [\n      { name: \"border\", value: \"var(--ds-color-border)\", textColor: \"dark\" },\n      {\n        name: \"border-strong\",\n        value: \"var(--ds-color-border-strong)\",\n        textColor: \"dark\",\n      },\n      {\n        name: \"border-muted\",\n        value: \"var(--ds-color-border-muted)\",\n        textColor: \"dark\",\n      },\n      {\n        name: \"border-field\",\n        value: \"var(--ds-color-border-field)\",\n        textColor: \"dark\",\n      },\n      {\n        name: \"focus-ring\",\n        value: \"var(--ds-color-focus-ring)\",\n        textColor: \"dark\",\n      },\n    ],\n  },\n  {\n    name: \"Semantic Status\",\n    colors: [\n      { name: \"success\", value: \"#1eb564\", textColor: \"light\" },\n      { name: \"warning\", value: \"#ff9500\", textColor: \"dark\" },\n      { name: \"danger\", value: \"#e31d1c\", textColor: \"light\" },\n      { name: \"info\", value: \"#0085c4\", textColor: \"light\" },\n      { name: \"disabled\", value: \"#d2d2d3\", textColor: \"dark\" },\n    ],\n  },\n  {\n    name: \"Foundation Tokens\",\n    colors: [\n      { name: \"--ds-primary\", value: \"var(--ds-primary)\", textColor: \"light\" },\n      {\n        name: \"--ds-surface-canvas\",\n        value: \"var(--ds-surface-canvas)\",\n        textColor: \"dark\",\n      },\n      {\n        name: \"--ds-surface-1\",\n        value: \"var(--ds-surface-1)\",\n        textColor: \"dark\",\n      },\n      { name: \"--ds-text-1\", value: \"var(--ds-text-1)\", textColor: \"light\" },\n      { name: \"--ds-border-1\", value: \"var(--ds-border-1)\", textColor: \"dark\" },\n    ],\n  },\n];\n\nconst darkThemeGroups: ColorGroup[] = [\n  {\n    name: \"Active Accent Scale (Dark)\",\n    colors: [\n      { name: \"primary-50\", value: \"var(--ds-accent-50)\", textColor: \"dark\" },\n      { name: \"primary-100\", value: \"var(--ds-accent-100)\", textColor: \"dark\" },\n      { name: \"primary-200\", value: \"var(--ds-accent-200)\", textColor: \"dark\" },\n      { name: \"primary-300\", value: \"var(--ds-accent-300)\", textColor: \"dark\" },\n      {\n        name: \"primary-400\",\n        value: \"var(--ds-accent-400)\",\n        textColor: \"light\",\n      },\n      {\n        name: \"primary-500\",\n        value: \"var(--ds-accent-500)\",\n        textColor: \"light\",\n      },\n      {\n        name: \"primary-600\",\n        value: \"var(--ds-accent-600)\",\n        textColor: \"light\",\n      },\n      {\n        name: \"primary-700\",\n        value: \"var(--ds-accent-700)\",\n        textColor: \"light\",\n      },\n      {\n        name: \"primary-800\",\n        value: \"var(--ds-accent-800)\",\n        textColor: \"light\",\n      },\n      {\n        name: \"primary-900\",\n        value: \"var(--ds-accent-900)\",\n        textColor: \"light\",\n      },\n    ],\n  },\n  {\n    name: \"Semantic Surfaces (Dark)\",\n    colors: [\n      {\n        name: \"bg-ds-canvas\",\n        value: \"var(--ds-color-bg-canvas)\",\n        textColor: \"light\",\n      },\n      {\n        name: \"bg-ds-surface-1\",\n        value: \"var(--ds-color-bg-surface)\",\n        textColor: \"light\",\n      },\n      {\n        name: \"bg-ds-surface-2\",\n        value: \"var(--ds-color-bg-elevated)\",\n        textColor: \"light\",\n      },\n      {\n        name: \"bg-ds-surface-3\",\n        value: \"var(--ds-color-bg-ds-surface-3)\",\n        textColor: \"light\",\n      },\n      {\n        name: \"accent-subtle\",\n        value: \"var(--ds-color-accent-subtle)\",\n        textColor: \"light\",\n      },\n    ],\n  },\n  {\n    name: \"Semantic Foreground (Dark)\",\n    colors: [\n      { name: \"fg\", value: \"var(--ds-color-fg)\", textColor: \"dark\" },\n      {\n        name: \"fg-muted\",\n        value: \"var(--ds-color-fg-muted)\",\n        textColor: \"dark\",\n      },\n      {\n        name: \"fg-subtle\",\n        value: \"var(--ds-color-fg-subtle)\",\n        textColor: \"dark\",\n      },\n      {\n        name: \"on-accent\",\n        value: \"var(--ds-color-on-accent)\",\n        textColor: \"dark\",\n      },\n    ],\n  },\n  {\n    name: \"Semantic Borders (Dark)\",\n    colors: [\n      { name: \"border\", value: \"var(--ds-color-border)\", textColor: \"light\" },\n      {\n        name: \"border-strong\",\n        value: \"var(--ds-color-border-strong)\",\n        textColor: \"light\",\n      },\n      {\n        name: \"border-muted\",\n        value: \"var(--ds-color-border-muted)\",\n        textColor: \"light\",\n      },\n      {\n        name: \"border-field\",\n        value: \"var(--ds-color-border-field)\",\n        textColor: \"light\",\n      },\n      {\n        name: \"focus-ring\",\n        value: \"var(--ds-color-focus-ring)\",\n        textColor: \"dark\",\n      },\n    ],\n  },\n  {\n    name: \"Semantic Status (Dark)\",\n    colors: [\n      { name: \"success\", value: \"#22c55e\", textColor: \"light\" },\n      { name: \"warning\", value: \"#f59e42\", textColor: \"dark\" },\n      { name: \"danger\", value: \"#ef4444\", textColor: \"light\" },\n      { name: \"info\", value: \"#38bdf8\", textColor: \"dark\" },\n      { name: \"disabled\", value: \"#4b5563\", textColor: \"light\" },\n    ],\n  },\n  {\n    name: \"Foundation Tokens (Dark)\",\n    colors: [\n      { name: \"--ds-primary\", value: \"var(--ds-primary)\", textColor: \"light\" },\n      {\n        name: \"--ds-surface-canvas\",\n        value: \"var(--ds-surface-canvas)\",\n        textColor: \"light\",\n      },\n      {\n        name: \"--ds-surface-1\",\n        value: \"var(--ds-surface-1)\",\n        textColor: \"light\",\n      },\n      { name: \"--ds-text-1\", value: \"var(--ds-text-1)\", textColor: \"dark\" },\n      {\n        name: \"--ds-border-1\",\n        value: \"var(--ds-border-1)\",\n        textColor: \"light\",\n      },\n    ],\n  },\n];\n\nconst gradientGroups: ColorGroup[] = [\n  {\n    name: \"Semantic Gradients\",\n    colors: [\n      { name: \"accent-gradient-start\", value: \"#9333ea\", textColor: \"light\" },\n      { name: \"accent-gradient-end\", value: \"#7e22ce\", textColor: \"light\" },\n      { name: \"accent-secondary\", value: \"#4318ff\", textColor: \"light\" },\n    ],\n  },\n  {\n    name: \"Status Gradients\",\n    colors: [\n      { name: \"success-gradient-start\", value: \"#22c55e\", textColor: \"light\" },\n      { name: \"success-gradient-end\", value: \"#16a34a\", textColor: \"light\" },\n      { name: \"warning-gradient-start\", value: \"#f59e0b\", textColor: \"dark\" },\n      { name: \"warning-gradient-end\", value: \"#d97706\", textColor: \"light\" },\n      { name: \"error-gradient-start\", value: \"#ef4444\", textColor: \"light\" },\n      { name: \"error-gradient-end\", value: \"#dc2626\", textColor: \"light\" },\n    ],\n  },\n  {\n    name: \"Glass / Opacity\",\n    colors: [\n      {\n        name: \"glass-white-90\",\n        value: \"rgba(255,255,255,0.9)\",\n        textColor: \"dark\",\n      },\n      {\n        name: \"glass-white-70\",\n        value: \"rgba(255,255,255,0.7)\",\n        textColor: \"dark\",\n      },\n      {\n        name: \"glass-white-50\",\n        value: \"rgba(255,255,255,0.5)\",\n        textColor: \"dark\",\n      },\n      {\n        name: \"glass-white-20\",\n        value: \"rgba(255,255,255,0.2)\",\n        textColor: \"dark\",\n      },\n      {\n        name: \"glass-white-10\",\n        value: \"rgba(255,255,255,0.1)\",\n        textColor: \"dark\",\n      },\n      { name: \"glass-black-90\", value: \"rgba(0,0,0,0.9)\", textColor: \"light\" },\n      { name: \"glass-black-70\", value: \"rgba(0,0,0,0.7)\", textColor: \"light\" },\n      { name: \"glass-black-50\", value: \"rgba(0,0,0,0.5)\", textColor: \"light\" },\n      { name: \"glass-black-20\", value: \"rgba(0,0,0,0.2)\", textColor: \"light\" },\n      { name: \"glass-black-10\", value: \"rgba(0,0,0,0.1)\", textColor: \"light\" },\n    ],\n  },\n];\n\n// Default groups (backwards compatibility)\nconst defaultGroups: ColorGroup[] = lightThemeGroups;\n\ninterface DisplayColorGroup {\n  group: ColorGroup;\n  mode?: \"light\" | \"dark\";\n}\n\nfunction ColorSwatchItem({ color }: { color: ColorSwatch }) {\n  const swatchRef = React.useRef<HTMLDivElement | null>(null);\n  const [resolvedValue, setResolvedValue] = React.useState<string>(color.value);\n\n  // Resolve runtime CSS variable values so docs reflect live theme tokens.\n  React.useEffect(() => {\n    if (!swatchRef.current) {\n      return;\n    }\n\n    if (color.value.startsWith(\"var(\")) {\n      const computedBackground = getComputedStyle(\n        swatchRef.current,\n      ).backgroundColor;\n      setResolvedValue(computedBackground || color.value);\n      return;\n    }\n\n    setResolvedValue(color.value);\n  }, [color.value]);\n\n  const copyToClipboard = () => {\n    navigator.clipboard.writeText(resolvedValue);\n  };\n\n  const swatchLabel = color.value.startsWith(\"var(\")\n    ? \"LIVE\"\n    : color.value.length <= 9\n      ? color.value.toUpperCase()\n      : \"RGBA\";\n\n  return (\n    <div\n      className=\"flex flex-col items-center gap-2 cursor-pointer transition-transform hover:scale-105\"\n      onClick={copyToClipboard}\n      title=\"Click to copy\"\n    >\n      <div\n        ref={swatchRef}\n        className=\"w-20 h-20 rounded-lg shadow-md border border-ds-border-2 flex items-center justify-center text-xs font-mono\"\n        style={{ backgroundColor: color.value }}\n      >\n        <span className=\"font-semibold text-ds-1 mix-blend-difference\">\n          {swatchLabel}\n        </span>\n      </div>\n      <span className=\"text-xs font-medium text-ds-2 text-center max-w-20\">\n        {color.name}\n      </span>\n      <span className=\"text-[10px] font-mono text-ds-3 text-center max-w-20 break-all\">\n        {resolvedValue}\n      </span>\n    </div>\n  );\n}\n\nfunction GradientPreview() {\n  // Static examples to illustrate common gradient recipes.\n  return (\n    <div className=\"mt-8\">\n      <h3 className=\"text-lg font-semibold text-ds-1 mb-4\">\n        Semantic Gradient Examples\n      </h3>\n      <div className=\"grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4\">\n        <div className=\"flex flex-col gap-2\">\n          <div\n            className=\"h-24 rounded-lg flex items-center justify-center text-ds-on-accent font-medium\"\n            style={{\n              background: \"linear-gradient(135deg, #9333ea, #7e22ce)\",\n            }}\n          >\n            Accent Gradient\n          </div>\n          <code className=\"text-xs text-ds-3\">\n            linear-gradient(135deg, #9333ea, #7e22ce)\n          </code>\n        </div>\n\n        <div className=\"flex flex-col gap-2\">\n          <div\n            className=\"h-24 rounded-lg flex items-center justify-center text-ds-on-accent font-medium\"\n            style={{\n              background: \"linear-gradient(135deg, #9333ea, #4318ff)\",\n            }}\n          >\n            Accent to Brand Primary\n          </div>\n          <code className=\"text-xs text-ds-3\">\n            linear-gradient(135deg, #9333ea, #4318ff)\n          </code>\n        </div>\n\n        <div className=\"flex flex-col gap-2\">\n          <div\n            className=\"h-24 rounded-lg flex items-center justify-center text-ds-on-accent font-medium\"\n            style={{\n              background: \"linear-gradient(135deg, #22c55e, #16a34a)\",\n            }}\n          >\n            Success Gradient\n          </div>\n          <code className=\"text-xs text-ds-3\">\n            linear-gradient(135deg, #22c55e, #16a34a)\n          </code>\n        </div>\n\n        <div className=\"flex flex-col gap-2\">\n          <div\n            className=\"h-24 rounded-lg flex items-center justify-center text-ds-1 font-medium\"\n            style={{\n              background: \"linear-gradient(135deg, #fbbf24, #f59e0b)\",\n            }}\n          >\n            Warning Gradient\n          </div>\n          <code className=\"text-xs text-ds-3\">\n            linear-gradient(135deg, #fbbf24, #f59e0b)\n          </code>\n        </div>\n\n        <div className=\"flex flex-col gap-2\">\n          <div\n            className=\"h-24 rounded-lg flex items-center justify-center text-ds-on-accent font-medium\"\n            style={{\n              background: \"linear-gradient(135deg, #ef4444, #dc2626)\",\n            }}\n          >\n            Error Gradient\n          </div>\n          <code className=\"text-xs text-ds-3\">\n            linear-gradient(135deg, #ef4444, #dc2626)\n          </code>\n        </div>\n\n        <div className=\"flex flex-col gap-2\">\n          <div\n            className=\"h-24 rounded-lg flex items-center justify-center text-ds-on-accent font-medium backdrop-blur-xl border border-ds-border-2/40\"\n            style={{\n              background: \"rgba(147, 51, 234, 0.7)\",\n            }}\n          >\n            Glass Effect\n          </div>\n          <code className=\"text-xs text-ds-3\">\n            rgba(147, 51, 234, 0.7) + backdrop-blur\n          </code>\n        </div>\n      </div>\n    </div>\n  );\n}\n\nfunction UsageExamples() {\n  // Token usage references for semantic utilities + raw CSS variables.\n  return (\n    <div className=\"mt-8 p-6 bg-ds-surface-2 rounded-xl\">\n      <h3 className=\"text-lg font-semibold text-ds-1 mb-4\">\n        Recommended Usage\n      </h3>\n      <div className=\"space-y-4\">\n        <div className=\"p-4 bg-ds-surface-1 rounded-lg border border-ds-border-2\">\n          <h4 className=\"font-medium text-ds-1 mb-2\">\n            Semantic utilities first\n          </h4>\n          <pre className=\"text-xs font-mono text-ds-2 overflow-x-auto\">\n            {`import { Button } from \"erp-pro-ui\";\n\n<section className=\"bg-ds-surface-1 text-ds-1 border border-ds-border-2 rounded-2xl p-6\">\n  <h2 className=\"text-ds-1 text-xl font-semibold\">Semantic theme</h2>\n  <p className=\"text-ds-2\">Use utilities generated by colors.css.</p>\n  <Button label=\"Save changes\" primary />\n</section>`}\n          </pre>\n        </div>\n\n        <div className=\"p-4 bg-ds-surface-1 rounded-lg border border-ds-border-2\">\n          <h4 className=\"font-medium text-ds-1 mb-2\">\n            Raw design-system variables\n          </h4>\n          <pre className=\"text-xs font-mono text-ds-2 overflow-x-auto\">\n            {`.dashboard-shell {\n  background: var(--ds-color-bg-surface);\n  color: var(--ds-color-fg);\n  border: 1px solid var(--ds-color-border);\n}\n\n.dashboard-shell a {\n  color: var(--ds-color-accent);\n}\n\nhtml[data-brand=\"teal\"][data-mode=\"dark\"] {\n  color-scheme: dark;\n}`}\n          </pre>\n        </div>\n\n        <div className=\"p-4 bg-ds-surface-1 rounded-lg border border-ds-border-2\">\n          <h4 className=\"font-medium text-ds-1 mb-2\">\n            Compatibility aliases for migration\n          </h4>\n          <pre className=\"text-xs font-mono text-ds-2 overflow-x-auto\">\n            {`:root {\n  --color-primary: #4318ff;\n  --color-background-primary: #f4f7fe;\n  --color-text-primary: #1e293b;\n}\n\n/* Supported for migration. Prefer semantic utilities or --ds-* in new code. */`}\n          </pre>\n        </div>\n      </div>\n    </div>\n  );\n}\n\nexport default function ColorPalette({\n  groups,\n  theme = \"all\",\n  showGradients = true,\n  showUsageExamples = true,\n  className,\n}: ColorPaletteProps) {\n  // Build display groups based on requested mode. Each group can be rendered\n  // inside an explicit `data-mode` wrapper so light and dark values are both\n  // resolved accurately on the same page.\n  let displayGroups: DisplayColorGroup[];\n  if (groups) {\n    displayGroups = groups.map((group) => ({ group }));\n  } else if (theme === \"light\") {\n    displayGroups = lightThemeGroups.map((group) => ({ group, mode: \"light\" }));\n  } else if (theme === \"dark\") {\n    displayGroups = darkThemeGroups.map((group) => ({ group, mode: \"dark\" }));\n  } else {\n    // Show all\n    displayGroups = [\n      ...lightThemeGroups.map((group) => ({ group, mode: \"light\" as const })),\n      ...darkThemeGroups.map((group) => ({ group, mode: \"dark\" as const })),\n    ];\n  }\n\n  // Append optional gradient/opacity examples when using built-in groups.\n  if (showGradients && !groups) {\n    displayGroups = [\n      ...displayGroups,\n      ...gradientGroups.map((group) => ({ group })),\n    ];\n  }\n\n  return (\n    <div className={`p-6 bg-ds-surface-1 rounded-xl ${className || \"\"}`}>\n      <h2 className=\"text-2xl font-bold text-ds-1 mb-2\">Color Palette</h2>\n      <p className=\"text-sm text-ds-2 mb-6\">\n        Preferred contract:{\" \"}\n        <code className=\"font-mono bg-ds-surface-2 px-2 py-1 rounded text-ds-1\">\n          semantic utilities and --ds-* tokens\n        </code>{\" \"}\n        • Compatibility aliases remain available for migration. Light and dark\n        sections are resolved in their own mode contexts. Click any swatch to\n        copy the resolved color value.\n      </p>\n\n      <div className=\"mb-6 flex flex-wrap gap-2\">\n        <span\n          className={`px-3 py-1 rounded-full text-xs font-medium ${\n            theme === \"light\" || theme === \"all\"\n              ? \"bg-ds-accent-subtle text-ds-1\"\n              : \"bg-ds-surface-2 text-ds-3\"\n          }`}\n        >\n          Light Theme\n        </span>\n        <span\n          className={`px-3 py-1 rounded-full text-xs font-medium ${\n            theme === \"dark\" || theme === \"all\"\n              ? \"bg-ds-accent-subtle text-ds-1\"\n              : \"bg-ds-surface-2 text-ds-3\"\n          }`}\n        >\n          Dark Theme\n        </span>\n        {showGradients && (\n          <span className=\"px-3 py-1 rounded-full text-xs font-medium bg-ds-accent-subtle text-ds-1\">\n            Gradients\n          </span>\n        )}\n      </div>\n\n      {displayGroups.map(({ group, mode }) => (\n        <div key={group.name} data-mode={mode} className=\"mb-8\">\n          <h3 className=\"text-lg font-semibold text-ds-1 mb-4\">{group.name}</h3>\n          <div className=\"flex flex-wrap gap-4\">\n            {group.colors.map((color) => (\n              <ColorSwatchItem key={color.name} color={color} />\n            ))}\n          </div>\n        </div>\n      ))}\n\n      {showGradients && <GradientPreview />}\n      {showUsageExamples && <UsageExamples />}\n    </div>\n  );\n}\n\n// Export color groups for external use\nexport { lightThemeGroups, darkThemeGroups, gradientGroups, defaultGroups };\n"],"mappings":"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"}