@capsuletech/web-style 0.1.0

package/dist/editor.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"editor.mjs","sources":["../src/editor/oklch.ts","../src/editor/apply.ts","../src/editor/export.ts","../src/editor/panel/ExportButton.tsx","../src/editor/presets.ts","../src/editor/panel/Slider.tsx","../src/editor/panel/FontControl.tsx","../src/editor/panel/ModeToggle.tsx","../src/editor/panel/OklchSliders.tsx","../src/editor/panel/PresetPicker.tsx","../src/editor/panel/RadiusControl.tsx","../src/editor/panel/Section.tsx","../src/editor/panel/SpacingControl.tsx","../src/editor/panel/Panel.tsx","../src/editor/preview/SampleAuth.tsx","../src/editor/preview/SampleButtons.tsx","../src/editor/preview/SampleMetrics.tsx","../src/editor/preview/SamplePricing.tsx","../src/editor/preview/Preview.tsx","../src/editor/ThemeEditor.tsx"],"sourcesContent":["export interface IOklch {\n  l: number; // 0..1\n  c: number; // 0..~0.4\n  h: number; // 0..360\n}\n\nconst OKLCH_RE = /^oklch\\(\\s*([\\d.]+)\\s+([\\d.]+)\\s+([\\d.]+)\\s*\\)$/i;\n\n/** Парсит `'oklch(0.65 0.18 250)'` → `{l, c, h}`. Fallback на black-ish. */\nexport const parseOklch = (raw: string): IOklch => {\n  const m = raw.trim().match(OKLCH_RE);\n  if (!m) return { l: 0.5, c: 0, h: 0 };\n  return {\n    l: Number.parseFloat(m[1]),\n    c: Number.parseFloat(m[2]),\n    h: Number.parseFloat(m[3]),\n  };\n};\n\nexport const formatOklch = (c: IOklch): string =>\n  `oklch(${c.l.toFixed(3)} ${c.c.toFixed(3)} ${c.h.toFixed(1)})`;\n\n/**\n * Производит «контрастный» foreground для primary: если primary тёмный\n * (l < 0.5) → светлый текст, иначе тёмный. Не идеально с точки зрения\n * WCAG, но достаточно для preview и большинства случаев.\n */\nexport const contrastForeground = (primary: string): string => {\n  const { l } = parseOklch(primary);\n  return l < 0.5 ? 'oklch(0.985 0 0)' : 'oklch(0.145 0 0)';\n};\n","import { contrastForeground } from './oklch';\nimport type { ITheme } from './types';\n\n/**\n * Применяет тему к одному элементу как inline CSS-переменные. Так редактор\n * может быть scoped (только preview-зона) или глобальным (apply на\n * `document.documentElement`).\n *\n * Для `mode` переключает класс `.dark` на элементе — наш `index.css` уже\n * слушает `.dark` / `[data-theme=\"dark\"]`.\n */\nexport const applyTheme = (el: HTMLElement, theme: ITheme): void => {\n  el.style.setProperty('--primary', theme.primary);\n  el.style.setProperty('--primary-foreground', contrastForeground(theme.primary));\n  // `--ring` обычно идёт «по primary» — повторим, чтобы focus-кольцо тоже окрасилось.\n  el.style.setProperty('--ring', theme.primary);\n  el.style.setProperty('--radius', `${theme.radius}rem`);\n  el.style.setProperty('--spacing-base', `${theme.spacingBase}rem`);\n  el.style.setProperty('--text-base-size', `${theme.fontBaseSize}rem`);\n  el.style.setProperty('font-family', theme.fontFamily);\n  if (theme.mode === 'dark') el.classList.add('dark');\n  else el.classList.remove('dark');\n};\n\n/** Полностью убирает все inline-overrides + класс `.dark`. */\nexport const resetTheme = (el: HTMLElement): void => {\n  for (const prop of [\n    '--primary',\n    '--primary-foreground',\n    '--ring',\n    '--radius',\n    '--spacing-base',\n    '--text-base-size',\n  ]) {\n    el.style.removeProperty(prop);\n  }\n  el.style.removeProperty('font-family');\n  el.classList.remove('dark');\n};\n","import { contrastForeground } from './oklch';\nimport type { ITheme } from './types';\n\n/**\n * Сериализует текущую тему в CSS-блок, готовый к копипасте в проектный\n * `globals.css` (или эквивалент). Покрывает только токены, которые реально\n * редактирует UI — остальные пусть берутся из проектных дефолтов.\n */\nexport const exportTheme = (theme: ITheme): string => {\n  const root = theme.mode === 'dark' ? '.dark' : ':root';\n  return `${root} {\n  --primary: ${theme.primary};\n  --primary-foreground: ${contrastForeground(theme.primary)};\n  --ring: ${theme.primary};\n  --radius: ${theme.radius}rem;\n  --spacing-base: ${theme.spacingBase}rem;\n  --text-base-size: ${theme.fontBaseSize}rem;\n  font-family: ${theme.fontFamily};\n}`;\n};\n\n/** Копирует в clipboard. Возвращает promise (для feedback). */\nexport const copyTheme = async (theme: ITheme): Promise<void> => {\n  await navigator.clipboard.writeText(exportTheme(theme));\n};\n","import { Check, Copy } from 'lucide-solid';\nimport { Show, createSignal } from 'solid-js';\nimport { copyTheme } from '../export';\nimport type { ITheme } from '../types';\n\ninterface IProps {\n  theme: ITheme;\n}\n\nexport const ExportButton = (props: IProps) => {\n  const [copied, setCopied] = createSignal(false);\n\n  const onCopy = async () => {\n    await copyTheme(props.theme);\n    setCopied(true);\n    setTimeout(() => setCopied(false), 1500);\n  };\n\n  return (\n    <button\n      type=\"button\"\n      onClick={onCopy}\n      class=\"w-full inline-flex items-center justify-center gap-2 rounded-md bg-primary text-primary-foreground text-sm font-medium px-3 py-2 shadow-sm hover:opacity-90 transition-opacity\"\n    >\n      <Show when={copied()} fallback={<Copy size={14} />}>\n        <Check size={14} />\n      </Show>\n      {copied() ? 'Скопировано' : 'Скопировать CSS'}\n    </button>\n  );\n};\n","import type { IFontOption, IPresetColor, ITheme } from './types';\n\n/**\n * Цветовые пресеты primary. Значения подсмотрены у shadcn (OKLCH) и\n * дают узнаваемые «бренд-настроения». Один OKLCH применяется и в light,\n * и в dark — shadcn делает так же, тонкая разница компенсируется\n * остальными токенами темы.\n */\nexport const COLOR_PRESETS: IPresetColor[] = [\n  { id: 'zinc', label: 'Zinc', primary: 'oklch(0.21 0 0)' },\n  { id: 'slate', label: 'Slate', primary: 'oklch(0.45 0.04 264)' },\n  { id: 'stone', label: 'Stone', primary: 'oklch(0.27 0.01 50)' },\n  { id: 'red', label: 'Red', primary: 'oklch(0.58 0.22 27)' },\n  { id: 'rose', label: 'Rose', primary: 'oklch(0.65 0.22 16)' },\n  { id: 'orange', label: 'Orange', primary: 'oklch(0.7 0.18 48)' },\n  { id: 'green', label: 'Green', primary: 'oklch(0.6 0.16 158)' },\n  { id: 'blue', label: 'Blue', primary: 'oklch(0.55 0.18 256)' },\n  { id: 'violet', label: 'Violet', primary: 'oklch(0.55 0.22 285)' },\n];\n\nexport const FONT_OPTIONS: IFontOption[] = [\n  {\n    id: 'system',\n    label: 'System UI',\n    stack: 'system-ui, -apple-system, \"Segoe UI\", Roboto, sans-serif',\n  },\n  {\n    id: 'inter',\n    label: 'Inter',\n    stack: '\"Inter\", system-ui, sans-serif',\n  },\n  {\n    id: 'geist',\n    label: 'Geist',\n    stack: '\"Geist\", \"Inter\", system-ui, sans-serif',\n  },\n  {\n    id: 'mono',\n    label: 'Mono',\n    stack: '\"JetBrains Mono\", ui-monospace, \"Cascadia Code\", monospace',\n  },\n  {\n    id: 'serif',\n    label: 'Serif',\n    stack: 'ui-serif, Georgia, Cambria, \"Times New Roman\", serif',\n  },\n];\n\nexport const DEFAULT_THEME: ITheme = {\n  mode: 'dark',\n  primary: COLOR_PRESETS[7].primary, // Blue по дефолту\n  radius: 0.5,\n  spacingBase: 1,\n  fontBaseSize: 1,\n  fontFamily: FONT_OPTIONS[0].stack,\n};\n","interface IProps {\n  value: number;\n  min: number;\n  max: number;\n  step: number;\n  onChange: (v: number) => void;\n  /** Сколько знаков после точки отображать справа. */\n  precision?: number;\n  /** Единица после числа в подписи (`rem`, `px`...). */\n  unit?: string;\n}\n\n/**\n * Тёмный slider в стиле shadcn — толстый track, primary-fill, белый thumb.\n * Считается через `<input type=range>` чтобы не возиться с pointer-обработкой\n * самим — а кастомные стили накатываем CSS-классами.\n */\nexport const Slider = (props: IProps) => (\n  <div class=\"flex items-center gap-3\">\n    <input\n      type=\"range\"\n      class=\"capsule-slider flex-1 h-1.5 rounded-full bg-muted accent-primary cursor-pointer\"\n      value={props.value}\n      min={props.min}\n      max={props.max}\n      step={props.step}\n      onInput={(e) => props.onChange(e.currentTarget.valueAsNumber)}\n    />\n    <span class=\"text-xs text-muted-foreground font-mono w-14 text-right shrink-0\">\n      {props.value.toFixed(props.precision ?? 2)}\n      {props.unit ?? ''}\n    </span>\n  </div>\n);\n","import { For } from 'solid-js';\nimport { FONT_OPTIONS } from '../presets';\nimport { Slider } from './Slider';\n\ninterface IProps {\n  family: string;\n  size: number;\n  onFamilyChange: (stack: string) => void;\n  onSizeChange: (v: number) => void;\n}\n\n/**\n * Два контрола: семейство (горизонтальный selector с превью каждого шрифта\n * собственным `font-family`) и базовый размер (slider).\n */\nexport const FontControl = (props: IProps) => (\n  <div class=\"flex flex-col gap-3\">\n    <div class=\"grid grid-cols-3 gap-2\">\n      <For each={FONT_OPTIONS}>\n        {(f) => {\n          const isActive = () => props.family === f.stack;\n          return (\n            <button\n              type=\"button\"\n              onClick={() => props.onFamilyChange(f.stack)}\n              class=\"rounded-md border border-border bg-card/40 px-2.5 py-2 text-left text-sm transition-all hover:bg-card/80 hover:border-foreground/30\"\n              classList={{ 'ring-2 ring-ring shadow-md': isActive() }}\n              style={{ 'font-family': f.stack }}\n            >\n              <div class=\"text-sm\">{f.label}</div>\n              <div class=\"text-[10px] text-muted-foreground truncate\">Aa Bb Cc</div>\n            </button>\n          );\n        }}\n      </For>\n    </div>\n    <Slider\n      value={props.size}\n      min={0.75}\n      max={1.25}\n      step={0.0625}\n      precision={3}\n      unit=\"rem\"\n      onChange={props.onSizeChange}\n    />\n  </div>\n);\n","import { Moon, Sun } from 'lucide-solid';\nimport type { ThemeMode } from '../types';\n\ninterface IProps {\n  mode: ThemeMode;\n  onChange: (mode: ThemeMode) => void;\n}\n\n/**\n * Сегментный switch light/dark. Выбранный сегмент — primary-фон.\n * Кнопки покрывают всю секцию, чтобы кликабельная зона была щедрой.\n */\nexport const ModeToggle = (props: IProps) => (\n  <div class=\"inline-flex rounded-md border border-border bg-card/40 p-1 gap-1\">\n    <button\n      type=\"button\"\n      onClick={() => props.onChange('light')}\n      class=\"flex items-center gap-1.5 px-3 py-1.5 rounded text-sm transition-colors\"\n      classList={{\n        'bg-primary text-primary-foreground shadow-sm': props.mode === 'light',\n        'text-muted-foreground hover:text-foreground': props.mode !== 'light',\n      }}\n    >\n      <Sun size={14} />\n      Light\n    </button>\n    <button\n      type=\"button\"\n      onClick={() => props.onChange('dark')}\n      class=\"flex items-center gap-1.5 px-3 py-1.5 rounded text-sm transition-colors\"\n      classList={{\n        'bg-primary text-primary-foreground shadow-sm': props.mode === 'dark',\n        'text-muted-foreground hover:text-foreground': props.mode !== 'dark',\n      }}\n    >\n      <Moon size={14} />\n      Dark\n    </button>\n  </div>\n);\n","import { createMemo } from 'solid-js';\nimport { formatOklch, parseOklch } from '../oklch';\nimport { Slider } from './Slider';\n\ninterface IProps {\n  value: string;\n  onChange: (oklch: string) => void;\n}\n\n/**\n * Три слайдера L/C/H для пиксельной подстройки primary. После выбора\n * пресета сразу видно текущие значения и можно сместить hue/lightness.\n */\nexport const OklchSliders = (props: IProps) => {\n  const parsed = createMemo(() => parseOklch(props.value));\n\n  const update = (patch: Partial<ReturnType<typeof parsed>>) => {\n    props.onChange(formatOklch({ ...parsed(), ...patch }));\n  };\n\n  return (\n    <div class=\"flex flex-col gap-2\">\n      <Labelled label=\"Lightness\">\n        <Slider\n          value={parsed().l}\n          min={0}\n          max={1}\n          step={0.01}\n          precision={2}\n          onChange={(l) => update({ l })}\n        />\n      </Labelled>\n      <Labelled label=\"Chroma\">\n        <Slider\n          value={parsed().c}\n          min={0}\n          max={0.4}\n          step={0.005}\n          precision={3}\n          onChange={(c) => update({ c })}\n        />\n      </Labelled>\n      <Labelled label=\"Hue\">\n        <Slider\n          value={parsed().h}\n          min={0}\n          max={360}\n          step={1}\n          precision={0}\n          unit=\"°\"\n          onChange={(h) => update({ h })}\n        />\n      </Labelled>\n    </div>\n  );\n};\n\nconst Labelled = (p: { label: string; children: any }) => (\n  <div class=\"flex items-center gap-3\">\n    <span class=\"text-xs text-muted-foreground w-20 shrink-0\">{p.label}</span>\n    <div class=\"flex-1\">{p.children}</div>\n  </div>\n);\n","import { For } from 'solid-js';\nimport { COLOR_PRESETS } from '../presets';\n\ninterface IProps {\n  current: string;\n  onPick: (oklch: string) => void;\n}\n\n/**\n * Сетка пресет-цветов. Activeное состояние — синий ring + лёгкая шкала.\n * Сами «капельки» — кружок с заливкой `var(--swatch)`, чтобы не зависеть\n * от темы.\n */\nexport const PresetPicker = (props: IProps) => (\n  <div class=\"grid grid-cols-3 gap-2\">\n    <For each={COLOR_PRESETS}>\n      {(p) => {\n        const isActive = () => props.current === p.primary;\n        return (\n          <button\n            type=\"button\"\n            onClick={() => props.onPick(p.primary)}\n            class=\"group flex items-center gap-2 rounded-md border border-border bg-card/40 px-2.5 py-2 text-left text-sm transition-all hover:bg-card/80 hover:border-foreground/30\"\n            classList={{ 'ring-2 ring-ring shadow-md scale-[1.02]': isActive() }}\n          >\n            <span\n              class=\"h-4 w-4 rounded-full ring-1 ring-foreground/20 shrink-0\"\n              style={{ background: p.primary }}\n              aria-hidden\n            />\n            <span class=\"truncate\">{p.label}</span>\n          </button>\n        );\n      }}\n    </For>\n  </div>\n);\n","import { Slider } from './Slider';\n\ninterface IProps {\n  value: number;\n  onChange: (v: number) => void;\n}\n\nexport const RadiusControl = (props: IProps) => (\n  <Slider\n    value={props.value}\n    min={0}\n    max={1.5}\n    step={0.05}\n    precision={2}\n    unit=\"rem\"\n    onChange={props.onChange}\n  />\n);\n","import type { Component, JSX } from 'solid-js';\nimport { Show } from 'solid-js';\n\ninterface IProps {\n  icon: Component<{ size?: number }>;\n  title: string;\n  description?: string;\n  children: JSX.Element;\n}\n\n/**\n * Один блок настроек: иконка + заголовок + подпись + контент. Используется\n * в Panel для группировки контролов — чтобы не было «свалки слайдеров».\n */\nexport const Section = (props: IProps) => (\n  <div class=\"flex flex-col gap-3 py-4 first:pt-0 last:pb-0 border-b border-border last:border-0\">\n    <div class=\"flex items-start gap-3\">\n      <div class=\"h-8 w-8 rounded-md bg-muted/60 grid place-items-center text-muted-foreground shrink-0\">\n        <props.icon size={16} />\n      </div>\n      <div class=\"flex-1 min-w-0\">\n        <div class=\"text-sm font-medium leading-tight\">{props.title}</div>\n        <Show when={props.description}>\n          <div class=\"text-xs text-muted-foreground mt-0.5\">{props.description}</div>\n        </Show>\n      </div>\n    </div>\n    <div class=\"pl-11\">{props.children}</div>\n  </div>\n);\n","import { Slider } from './Slider';\n\ninterface IProps {\n  value: number;\n  onChange: (v: number) => void;\n}\n\nexport const SpacingControl = (props: IProps) => (\n  <Slider\n    value={props.value}\n    min={0.5}\n    max={1.5}\n    step={0.05}\n    precision={2}\n    unit=\"rem\"\n    onChange={props.onChange}\n  />\n);\n","import { Palette, Ruler, Spline, SunMoon, Type } from 'lucide-solid';\nimport type { ITheme } from '../types';\nimport { ExportButton } from './ExportButton';\nimport { FontControl } from './FontControl';\nimport { ModeToggle } from './ModeToggle';\nimport { OklchSliders } from './OklchSliders';\nimport { PresetPicker } from './PresetPicker';\nimport { RadiusControl } from './RadiusControl';\nimport { Section } from './Section';\nimport { SpacingControl } from './SpacingControl';\n\ninterface IProps {\n  theme: ITheme;\n  onChange: (patch: Partial<ITheme>) => void;\n}\n\n/**\n * Левая колонка редактора. shadcn-стиль: заголовок страницы наверху,\n * секции снизу разделены тонкой границей, sticky-footer с export-кнопкой.\n */\nexport const Panel = (props: IProps) => (\n  <div class=\"flex flex-col h-full\">\n    <header class=\"px-6 py-5 border-b border-border\">\n      <h2 class=\"text-lg font-semibold tracking-tight\">Theme</h2>\n      <p class=\"text-xs text-muted-foreground mt-1\">\n        Настройте цвет, форму и шрифт — превью обновится мгновенно.\n      </p>\n    </header>\n\n    <div class=\"flex-1 overflow-y-auto px-6\">\n      <Section icon={SunMoon} title=\"Режим\" description=\"Светлая или тёмная тема для превью\">\n        <ModeToggle mode={props.theme.mode} onChange={(mode) => props.onChange({ mode })} />\n      </Section>\n\n      <Section icon={Palette} title=\"Primary\" description=\"Акцентный цвет — кнопки, фокус, ссылки\">\n        <div class=\"flex flex-col gap-3\">\n          <PresetPicker\n            current={props.theme.primary}\n            onPick={(primary) => props.onChange({ primary })}\n          />\n          <details class=\"text-xs\">\n            <summary class=\"cursor-pointer text-muted-foreground hover:text-foreground select-none\">\n              Тонкая подстройка (OKLCH)\n            </summary>\n            <div class=\"mt-3\">\n              <OklchSliders\n                value={props.theme.primary}\n                onChange={(primary) => props.onChange({ primary })}\n              />\n            </div>\n          </details>\n        </div>\n      </Section>\n\n      <Section icon={Spline} title=\"Скругление\" description=\"Радиус углов компонентов\">\n        <RadiusControl\n          value={props.theme.radius}\n          onChange={(radius) => props.onChange({ radius })}\n        />\n      </Section>\n\n      <Section icon={Ruler} title=\"Отступы\" description=\"Базовый шаг spacing'а\">\n        <SpacingControl\n          value={props.theme.spacingBase}\n          onChange={(spacingBase) => props.onChange({ spacingBase })}\n        />\n      </Section>\n\n      <Section icon={Type} title=\"Шрифт\" description=\"Семейство и базовый размер\">\n        <FontControl\n          family={props.theme.fontFamily}\n          size={props.theme.fontBaseSize}\n          onFamilyChange={(fontFamily) => props.onChange({ fontFamily })}\n          onSizeChange={(fontBaseSize) => props.onChange({ fontBaseSize })}\n        />\n      </Section>\n    </div>\n\n    <footer class=\"px-6 py-4 border-t border-border bg-card/40\">\n      <ExportButton theme={props.theme} />\n    </footer>\n  </div>\n);\n","import { ArrowRight, Lock, Mail } from 'lucide-solid';\n\n/**\n * Auth-form sample. Использует только семантические токены — `bg-card`,\n * `text-foreground`, `border-border`, `bg-primary` — поэтому полностью\n * реагирует на смену темы в редакторе.\n */\nexport const SampleAuth = () => (\n  <div class=\"rounded-lg border border-border bg-card text-card-foreground p-6 shadow-sm\">\n    <div class=\"space-y-1.5 mb-5\">\n      <h3 class=\"text-base font-semibold leading-none\">Войти в Capsule</h3>\n      <p class=\"text-xs text-muted-foreground\">Войдите, чтобы продолжить редактирование</p>\n    </div>\n    <div class=\"flex flex-col gap-3\">\n      <label class=\"flex flex-col gap-1.5\">\n        <span class=\"text-xs font-medium\">Email</span>\n        <div class=\"relative\">\n          <Mail\n            size={14}\n            class=\"absolute left-2.5 top-1/2 -translate-y-1/2 text-muted-foreground\"\n          />\n          <input\n            type=\"email\"\n            placeholder=\"you@company.com\"\n            class=\"w-full h-9 rounded-md border border-input bg-background pl-8 pr-3 text-sm placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring\"\n          />\n        </div>\n      </label>\n      <label class=\"flex flex-col gap-1.5\">\n        <span class=\"text-xs font-medium\">Пароль</span>\n        <div class=\"relative\">\n          <Lock\n            size={14}\n            class=\"absolute left-2.5 top-1/2 -translate-y-1/2 text-muted-foreground\"\n          />\n          <input\n            type=\"password\"\n            placeholder=\"••••••••\"\n            class=\"w-full h-9 rounded-md border border-input bg-background pl-8 pr-3 text-sm placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring\"\n          />\n        </div>\n      </label>\n      <button\n        type=\"button\"\n        class=\"mt-1 inline-flex items-center justify-center gap-2 h-9 rounded-md bg-primary px-4 text-sm font-medium text-primary-foreground shadow-sm hover:opacity-90 transition-opacity\"\n      >\n        Войти\n        <ArrowRight size={14} />\n      </button>\n    </div>\n  </div>\n);\n","import { Heart, Plus, Sparkles, Trash2 } from 'lucide-solid';\n\n/**\n * Гамма кнопок: primary, secondary, ghost, destructive — чтобы видеть,\n * как тема расходится по разным вариантам разом.\n */\nexport const SampleButtons = () => (\n  <div class=\"rounded-lg border border-border bg-card p-4\">\n    <div class=\"text-xs text-muted-foreground mb-3\">Buttons</div>\n    <div class=\"flex flex-wrap gap-2\">\n      <button\n        type=\"button\"\n        class=\"inline-flex items-center gap-1.5 h-8 px-3 rounded-md bg-primary text-primary-foreground text-xs font-medium shadow-sm hover:opacity-90\"\n      >\n        <Sparkles size={12} />\n        Primary\n      </button>\n      <button\n        type=\"button\"\n        class=\"inline-flex items-center gap-1.5 h-8 px-3 rounded-md bg-secondary text-secondary-foreground text-xs font-medium hover:bg-secondary/80\"\n      >\n        <Plus size={12} />\n        Secondary\n      </button>\n      <button\n        type=\"button\"\n        class=\"inline-flex items-center gap-1.5 h-8 px-3 rounded-md border border-input bg-background text-xs font-medium hover:bg-accent hover:text-accent-foreground\"\n      >\n        <Heart size={12} />\n        Outline\n      </button>\n      <button\n        type=\"button\"\n        class=\"inline-flex items-center gap-1.5 h-8 px-3 rounded-md text-foreground text-xs font-medium hover:bg-accent hover:text-accent-foreground\"\n      >\n        Ghost\n      </button>\n      <button\n        type=\"button\"\n        class=\"inline-flex items-center gap-1.5 h-8 px-3 rounded-md bg-destructive text-destructive-foreground text-xs font-medium shadow-sm hover:opacity-90\"\n      >\n        <Trash2 size={12} />\n        Destructive\n      </button>\n    </div>\n  </div>\n);\n","import { TrendingDown, TrendingUp, Users } from 'lucide-solid';\nimport { For } from 'solid-js';\n\nconst METRICS = [\n  { label: 'Активные', value: '12 480', delta: '+12%', positive: true, icon: Users },\n  { label: 'Сессии', value: '1.2M', delta: '+4.3%', positive: true, icon: TrendingUp },\n  { label: 'Ошибки', value: '38', delta: '-22%', positive: false, icon: TrendingDown },\n];\n\nexport const SampleMetrics = () => (\n  <div class=\"grid grid-cols-3 gap-3\">\n    <For each={METRICS}>\n      {(m) => (\n        <div class=\"rounded-lg border border-border bg-card p-3\">\n          <div class=\"flex items-center justify-between text-muted-foreground mb-2\">\n            <m.icon size={14} />\n            <span\n              class=\"text-[10px] font-mono px-1.5 py-0.5 rounded\"\n              classList={{\n                'text-green-500 bg-green-500/10': m.positive,\n                'text-red-500 bg-red-500/10': !m.positive,\n              }}\n            >\n              {m.delta}\n            </span>\n          </div>\n          <div class=\"text-xs text-muted-foreground\">{m.label}</div>\n          <div class=\"text-lg font-semibold tracking-tight mt-0.5\">{m.value}</div>\n        </div>\n      )}\n    </For>\n  </div>\n);\n","import { Check, Sparkles } from 'lucide-solid';\nimport { For } from 'solid-js';\n\nconst PLANS = [\n  {\n    id: 'starter',\n    name: 'Starter',\n    price: '0 ₽',\n    sub: 'Forever free',\n    features: ['1 проект', '3 редактора', 'Базовая палитра'],\n    featured: false,\n  },\n  {\n    id: 'pro',\n    name: 'Pro',\n    price: '1 290 ₽',\n    sub: 'в месяц',\n    features: ['Неограниченные проекты', 'Своя дизайн-система', 'Экспорт CSS'],\n    featured: true,\n  },\n];\n\nexport const SamplePricing = () => (\n  <div class=\"grid grid-cols-2 gap-3\">\n    <For each={PLANS}>\n      {(plan) => (\n        <div\n          class=\"relative rounded-lg border p-4 transition-colors\"\n          classList={{\n            'border-primary bg-primary/5 shadow-md': plan.featured,\n            'border-border bg-card': !plan.featured,\n          }}\n        >\n          {plan.featured ? (\n            <span class=\"absolute -top-2.5 right-4 inline-flex items-center gap-1 rounded-full bg-primary px-2 py-0.5 text-[10px] font-medium text-primary-foreground\">\n              <Sparkles size={10} />\n              Хит\n            </span>\n          ) : null}\n          <div class=\"flex flex-col\">\n            <span class=\"text-xs text-muted-foreground\">{plan.name}</span>\n            <div class=\"flex items-baseline gap-1 mt-1\">\n              <span class=\"text-xl font-semibold leading-none\">{plan.price}</span>\n              <span class=\"text-[11px] text-muted-foreground\">{plan.sub}</span>\n            </div>\n          </div>\n          <ul class=\"mt-3 flex flex-col gap-1.5\">\n            <For each={plan.features}>\n              {(f) => (\n                <li class=\"flex items-center gap-1.5 text-xs\">\n                  <Check size={12} class=\"text-primary shrink-0\" />\n                  <span class=\"text-muted-foreground\">{f}</span>\n                </li>\n              )}\n            </For>\n          </ul>\n        </div>\n      )}\n    </For>\n  </div>\n);\n","import { SampleAuth } from './SampleAuth';\nimport { SampleButtons } from './SampleButtons';\nimport { SampleMetrics } from './SampleMetrics';\nimport { SamplePricing } from './SamplePricing';\n\n/**\n * Превью-сетка. 12-колоночный grid в стиле shadcn'овской «showcase» страницы:\n * Auth (левая колонка, 5/12), правая часть — metrics + pricing + buttons.\n *\n * Все sample-компоненты пишут только в semantic-токены (`bg-card`,\n * `text-foreground`, `bg-primary`, ...), поэтому редактирование темы\n * прозрачно меняет всё разом.\n */\nexport const Preview = () => (\n  <div class=\"h-full overflow-y-auto bg-background text-foreground p-8\">\n    <div class=\"max-w-3xl mx-auto flex flex-col gap-4\">\n      <div class=\"grid grid-cols-12 gap-4 items-start\">\n        <div class=\"col-span-5\">\n          <SampleAuth />\n        </div>\n        <div class=\"col-span-7 flex flex-col gap-4\">\n          <SampleMetrics />\n          <SamplePricing />\n        </div>\n      </div>\n      <SampleButtons />\n    </div>\n  </div>\n);\n","import { createEffect, createSignal } from 'solid-js';\nimport { applyTheme } from './apply';\nimport { Panel } from './panel/Panel';\nimport { DEFAULT_THEME } from './presets';\nimport { Preview } from './preview/Preview';\nimport type { ITheme } from './types';\n\ninterface IProps {\n  /** Стартовая тема. По умолчанию dark + Blue + radius 0.5rem. */\n  initialTheme?: ITheme;\n  /** Колбэк при каждом изменении (для persist, analytics). */\n  onChange?: (theme: ITheme) => void;\n}\n\n/**\n * Главная композиция редактора: левая колонка-Panel + правая Preview.\n * Тема живёт здесь как signal; каждое изменение applyTheme'ится на\n * preview-элемент (scoped — не трогает host-app).\n *\n * Layout: 380px фиксированный левый стол, оставшееся под preview.\n * Min-height 100vh, чтобы scroll preview/panel был внутри editor'а.\n */\nexport const ThemeEditor = (props: IProps) => {\n  const [theme, setTheme] = createSignal<ITheme>(props.initialTheme ?? DEFAULT_THEME);\n\n  let previewRef: HTMLDivElement | undefined;\n\n  createEffect(() => {\n    if (previewRef) applyTheme(previewRef, theme());\n    props.onChange?.(theme());\n  });\n\n  const onPatch = (patch: Partial<ITheme>) => {\n    setTheme((t) => ({ ...t, ...patch }));\n  };\n\n  return (\n    <div class=\"grid grid-cols-[380px_1fr] h-screen overflow-hidden bg-background text-foreground\">\n      <aside class=\"border-r border-border bg-card/30 overflow-hidden\">\n        <Panel theme={theme()} onChange={onPatch} />\n      </aside>\n      <main ref={previewRef} class=\"overflow-hidden\">\n        <Preview />\n      </main>\n    </div>\n  );\n};\n"],"names":["OKLCH_RE","parseOklch","raw","m","formatOklch","c","contrastForeground","primary","l","applyTheme","el","theme","resetTheme","prop","exportTheme","copyTheme","ExportButton","props","copied","setCopied","createSignal","onCopy","setTimeout","_el$","_tmpl$","$$click","_$insert","_$createComponent","Show","when","fallback","Copy","size","children","Check","_$delegateEvents","COLOR_PRESETS","FONT_OPTIONS","DEFAULT_THEME","Slider","_el$2","firstChild","_el$3","nextSibling","$$input","e","onChange","currentTarget","valueAsNumber","value","toFixed","precision","unit","_$effect","_p$","_v$","min","_v$2","max","_v$3","step","_$setAttribute","t","a","undefined","FontControl","For","each","f","isActive","family","stack","_tmpl$2","_el$4","onFamilyChange","label","_$classList","_$setStyleProperty","onSizeChange","ModeToggle","_el$5","Sun","Moon","mode","OklchSliders","parsed","createMemo","update","patch","Labelled","h","p","PresetPicker","current","onPick","RadiusControl","Section","_el$7","icon","title","description","_el$6","SpacingControl","Panel","_el$8","SunMoon","Palette","Spline","radius","Ruler","spacingBase","Type","fontFamily","fontBaseSize","SampleAuth","_el$9","_el$0","_el$1","_el$10","Mail","Lock","ArrowRight","SampleButtons","Sparkles","Plus","Heart","Trash2","METRICS","delta","positive","Users","TrendingUp","TrendingDown","SampleMetrics","_$p","PLANS","id","name","price","sub","features","featured","SamplePricing","plan","_c$","_$memo","_tmpl$3","_tmpl$4","Preview","ThemeEditor","setTheme","initialTheme","previewRef","createEffect","onPatch","_ref$","_$use"],"mappings":"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"}

package/dist/index.css

@@ -0,0 +1,168 @@
+@import "tailwindcss";
+
+/* Сканируем сам style-пакет */
+@source ".";
+/* Сканируем core (wrappers/ui и пр.) */
+@source "../../core/src/**/*.{ts,tsx}";
+/* Сканируем web UI-компоненты */
+@source "../../ui/src/**/*.{ts,tsx}";
+/* Сканируем приложения */
+@source "../../../../apps/*/src/**/*.{ts,tsx}";
+
+@custom-variant dark (&:is(.dark *));
+
+/* Маппинг Tailwind-утилит на CSS-переменные.
+   Сами значения переменных приходят из активной темы (themes/<name>.css),
+   поэтому здесь — только алиасы, ни одного hardcoded цвета. */
+@theme inline {
+  /* Цвета темы */
+  --color-background: var(--background);
+  --color-foreground: var(--foreground);
+  --color-card: var(--card);
+  --color-card-foreground: var(--card-foreground);
+  --color-popover: var(--popover);
+  --color-popover-foreground: var(--popover-foreground);
+  --color-primary: var(--primary);
+  --color-primary-foreground: var(--primary-foreground);
+  --color-secondary: var(--secondary);
+  --color-secondary-foreground: var(--secondary-foreground);
+  --color-muted: var(--muted);
+  --color-muted-foreground: var(--muted-foreground);
+  --color-accent: var(--accent);
+  --color-accent-foreground: var(--accent-foreground);
+  --color-destructive: var(--destructive);
+  --color-destructive-foreground: var(--destructive-foreground);
+  --color-border: var(--border);
+  --color-input: var(--input);
+  --color-ring: var(--ring);
+  --color-chart-1: var(--chart-1);
+  --color-chart-2: var(--chart-2);
+  --color-chart-3: var(--chart-3);
+  --color-chart-4: var(--chart-4);
+  --color-chart-5: var(--chart-5);
+  --color-sidebar: var(--sidebar);
+  --color-sidebar-foreground: var(--sidebar-foreground);
+  --color-sidebar-primary: var(--sidebar-primary);
+  --color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
+  --color-sidebar-accent: var(--sidebar-accent);
+  --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
+  --color-sidebar-border: var(--sidebar-border);
+  --color-sidebar-ring: var(--sidebar-ring);
+
+  /* Семейство шрифтов — задаётся в теме */
+  --font-sans: var(--font-sans);
+  --font-mono: var(--font-mono);
+  --font-serif: var(--font-serif);
+
+  /* Радиусы — масштабируются от темового --radius */
+  --radius-sm: calc(var(--radius) - 4px);
+  --radius-md: calc(var(--radius) - 2px);
+  --radius-lg: var(--radius);
+  --radius-xl: calc(var(--radius) + 4px);
+
+  /* Тени — задаются в теме */
+  --shadow-2xs: var(--shadow-2xs);
+  --shadow-xs: var(--shadow-xs);
+  --shadow-sm: var(--shadow-sm);
+  --shadow: var(--shadow);
+  --shadow-md: var(--shadow-md);
+  --shadow-lg: var(--shadow-lg);
+  --shadow-xl: var(--shadow-xl);
+  --shadow-2xl: var(--shadow-2xl);
+
+  /* Структурные токены — не зависят от темы */
+  --color-status: var(--current-status);
+
+  --spacing-base: 1rem;
+  --spacing-layout: var(--spacing-base);
+  --spacing-component: calc(var(--spacing-base) / 2);
+  --spacing-container: calc(var(--spacing-base) / 1.5);
+
+  --gradient-primary: linear-gradient(to right, oklch(0.7 0.2 340), oklch(0.5 0.2 250));
+  --gradient-accent: linear-gradient(to bottom right, var(--primary), var(--accent));
+
+  --text-base-size: 1rem;
+  --font-size-h1: calc(var(--text-base-size) * 2.5);
+  --font-size-h2: calc(var(--text-base-size) * 2);
+  --font-size-p: var(--text-base-size);
+
+  --color-text-main: var(--foreground);
+  --color-text-muted: var(--muted-foreground);
+
+  --animate-pulse-subtle: pulse-subtle 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
+}
+
+/* Статусные цвета и служебные значения — не часть пользовательской темы. */
+:root {
+  --status-success: oklch(0.627 0.194 149.214);
+  --status-error: oklch(0.577 0.245 27.325);
+  --status-warning: oklch(0.769 0.188 70.08);
+  --current-status: inherit;
+  --transition-ui: all 0.3s;
+}
+
+@keyframes pulse-subtle {
+  0%,
+  100% {
+    opacity: 1;
+  }
+  50% {
+    opacity: 0.5;
+  }
+}
+
+@layer base {
+  input:-webkit-autofill,
+  input:-webkit-autofill:hover,
+  input:-webkit-autofill:focus,
+  textarea:-webkit-autofill,
+  textarea:-webkit-autofill:hover,
+  textarea:-webkit-autofill:focus,
+  select:-webkit-autofill,
+  select:-webkit-autofill:hover,
+  select:-webkit-autofill:focus {
+    -webkit-text-fill-color: var(--foreground) !important;
+    box-shadow: 0 0 100px 100px var(--background) inset !important;
+    transition: background-color 900000000s ease-in-out 900000000s !important;
+    caret-color: var(--foreground) !important;
+  }
+
+  *,
+  ::after,
+  ::before {
+    box-sizing: border-box;
+    border-color: var(--border);
+    border-style: solid;
+    border-width: 0;
+  }
+
+  * {
+    @apply border-border outline-ring/50;
+  }
+
+  body {
+    @apply bg-background text-foreground;
+    margin: 0;
+    line-height: inherit;
+    letter-spacing: var(--tracking-normal, 0em);
+  }
+
+  button,
+  input,
+  a {
+    transition: var(--transition-ui) !important;
+  }
+}
+
+@layer components {
+  .has-status {
+    background-color: var(--current-status) !important;
+    border-color: var(--current-status) !important;
+    color: white !important;
+    transition: var(--transition-ui) !important;
+  }
+}
+
+.has-status:hover {
+  filter: brightness(0.6);
+}

package/dist/index.d.ts

@@ -0,0 +1,4 @@
+export * from './createStyle';
+export * from './utils';
+export * from './constants';
+export * from './switcher';

package/dist/index.mjs

@@ -0,0 +1,114 @@
+import { createMemo as d, createSignal as p, onMount as y, For as O } from "solid-js";
+import { clsx as j } from "clsx";
+import { twMerge as S } from "tailwind-merge";
+import { cva as X } from "class-variance-authority";
+import { insert as i, createComponent as v, effect as a, className as h, template as g } from "solid-js/web";
+function m(e) {
+  if (!e || typeof e != "object")
+    return !1;
+  const o = Object.getPrototypeOf(e);
+  return o === null || o === Object.prototype || Object.getPrototypeOf(o) === null ? Object.prototype.toString.call(e) === "[object Object]" : !1;
+}
+function P(e) {
+  return e === "__proto__";
+}
+function u(e, o) {
+  const _ = Object.keys(o);
+  for (let c = 0; c < _.length; c++) {
+    const r = _[c];
+    if (P(r))
+      continue;
+    const n = o[r], t = e[r];
+    b(n) && b(t) ? e[r] = u(t, n) : Array.isArray(n) ? e[r] = u([], n) : m(n) ? e[r] = u({}, n) : (t === void 0 || n !== void 0) && (e[r] = n);
+  }
+  return e;
+}
+function b(e) {
+  return m(e) || Array.isArray(e);
+}
+function T(...e) {
+  return S(j(e));
+}
+function H(e, o) {
+  return u(e, o);
+}
+function Y(e, o) {
+  return { className: d(() => T(e(o), o.class)), style: () => o.style };
+}
+const q = {
+  idle: { "--current-status": "transparent" },
+  success: { "--current-status": "var(--status-success)" },
+  error: { "--current-status": "var(--status-error)" },
+  warning: { "--current-status": "var(--status-warning)" }
+}, M = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null
+}, Symbol.toStringTag, { value: "Module" })), z = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null
+}, Symbol.toStringTag, { value: "Module" })), A = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null
+}, Symbol.toStringTag, { value: "Module" })), E = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null
+}, Symbol.toStringTag, { value: "Module" })), x = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null
+}, Symbol.toStringTag, { value: "Module" })), $ = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null
+}, Symbol.toStringTag, { value: "Module" })), w = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null
+}, Symbol.toStringTag, { value: "Module" })), V = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null
+}, Symbol.toStringTag, { value: "Module" })), k = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null
+}, Symbol.toStringTag, { value: "Module" })), C = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null
+}, Symbol.toStringTag, { value: "Module" })), I = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null
+}, Symbol.toStringTag, { value: "Module" })), N = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null
+}, Symbol.toStringTag, { value: "Module" }));
+var R = /* @__PURE__ */ g("<select>"), D = /* @__PURE__ */ g("<option>");
+const f = "capsule-theme", G = /* @__PURE__ */ Object.assign({
+  "../themes/black.css": M,
+  "../themes/damon.css": z,
+  "../themes/deepPurple.css": A,
+  "../themes/index.css": E,
+  "../themes/lightGreen.css": x,
+  "../themes/minimalNeutral.css": $,
+  "../themes/openprofile.css": w,
+  "../themes/pasteelement.css": V,
+  "../themes/shopifyRed.css": k,
+  "../themes/tiesen.css": C,
+  "../themes/vescrow.css": I,
+  "../themes/zen.css": N
+}), K = Object.keys(G).map((e) => e.match(/([^/]+)\.css$/)?.[1] ?? "").filter((e) => e && e !== "index").sort(), J = (e) => {
+  const o = () => e.themes ?? K, [_, c] = p(""), r = (t) => {
+    (e.target ?? document.documentElement).setAttribute("data-theme", t);
+  };
+  y(() => {
+    const t = localStorage.getItem(f), s = o(), l = t && s.includes(t) ? t : e.defaultTheme ?? s[0];
+    l && (c(l), r(l));
+  });
+  const n = (t) => {
+    c(t), r(t), localStorage.setItem(f, t), e.onChange?.(t);
+  };
+  return (() => {
+    var t = R();
+    return t.addEventListener("change", (s) => n(s.currentTarget.value)), i(t, v(O, {
+      get each() {
+        return o();
+      },
+      children: (s) => (() => {
+        var l = D();
+        return l.value = s, i(l, s), l;
+      })()
+    })), a(() => h(t, `px-3 py-1.5 text-sm rounded-md border border-border bg-card text-foreground hover:bg-accent focus:outline-none focus:ring-2 focus:ring-ring ${e.class ?? ""}`)), a(() => t.value = _()), t;
+  })();
+};
+export {
+  q as STATUS_VARIABLES,
+  J as ThemeSwitcher,
+  T as cn,
+  Y as createStyle,
+  X as cva,
+  H as merge
+};
+//# sourceMappingURL=index.mjs.map

package/dist/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","sources":["../../../../node_modules/.pnpm/es-toolkit@1.46.1/node_modules/es-toolkit/dist/predicate/isPlainObject.mjs","../../../../node_modules/.pnpm/es-toolkit@1.46.1/node_modules/es-toolkit/dist/_internal/isUnsafeProperty.mjs","../../../../node_modules/.pnpm/es-toolkit@1.46.1/node_modules/es-toolkit/dist/object/merge.mjs","../src/utils.ts","../src/createStyle.ts","../src/constants.ts","../src/switcher/ThemeSwitcher.tsx"],"sourcesContent":["function isPlainObject(value) {\n    if (!value || typeof value !== 'object') {\n        return false;\n    }\n    const proto = Object.getPrototypeOf(value);\n    const hasObjectPrototype = proto === null ||\n        proto === Object.prototype ||\n        Object.getPrototypeOf(proto) === null;\n    if (!hasObjectPrototype) {\n        return false;\n    }\n    return Object.prototype.toString.call(value) === '[object Object]';\n}\n\nexport { isPlainObject };\n","function isUnsafeProperty(key) {\n    return key === '__proto__';\n}\n\nexport { isUnsafeProperty };\n","import { isUnsafeProperty } from '../_internal/isUnsafeProperty.mjs';\nimport { isPlainObject } from '../predicate/isPlainObject.mjs';\n\nfunction merge(target, source) {\n    const sourceKeys = Object.keys(source);\n    for (let i = 0; i < sourceKeys.length; i++) {\n        const key = sourceKeys[i];\n        if (isUnsafeProperty(key)) {\n            continue;\n        }\n        const sourceValue = source[key];\n        const targetValue = target[key];\n        if (isMergeableValue(sourceValue) && isMergeableValue(targetValue)) {\n            target[key] = merge(targetValue, sourceValue);\n        }\n        else if (Array.isArray(sourceValue)) {\n            target[key] = merge([], sourceValue);\n        }\n        else if (isPlainObject(sourceValue)) {\n            target[key] = merge({}, sourceValue);\n        }\n        else if (targetValue === undefined || sourceValue !== undefined) {\n            target[key] = sourceValue;\n        }\n    }\n    return target;\n}\nfunction isMergeableValue(value) {\n    return isPlainObject(value) || Array.isArray(value);\n}\n\nexport { merge };\n","import { type ClassValue, clsx } from 'clsx';\nimport { merge as esMerge } from 'es-toolkit';\nimport { twMerge } from 'tailwind-merge';\nexport { cva } from 'class-variance-authority';\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs));\n}\n\nexport function merge(obj1: Record<string, string>, obj2: Record<string, string>) {\n  return esMerge(obj1, obj2);\n}\n","// packages/system/style/src/useStyle.ts\nimport { createMemo } from 'solid-js';\nimport { cn } from './utils';\n\n// biome-ignore lint/suspicious/noExplicitAny: <explanation>\nexport function createStyle(cvaFn: any, props: any) {\n  // Мы создаем мемо-производную, которая будет следить за изменениями\n  const className = createMemo(() => {\n    // Внутри мемо обращение к props.variant отслеживается автоматически\n    return cn(cvaFn(props), props.class);\n  });\n\n  const style = () => props.style;\n\n  return { className, style };\n}\n","export type ComponentStatus = 'idle' | 'success' | 'error' | 'warning';\n\nexport const STATUS_VARIABLES: Record<ComponentStatus, Record<string, string>> = {\n  idle: { '--current-status': 'transparent' },\n  success: { '--current-status': 'var(--status-success)' },\n  error: { '--current-status': 'var(--status-error)' },\n  warning: { '--current-status': 'var(--status-warning)' },\n};\n","import { For, createSignal, onMount } from 'solid-js';\n\nconst STORAGE_KEY = 'capsule-theme';\n\n// Eager-импорт всех тем — сами CSS-файлы попадут в бандл потребителя,\n// а имена пойдут в выпадайку. Не надо отдельно подключать @capsuletech/web-style/themes.\n// @ts-ignore\nconst themeModules = import.meta.glob('../themes/*.css', { eager: true });\nconst DISCOVERED_THEMES = Object.keys(themeModules)\n  .map((p) => p.match(/([^/]+)\\.css$/)?.[1] ?? '')\n  .filter((n) => n && n !== 'index')\n  .sort();\n\ninterface IProps {\n  /** Список имён тем. По умолчанию — все темы из ../themes/*.css. */\n  themes?: string[];\n  /** Куда вешать data-theme. По умолчанию — `<html>`. */\n  target?: HTMLElement;\n  /** Стартовая тема, если в localStorage пусто. */\n  defaultTheme?: string;\n  /** Доп. классы на корневой `<select>`. */\n  class?: string;\n  /** Колбэк при смене темы. */\n  onChange?: (theme: string) => void;\n}\n\n/**\n * Рантайм-свитчер темы: пишет `data-theme=\"X\"` на target-элемент и сохраняет\n * выбор в localStorage. CSS-переменные темы скоупаются именно этим атрибутом\n * (см. scripts/scope-themes.mjs).\n */\nexport const ThemeSwitcher = (props: IProps) => {\n  const themes = () => props.themes ?? DISCOVERED_THEMES;\n  const [current, setCurrent] = createSignal<string>('');\n\n  const apply = (name: string) => {\n    const target = props.target ?? document.documentElement;\n    target.setAttribute('data-theme', name);\n  };\n\n  onMount(() => {\n    const stored = localStorage.getItem(STORAGE_KEY);\n    const list = themes();\n    const initial = stored && list.includes(stored) ? stored : (props.defaultTheme ?? list[0]);\n    if (!initial) return;\n    setCurrent(initial);\n    apply(initial);\n  });\n\n  const select = (name: string) => {\n    setCurrent(name);\n    apply(name);\n    localStorage.setItem(STORAGE_KEY, name);\n    props.onChange?.(name);\n  };\n\n  return (\n    <select\n      value={current()}\n      onChange={(e) => select(e.currentTarget.value)}\n      class={`px-3 py-1.5 text-sm rounded-md border border-border bg-card text-foreground hover:bg-accent focus:outline-none focus:ring-2 focus:ring-ring ${props.class ?? ''}`}\n    >\n      <For each={themes()}>{(name) => <option value={name}>{name}</option>}</For>\n    </select>\n  );\n};\n"],"names":["isPlainObject","value","proto","isUnsafeProperty","key","merge","target","source","sourceKeys","i","sourceValue","targetValue","isMergeableValue","cn","inputs","twMerge","clsx","obj1","obj2","esMerge","createStyle","cvaFn","props","createMemo","STATUS_VARIABLES","STORAGE_KEY","themeModules","import","DISCOVERED_THEMES","Object","keys","map","p","match","filter","n","sort","ThemeSwitcher","themes","current","setCurrent","createSignal","apply","name","document","documentElement","setAttribute","onMount","stored","localStorage","getItem","list","initial","includes","defaultTheme","select","setItem","onChange","_el$","_tmpl$","addEventListener","e","currentTarget","_$insert","_$createComponent","For","each","children","_el$2","_tmpl$2","_$effect","_$className","class"],"mappings":"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","x_google_ignoreList":[0,1,2]}

package/dist/package.json

@@ -0,0 +1,32 @@
+{
+  "name": "@capsuletech/web-style",
+  "version": "0.0.17",
+  "type": "module",
+  "main": "./index.mjs",
+  "types": "./index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./index.d.ts",
+      "import": "./index.mjs",
+      "default": "./index.mjs"
+    },
+    "./editor": {
+      "types": "./editor.d.ts",
+      "import": "./editor.mjs",
+      "default": "./editor.mjs"
+    },
+    "./css": {
+      "default": "./index.css"
+    },
+    "./themes": {
+      "default": "./themes/index.css"
+    },
+    "./themes/*": {
+      "default": "./themes/*.css"
+    }
+  },
+  "dependencies": {},
+  "peerDependencies": {
+    "solid-js": "^1.9.0"
+  }
+}

package/dist/switcher/ThemeSwitcher.d.ts

@@ -0,0 +1,19 @@
+interface IProps {
+    /** Список имён тем. По умолчанию — все темы из ../themes/*.css. */
+    themes?: string[];
+    /** Куда вешать data-theme. По умолчанию — `<html>`. */
+    target?: HTMLElement;
+    /** Стартовая тема, если в localStorage пусто. */
+    defaultTheme?: string;
+    /** Доп. классы на корневой `<select>`. */
+    class?: string;
+    /** Колбэк при смене темы. */
+    onChange?: (theme: string) => void;
+}
+/**
+ * Рантайм-свитчер темы: пишет `data-theme="X"` на target-элемент и сохраняет
+ * выбор в localStorage. CSS-переменные темы скоупаются именно этим атрибутом
+ * (см. scripts/scope-themes.mjs).
+ */
+export declare const ThemeSwitcher: (props: IProps) => import("solid-js").JSX.Element;
+export {};

package/dist/switcher/index.d.ts

@@ -0,0 +1 @@
+export { ThemeSwitcher } from './ThemeSwitcher';