@particle-academy/react-fancy 4.18.0 → 4.19.0

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.
Files changed (4) hide show
  1. package/README.md +11 -2
  2. package/dist/styles.css +14 -0
  3. package/dist/styles.css.map +1 -1
  4. package/package.json +91 -91
package/README.md CHANGED
@@ -265,7 +265,16 @@ src/
265
265
 
266
266
  ## Demo Pages
267
267
 
268
- Component demos live in the monorepo at `resources/js/react-demos/pages/`. Each component has a `ComponentNameDemo.tsx` that exercises all props and states using the `DemoSection` wrapper component.
268
+ Every component has a live demo page on the showcase site, at
269
+ `https://ui.particle.academy/packages/react-fancy/<component>` — e.g.
270
+ [`/packages/react-fancy/button`](https://ui.particle.academy/packages/react-fancy/button).
271
+ Each one exercises the component's props and states, with the source for every
272
+ example shown inline.
273
+
274
+ Those pages are the demos: one file per component in the showcase repo
275
+ ([`Particle-Academy/pa-ux-sandbox`](https://github.com/Particle-Academy/pa-ux-sandbox))
276
+ at `resources/js/Pages/Packages/ComponentDocs/<ComponentName>.tsx`. The older
277
+ `resources/js/react-demos/pages/` tree they replaced no longer exists.
269
278
 
270
279
  ---
271
280
 
@@ -318,7 +327,7 @@ Purely visual primitives (labels, dividers, layout shells) only owe the first bu
318
327
  - tsup handles the build — ESM, CJS, and `.d.ts` generation.
319
328
  - `react`, `react-dom`, and `lucide-react` are external dependencies, never bundled.
320
329
  - After any change, verify with `pnpm --filter @particle-academy/react-fancy build` before considering the work done.
321
- - When updating a component, update its demo page in `resources/js/react-demos/pages/` to cover all new features.
330
+ - When updating a component, update its demo page in the showcase repo — `resources/js/Pages/Packages/ComponentDocs/<ComponentName>.tsx` in [`Particle-Academy/pa-ux-sandbox`](https://github.com/Particle-Academy/pa-ux-sandbox) — to cover all new features. That page is what `/packages/react-fancy/<component>` renders.
322
331
 
323
332
  ---
324
333
 
package/dist/styles.css CHANGED
@@ -1,4 +1,18 @@
1
1
  /* src/styles.css */
2
+ @theme { --color-brand: var(--color-violet-600); --color-primary-50: var(--color-violet-50); --color-primary-100: var(--color-violet-100); --color-primary-200: var(--color-violet-200); --color-primary-300: var(--color-violet-300); --color-primary-400: var(--color-violet-400); --color-primary-500: var(--color-violet-500); --color-primary-600: var(--color-violet-600); --color-primary-700: var(--color-violet-700); --color-primary-800: var(--color-violet-800); --color-primary-900: var(--color-violet-900); --color-primary-950: var(--color-violet-950); --color-secondary-50: var(--color-zinc-50); --color-secondary-100: var(--color-zinc-100); --color-secondary-200: var(--color-zinc-200); --color-secondary-300: var(--color-zinc-300); --color-secondary-400: var(--color-zinc-400); --color-secondary-500: var(--color-zinc-500); --color-secondary-600: var(--color-zinc-600); --color-secondary-700: var(--color-zinc-700); --color-secondary-800: var(--color-zinc-800); --color-secondary-900: var(--color-zinc-900); --color-secondary-950: var(--color-zinc-950); }
3
+ :where(.dark) {
4
+ --color-secondary-50: var(--color-zinc-950);
5
+ --color-secondary-100: var(--color-zinc-900);
6
+ --color-secondary-200: var(--color-zinc-800);
7
+ --color-secondary-300: var(--color-zinc-700);
8
+ --color-secondary-400: var(--color-zinc-600);
9
+ --color-secondary-500: var(--color-zinc-500);
10
+ --color-secondary-600: var(--color-zinc-400);
11
+ --color-secondary-700: var(--color-zinc-300);
12
+ --color-secondary-800: var(--color-zinc-200);
13
+ --color-secondary-900: var(--color-zinc-100);
14
+ --color-secondary-950: var(--color-zinc-50);
15
+ }
2
16
  [data-react-fancy-field] + [data-react-fancy-field] {
3
17
  margin-top: 1rem;
4
18
  }
package/dist/styles.css.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/styles.css"],"sourcesContent":["/* @particle-academy/react-fancy — base styles + animations */\n\n/* ─── Input & Field defaults ─────────────────────────────────────────────────\n Better UX out of the box: spacing between stacked fields, smooth transitions,\n and polished dark-mode defaults. All overridable via data-attribute selectors.\n ──────────────────────────────────────────────────────────────────────────── */\n\n/* Field spacing — adjacent fields get vertical breathing room */\n[data-react-fancy-field] + [data-react-fancy-field] {\n margin-top: 1rem;\n}\n\n/* Smooth transitions on all text inputs, selects, and textareas */\n[data-react-fancy-input] input,\n[data-react-fancy-textarea],\n[data-react-fancy-select],\n[data-react-fancy-date-picker],\n[data-react-fancy-autocomplete] input,\n[data-react-fancy-pillbox],\n[data-react-fancy-otp-input] input,\n[data-react-fancy-time-picker] input,\n[data-react-fancy-color-picker] input {\n transition: border-color 0.15s ease, box-shadow 0.15s ease,\n background-color 0.15s ease;\n}\n\n/* Dark-mode input refinements — slightly darker bg for contrast against page */\n/* ─── Inherent dark-mode defaults ────────────────────────────────────────────\n Every rule below is wrapped in :where() so it carries ZERO specificity, which\n buys two properties at once:\n 1. Inherent — a sensible dark appearance ships out of the box, even when the\n consumer's Tailwind build doesn't generate react-fancy's `dark:` utility\n classes (e.g. they didn't @source the package). This is what lets the\n overlays (Dropdown, Menu, Popover, …) go dark on their own.\n 2. Override-friendly — because specificity is 0, ANY consumer override wins:\n a plain `dark:bg-…` utility, a custom class, or the component's own\n `dark:` class (when it IS generated) all take precedence — no !important,\n no need to target the data-attribute.\n ──────────────────────────────────────────────────────────────────────────── */\n\n/* Inputs / selects / textareas — darker bg for contrast against the page */\n:where(.dark [data-react-fancy-input] input),\n:where(.dark [data-react-fancy-textarea]),\n:where(.dark [data-react-fancy-select]),\n:where(.dark [data-react-fancy-date-picker]),\n:where(.dark [data-react-fancy-autocomplete] input),\n:where(.dark [data-react-fancy-pillbox]),\n:where(.dark [data-react-fancy-otp-input] input),\n:where(.dark [data-react-fancy-time-picker] input) {\n background-color: #1e1e24;\n border-color: #3f3f46;\n}\n\n/* Focus ring — brighter border + subtle glow */\n:where(.dark [data-react-fancy-input] input:focus),\n:where(.dark [data-react-fancy-textarea]:focus),\n:where(.dark [data-react-fancy-select]:focus),\n:where(.dark [data-react-fancy-date-picker]:focus),\n:where(.dark [data-react-fancy-autocomplete] input:focus),\n:where(.dark [data-react-fancy-otp-input] input:focus),\n:where(.dark [data-react-fancy-time-picker] input:focus) {\n border-color: #60a5fa;\n box-shadow: 0 0 0 3px rgba(96, 165, 250, 0.15);\n}\n\n/* Field labels — brighter for readability */\n:where(.dark [data-react-fancy-field] > label:first-child) {\n color: #f4f4f5;\n}\n\n/* Checkbox & radio */\n:where(.dark [data-react-fancy-checkbox] input),\n:where(.dark [data-react-fancy-radio-group] input) {\n background-color: #1e1e24;\n border-color: #3f3f46;\n}\n\n/* Switch unchecked track */\n:where(.dark [data-react-fancy-switch] button[aria-checked=\"false\"]) {\n background-color: #3f3f46;\n}\n\n/* Input wrapper affixes */\n:where(.dark [data-react-fancy-input-wrapper] > span:first-child),\n:where(.dark [data-react-fancy-input-wrapper] > span:last-child) {\n border-color: #3f3f46;\n background-color: #27272a;\n}\n\n/* Date picker icon (calendar, clock) */\n:where(.dark [data-react-fancy-date-picker]::-webkit-calendar-picker-indicator) {\n filter: invert(0.8);\n}\n\n/* ─── Overlays — inherent dark surfaces ──────────────────────────────────────\n Dropdown / Menu / Popover / ContextMenu / MobileMenu flyout / Modal / Toast.\n Mirrors the components' own `dark:` utilities (zinc-900 surface, zinc-700\n border, zinc-300 text) so overlays render correctly in dark mode WITHOUT the\n consumer @sourcing react-fancy. When those utilities ARE generated they win\n (specificity 0 here), so there's no drift or double-styling. */\n:where(.dark [data-react-fancy-dropdown]),\n:where(.dark [data-react-fancy-menu]),\n:where(.dark [data-react-fancy-popover]),\n:where(.dark [data-react-fancy-context-menu]),\n:where(.dark [data-react-fancy-context-menu-sub-content]),\n:where(.dark [data-react-fancy-mobile-menu-flyout]),\n:where(.dark [data-react-fancy-modal]),\n:where(.dark [data-react-fancy-toast-item]) {\n background-color: #18181b; /* zinc-900 */\n border-color: #3f3f46; /* zinc-700 */\n color: #d4d4d8; /* zinc-300 */\n}\n\n/* Overlay item hover states */\n:where(.dark [data-react-fancy-dropdown-item]:hover),\n:where(.dark [data-react-fancy-menu-item]:hover),\n:where(.dark [data-react-fancy-context-menu-item]:hover) {\n background-color: #27272a; /* zinc-800 */\n}\n\n/* Overlay separators */\n:where(.dark [data-react-fancy-dropdown-separator]),\n:where(.dark [data-react-fancy-context-menu-separator]) {\n background-color: #3f3f46; /* zinc-700 */\n}\n\n/* ─── Media viewer — transparency checkerboard ───────────────────────────────\n Backdrop for <ImageViewer> / <MediaViewer> so transparent images read clearly.\n Light + dark variants; the dark rule is wrapped in :where() (zero specificity)\n so it ships out of the box without the consumer @sourcing react-fancy. */\n.fancy-checkerboard {\n background-color: #ffffff;\n background-image:\n linear-gradient(45deg, #e5e7eb 25%, transparent 25%),\n linear-gradient(-45deg, #e5e7eb 25%, transparent 25%),\n linear-gradient(45deg, transparent 75%, #e5e7eb 75%),\n linear-gradient(-45deg, transparent 75%, #e5e7eb 75%);\n background-size: 16px 16px;\n background-position: 0 0, 0 8px, 8px -8px, -8px 0;\n}\n\n:where(.dark) .fancy-checkerboard {\n background-color: #18181b; /* zinc-900 */\n background-image:\n linear-gradient(45deg, #27272a 25%, transparent 25%),\n linear-gradient(-45deg, #27272a 25%, transparent 25%),\n linear-gradient(45deg, transparent 75%, #27272a 75%),\n linear-gradient(-45deg, transparent 75%, #27272a 75%);\n}\n\n@keyframes fancy-fade-in {\n from {\n opacity: 0;\n transform: translateY(4px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n@keyframes fancy-slide-left {\n from {\n transform: translateX(100%);\n }\n to {\n transform: translateX(0);\n }\n}\n\n@keyframes fancy-slide-right {\n from {\n transform: translateX(-100%);\n }\n to {\n transform: translateX(0);\n }\n}\n\n.fancy-fade-in {\n animation: fancy-fade-in 0.2s ease-out;\n}\n\n.fancy-slide-left {\n animation: fancy-slide-left 0.3s ease-out;\n}\n\n.fancy-slide-right {\n animation: fancy-slide-right 0.3s ease-out;\n}\n\n/* Overlay / floating animations */\n\n@keyframes fancy-scale-in {\n from {\n opacity: 0;\n transform: scale(0.95);\n }\n to {\n opacity: 1;\n transform: scale(1);\n }\n}\n\n@keyframes fancy-slide-up {\n from {\n opacity: 0;\n transform: translateY(16px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n@keyframes fancy-fade-out {\n from {\n opacity: 1;\n }\n to {\n opacity: 0;\n }\n}\n\n@keyframes fancy-toast-in {\n from {\n opacity: 0;\n transform: translateX(100%);\n }\n to {\n opacity: 1;\n transform: translateX(0);\n }\n}\n\n@keyframes fancy-collapse-open {\n from {\n grid-template-rows: 0fr;\n }\n to {\n grid-template-rows: 1fr;\n }\n}\n\n@keyframes fancy-collapse-close {\n from {\n grid-template-rows: 1fr;\n }\n to {\n grid-template-rows: 0fr;\n }\n}\n\n.fancy-scale-in {\n animation: fancy-scale-in 0.15s ease-out;\n}\n\n.fancy-slide-up {\n animation: fancy-slide-up 0.2s ease-out;\n}\n\n.fancy-fade-out {\n animation: fancy-fade-out 0.15s ease-in forwards;\n}\n\n.fancy-toast-in {\n animation: fancy-toast-in 0.3s ease-out;\n}\n\n.fancy-collapse-open {\n animation: fancy-collapse-open 0.2s ease-out forwards;\n}\n\n.fancy-collapse-close {\n animation: fancy-collapse-close 0.15s ease-in forwards;\n}\n\n/* Mobile flyout slide animations */\n\n@keyframes fancy-slide-in-left {\n from {\n transform: translateX(-100%);\n }\n to {\n transform: translateX(0);\n }\n}\n\n@keyframes fancy-slide-out-left {\n from {\n transform: translateX(0);\n }\n to {\n transform: translateX(-100%);\n }\n}\n\n@keyframes fancy-slide-in-right {\n from {\n transform: translateX(100%);\n }\n to {\n transform: translateX(0);\n }\n}\n\n/* Avatar glow — a looping halo ring (box-shadow only, no reflow). Color comes\n from the --fancy-glow custom property set on the element. */\n@keyframes fancy-avatar-glow {\n 0% {\n box-shadow: 0 0 0 0 color-mix(in srgb, var(--fancy-glow, #a855f7) 55%, transparent);\n opacity: 0.9;\n }\n 70% {\n box-shadow: 0 0 0 6px color-mix(in srgb, var(--fancy-glow, #a855f7) 0%, transparent);\n opacity: 0.5;\n }\n 100% {\n box-shadow: 0 0 0 0 color-mix(in srgb, var(--fancy-glow, #a855f7) 0%, transparent);\n opacity: 0.9;\n }\n}\n\n.fancy-avatar-glow {\n position: absolute;\n inset: 0;\n border-radius: 9999px;\n pointer-events: none;\n box-shadow:\n 0 0 0 2px color-mix(in srgb, var(--fancy-glow, #a855f7) 70%, transparent),\n 0 0 10px 0 color-mix(in srgb, var(--fancy-glow, #a855f7) 45%, transparent);\n animation: fancy-avatar-glow 1.6s ease-out infinite;\n}\n\n@media (prefers-reduced-motion: reduce) {\n .fancy-avatar-glow {\n animation: none;\n }\n}\n\n@keyframes fancy-slide-out-right {\n from {\n transform: translateX(0);\n }\n to {\n transform: translateX(100%);\n }\n}\n\n.fancy-slide-in-left {\n animation: fancy-slide-in-left 0.25s ease-out;\n}\n\n.fancy-slide-out-left {\n animation: fancy-slide-out-left 0.2s ease-in forwards;\n}\n\n.fancy-slide-in-right {\n animation: fancy-slide-in-right 0.25s ease-out;\n}\n\n.fancy-slide-out-right {\n animation: fancy-slide-out-right 0.2s ease-in forwards;\n}\n\n/* Vertical drawer edges. The horizontal pair above predates Drawer (it was\n built for MobileMenu.Flyout, which only ever opened left/right); these\n complete the set so `side=\"top\"`/`side=\"bottom\"` animate rather than pop. */\n\n@keyframes fancy-slide-in-top {\n from {\n transform: translateY(-100%);\n }\n to {\n transform: translateY(0);\n }\n}\n\n@keyframes fancy-slide-out-top {\n from {\n transform: translateY(0);\n }\n to {\n transform: translateY(-100%);\n }\n}\n\n@keyframes fancy-slide-in-bottom {\n from {\n transform: translateY(100%);\n }\n to {\n transform: translateY(0);\n }\n}\n\n@keyframes fancy-slide-out-bottom {\n from {\n transform: translateY(0);\n }\n to {\n transform: translateY(100%);\n }\n}\n\n.fancy-slide-in-top {\n animation: fancy-slide-in-top 0.25s ease-out;\n}\n\n.fancy-slide-out-top {\n animation: fancy-slide-out-top 0.2s ease-in forwards;\n}\n\n.fancy-slide-in-bottom {\n animation: fancy-slide-in-bottom 0.25s ease-out;\n}\n\n.fancy-slide-out-bottom {\n animation: fancy-slide-out-bottom 0.2s ease-in forwards;\n}\n\n/* Reduced motion collapses the travel — but must NOT use `animation: none`.\n `useAnimation` unmounts on `animationend`, so removing the animation removes\n the event, and a closed drawer would stay in the DOM forever. A ~0 duration\n still fires it. */\n@media (prefers-reduced-motion: reduce) {\n .fancy-slide-in-left,\n .fancy-slide-out-left,\n .fancy-slide-in-right,\n .fancy-slide-out-right,\n .fancy-slide-in-top,\n .fancy-slide-out-top,\n .fancy-slide-in-bottom,\n .fancy-slide-out-bottom {\n animation-duration: 0.01ms;\n }\n}\n\n/* ─── Marquee ────────────────────────────────────────────────────────────────\n Edge-to-edge auto-scrolling strip. The track holds two identical copies of\n the content; translateX(-50%) over one loop shifts exactly one copy, so the\n wrap is seamless. Duration/gap/fade arrive as custom properties set by the\n component. No animation under prefers-reduced-motion.\n ──────────────────────────────────────────────────────────────────────────── */\n\n[data-react-fancy-marquee] {\n overflow: hidden;\n width: 100%;\n}\n\n.fancy-marquee--fade {\n -webkit-mask-image: linear-gradient(\n to right,\n transparent,\n black var(--fancy-marquee-fade, 48px),\n black calc(100% - var(--fancy-marquee-fade, 48px)),\n transparent\n );\n mask-image: linear-gradient(\n to right,\n transparent,\n black var(--fancy-marquee-fade, 48px),\n black calc(100% - var(--fancy-marquee-fade, 48px)),\n transparent\n );\n}\n\n.fancy-marquee__track {\n display: flex;\n width: max-content;\n animation: fancy-marquee var(--fancy-marquee-duration, 40s) linear infinite;\n will-change: transform;\n}\n\n[data-react-fancy-marquee][data-direction=\"right\"] .fancy-marquee__track {\n animation-direction: reverse;\n}\n\n.fancy-marquee--pause-hover:hover .fancy-marquee__track,\n[data-react-fancy-marquee][data-paused] .fancy-marquee__track {\n animation-play-state: paused;\n}\n\n.fancy-marquee__group {\n display: flex;\n flex: none;\n}\n\n.fancy-marquee__unit {\n display: flex;\n flex: none;\n align-items: center;\n gap: var(--fancy-marquee-gap, 40px);\n padding-inline-end: var(--fancy-marquee-gap, 40px);\n white-space: nowrap;\n}\n\n.fancy-marquee__item,\n.fancy-marquee__separator {\n flex: none;\n}\n\n@keyframes fancy-marquee {\n from {\n transform: translateX(0);\n }\n to {\n transform: translateX(-50%);\n }\n}\n\n@media (prefers-reduced-motion: reduce) {\n .fancy-marquee__track {\n animation: none;\n }\n}\n"],"mappings":"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","names":[]}
1
+ {"version":3,"sources":["../src/styles.css"],"sourcesContent":["/* @particle-academy/react-fancy — base styles + animations */\n\n/* ─── Brand colour scheme ────────────────────────────────────────────────────\n Three token families every Fancy package can rely on, so a component never\n has to invent a palette or hardcode a literal:\n\n brand one accent — the thing a consumer rebrands first\n primary-* the accent as a full 50→950 scale\n secondary-* the NEUTRAL scale for surfaces, borders and body text\n\n Why this exists: packages were already writing `bg-brand`, `text-primary-600`\n and `border-secondary-200` against tokens nothing defined. Tailwind generated\n no such utility, the class silently resolved to nothing, and the component\n rendered unstyled — correct markup, no colour, no error. Defining them here\n turns those classes into a contract instead of a hope.\n\n SECONDARY INVERTS WITH THE THEME. `text-secondary-900` means \"strongest\n foreground\", not \"nearly black\" — so it stays readable on a dark surface.\n That distinction is the whole point: mixing a literal background (`bg-white`)\n with a semantic foreground (`text-secondary-900`) is what produced\n white-on-white in a dark host.\n\n OVERRIDE IT. Redefine any of these in your own `@theme` (or on `:root`) and\n yours wins — nothing here is `!important`, and the utilities read the variable\n rather than baking a value in:\n\n @theme { --color-brand: var(--color-emerald-600); }\n ──────────────────────────────────────────────────────────────────────────── */\n@theme {\n --color-brand: var(--color-violet-600);\n\n --color-primary-50: var(--color-violet-50);\n --color-primary-100: var(--color-violet-100);\n --color-primary-200: var(--color-violet-200);\n --color-primary-300: var(--color-violet-300);\n --color-primary-400: var(--color-violet-400);\n --color-primary-500: var(--color-violet-500);\n --color-primary-600: var(--color-violet-600);\n --color-primary-700: var(--color-violet-700);\n --color-primary-800: var(--color-violet-800);\n --color-primary-900: var(--color-violet-900);\n --color-primary-950: var(--color-violet-950);\n\n /* Light-theme defaults: 50 = faintest surface, 900/950 = strongest text. */\n --color-secondary-50: var(--color-zinc-50);\n --color-secondary-100: var(--color-zinc-100);\n --color-secondary-200: var(--color-zinc-200);\n --color-secondary-300: var(--color-zinc-300);\n --color-secondary-400: var(--color-zinc-400);\n --color-secondary-500: var(--color-zinc-500);\n --color-secondary-600: var(--color-zinc-600);\n --color-secondary-700: var(--color-zinc-700);\n --color-secondary-800: var(--color-zinc-800);\n --color-secondary-900: var(--color-zinc-900);\n --color-secondary-950: var(--color-zinc-950);\n}\n\n/* Dark: the neutral scale flips, so \"900\" still means strongest foreground and\n \"50\" still means faintest surface. Wrapped in :where() for zero specificity,\n matching the rest of this file — any consumer override beats it. */\n:where(.dark) {\n --color-secondary-50: var(--color-zinc-950);\n --color-secondary-100: var(--color-zinc-900);\n --color-secondary-200: var(--color-zinc-800);\n --color-secondary-300: var(--color-zinc-700);\n --color-secondary-400: var(--color-zinc-600);\n --color-secondary-500: var(--color-zinc-500);\n --color-secondary-600: var(--color-zinc-400);\n --color-secondary-700: var(--color-zinc-300);\n --color-secondary-800: var(--color-zinc-200);\n --color-secondary-900: var(--color-zinc-100);\n --color-secondary-950: var(--color-zinc-50);\n}\n\n/* ─── Input & Field defaults ─────────────────────────────────────────────────\n Better UX out of the box: spacing between stacked fields, smooth transitions,\n and polished dark-mode defaults. All overridable via data-attribute selectors.\n ──────────────────────────────────────────────────────────────────────────── */\n\n/* Field spacing — adjacent fields get vertical breathing room */\n[data-react-fancy-field] + [data-react-fancy-field] {\n margin-top: 1rem;\n}\n\n/* Smooth transitions on all text inputs, selects, and textareas */\n[data-react-fancy-input] input,\n[data-react-fancy-textarea],\n[data-react-fancy-select],\n[data-react-fancy-date-picker],\n[data-react-fancy-autocomplete] input,\n[data-react-fancy-pillbox],\n[data-react-fancy-otp-input] input,\n[data-react-fancy-time-picker] input,\n[data-react-fancy-color-picker] input {\n transition: border-color 0.15s ease, box-shadow 0.15s ease,\n background-color 0.15s ease;\n}\n\n/* Dark-mode input refinements — slightly darker bg for contrast against page */\n/* ─── Inherent dark-mode defaults ────────────────────────────────────────────\n Every rule below is wrapped in :where() so it carries ZERO specificity, which\n buys two properties at once:\n 1. Inherent — a sensible dark appearance ships out of the box, even when the\n consumer's Tailwind build doesn't generate react-fancy's `dark:` utility\n classes (e.g. they didn't @source the package). This is what lets the\n overlays (Dropdown, Menu, Popover, …) go dark on their own.\n 2. Override-friendly — because specificity is 0, ANY consumer override wins:\n a plain `dark:bg-…` utility, a custom class, or the component's own\n `dark:` class (when it IS generated) all take precedence — no !important,\n no need to target the data-attribute.\n ──────────────────────────────────────────────────────────────────────────── */\n\n/* Inputs / selects / textareas — darker bg for contrast against the page */\n:where(.dark [data-react-fancy-input] input),\n:where(.dark [data-react-fancy-textarea]),\n:where(.dark [data-react-fancy-select]),\n:where(.dark [data-react-fancy-date-picker]),\n:where(.dark [data-react-fancy-autocomplete] input),\n:where(.dark [data-react-fancy-pillbox]),\n:where(.dark [data-react-fancy-otp-input] input),\n:where(.dark [data-react-fancy-time-picker] input) {\n background-color: #1e1e24;\n border-color: #3f3f46;\n}\n\n/* Focus ring — brighter border + subtle glow */\n:where(.dark [data-react-fancy-input] input:focus),\n:where(.dark [data-react-fancy-textarea]:focus),\n:where(.dark [data-react-fancy-select]:focus),\n:where(.dark [data-react-fancy-date-picker]:focus),\n:where(.dark [data-react-fancy-autocomplete] input:focus),\n:where(.dark [data-react-fancy-otp-input] input:focus),\n:where(.dark [data-react-fancy-time-picker] input:focus) {\n border-color: #60a5fa;\n box-shadow: 0 0 0 3px rgba(96, 165, 250, 0.15);\n}\n\n/* Field labels — brighter for readability */\n:where(.dark [data-react-fancy-field] > label:first-child) {\n color: #f4f4f5;\n}\n\n/* Checkbox & radio */\n:where(.dark [data-react-fancy-checkbox] input),\n:where(.dark [data-react-fancy-radio-group] input) {\n background-color: #1e1e24;\n border-color: #3f3f46;\n}\n\n/* Switch unchecked track */\n:where(.dark [data-react-fancy-switch] button[aria-checked=\"false\"]) {\n background-color: #3f3f46;\n}\n\n/* Input wrapper affixes */\n:where(.dark [data-react-fancy-input-wrapper] > span:first-child),\n:where(.dark [data-react-fancy-input-wrapper] > span:last-child) {\n border-color: #3f3f46;\n background-color: #27272a;\n}\n\n/* Date picker icon (calendar, clock) */\n:where(.dark [data-react-fancy-date-picker]::-webkit-calendar-picker-indicator) {\n filter: invert(0.8);\n}\n\n/* ─── Overlays — inherent dark surfaces ──────────────────────────────────────\n Dropdown / Menu / Popover / ContextMenu / MobileMenu flyout / Modal / Toast.\n Mirrors the components' own `dark:` utilities (zinc-900 surface, zinc-700\n border, zinc-300 text) so overlays render correctly in dark mode WITHOUT the\n consumer @sourcing react-fancy. When those utilities ARE generated they win\n (specificity 0 here), so there's no drift or double-styling. */\n:where(.dark [data-react-fancy-dropdown]),\n:where(.dark [data-react-fancy-menu]),\n:where(.dark [data-react-fancy-popover]),\n:where(.dark [data-react-fancy-context-menu]),\n:where(.dark [data-react-fancy-context-menu-sub-content]),\n:where(.dark [data-react-fancy-mobile-menu-flyout]),\n:where(.dark [data-react-fancy-modal]),\n:where(.dark [data-react-fancy-toast-item]) {\n background-color: #18181b; /* zinc-900 */\n border-color: #3f3f46; /* zinc-700 */\n color: #d4d4d8; /* zinc-300 */\n}\n\n/* Overlay item hover states */\n:where(.dark [data-react-fancy-dropdown-item]:hover),\n:where(.dark [data-react-fancy-menu-item]:hover),\n:where(.dark [data-react-fancy-context-menu-item]:hover) {\n background-color: #27272a; /* zinc-800 */\n}\n\n/* Overlay separators */\n:where(.dark [data-react-fancy-dropdown-separator]),\n:where(.dark [data-react-fancy-context-menu-separator]) {\n background-color: #3f3f46; /* zinc-700 */\n}\n\n/* ─── Media viewer — transparency checkerboard ───────────────────────────────\n Backdrop for <ImageViewer> / <MediaViewer> so transparent images read clearly.\n Light + dark variants; the dark rule is wrapped in :where() (zero specificity)\n so it ships out of the box without the consumer @sourcing react-fancy. */\n.fancy-checkerboard {\n background-color: #ffffff;\n background-image:\n linear-gradient(45deg, #e5e7eb 25%, transparent 25%),\n linear-gradient(-45deg, #e5e7eb 25%, transparent 25%),\n linear-gradient(45deg, transparent 75%, #e5e7eb 75%),\n linear-gradient(-45deg, transparent 75%, #e5e7eb 75%);\n background-size: 16px 16px;\n background-position: 0 0, 0 8px, 8px -8px, -8px 0;\n}\n\n:where(.dark) .fancy-checkerboard {\n background-color: #18181b; /* zinc-900 */\n background-image:\n linear-gradient(45deg, #27272a 25%, transparent 25%),\n linear-gradient(-45deg, #27272a 25%, transparent 25%),\n linear-gradient(45deg, transparent 75%, #27272a 75%),\n linear-gradient(-45deg, transparent 75%, #27272a 75%);\n}\n\n@keyframes fancy-fade-in {\n from {\n opacity: 0;\n transform: translateY(4px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n@keyframes fancy-slide-left {\n from {\n transform: translateX(100%);\n }\n to {\n transform: translateX(0);\n }\n}\n\n@keyframes fancy-slide-right {\n from {\n transform: translateX(-100%);\n }\n to {\n transform: translateX(0);\n }\n}\n\n.fancy-fade-in {\n animation: fancy-fade-in 0.2s ease-out;\n}\n\n.fancy-slide-left {\n animation: fancy-slide-left 0.3s ease-out;\n}\n\n.fancy-slide-right {\n animation: fancy-slide-right 0.3s ease-out;\n}\n\n/* Overlay / floating animations */\n\n@keyframes fancy-scale-in {\n from {\n opacity: 0;\n transform: scale(0.95);\n }\n to {\n opacity: 1;\n transform: scale(1);\n }\n}\n\n@keyframes fancy-slide-up {\n from {\n opacity: 0;\n transform: translateY(16px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n@keyframes fancy-fade-out {\n from {\n opacity: 1;\n }\n to {\n opacity: 0;\n }\n}\n\n@keyframes fancy-toast-in {\n from {\n opacity: 0;\n transform: translateX(100%);\n }\n to {\n opacity: 1;\n transform: translateX(0);\n }\n}\n\n@keyframes fancy-collapse-open {\n from {\n grid-template-rows: 0fr;\n }\n to {\n grid-template-rows: 1fr;\n }\n}\n\n@keyframes fancy-collapse-close {\n from {\n grid-template-rows: 1fr;\n }\n to {\n grid-template-rows: 0fr;\n }\n}\n\n.fancy-scale-in {\n animation: fancy-scale-in 0.15s ease-out;\n}\n\n.fancy-slide-up {\n animation: fancy-slide-up 0.2s ease-out;\n}\n\n.fancy-fade-out {\n animation: fancy-fade-out 0.15s ease-in forwards;\n}\n\n.fancy-toast-in {\n animation: fancy-toast-in 0.3s ease-out;\n}\n\n.fancy-collapse-open {\n animation: fancy-collapse-open 0.2s ease-out forwards;\n}\n\n.fancy-collapse-close {\n animation: fancy-collapse-close 0.15s ease-in forwards;\n}\n\n/* Mobile flyout slide animations */\n\n@keyframes fancy-slide-in-left {\n from {\n transform: translateX(-100%);\n }\n to {\n transform: translateX(0);\n }\n}\n\n@keyframes fancy-slide-out-left {\n from {\n transform: translateX(0);\n }\n to {\n transform: translateX(-100%);\n }\n}\n\n@keyframes fancy-slide-in-right {\n from {\n transform: translateX(100%);\n }\n to {\n transform: translateX(0);\n }\n}\n\n/* Avatar glow — a looping halo ring (box-shadow only, no reflow). Color comes\n from the --fancy-glow custom property set on the element. */\n@keyframes fancy-avatar-glow {\n 0% {\n box-shadow: 0 0 0 0 color-mix(in srgb, var(--fancy-glow, #a855f7) 55%, transparent);\n opacity: 0.9;\n }\n 70% {\n box-shadow: 0 0 0 6px color-mix(in srgb, var(--fancy-glow, #a855f7) 0%, transparent);\n opacity: 0.5;\n }\n 100% {\n box-shadow: 0 0 0 0 color-mix(in srgb, var(--fancy-glow, #a855f7) 0%, transparent);\n opacity: 0.9;\n }\n}\n\n.fancy-avatar-glow {\n position: absolute;\n inset: 0;\n border-radius: 9999px;\n pointer-events: none;\n box-shadow:\n 0 0 0 2px color-mix(in srgb, var(--fancy-glow, #a855f7) 70%, transparent),\n 0 0 10px 0 color-mix(in srgb, var(--fancy-glow, #a855f7) 45%, transparent);\n animation: fancy-avatar-glow 1.6s ease-out infinite;\n}\n\n@media (prefers-reduced-motion: reduce) {\n .fancy-avatar-glow {\n animation: none;\n }\n}\n\n@keyframes fancy-slide-out-right {\n from {\n transform: translateX(0);\n }\n to {\n transform: translateX(100%);\n }\n}\n\n.fancy-slide-in-left {\n animation: fancy-slide-in-left 0.25s ease-out;\n}\n\n.fancy-slide-out-left {\n animation: fancy-slide-out-left 0.2s ease-in forwards;\n}\n\n.fancy-slide-in-right {\n animation: fancy-slide-in-right 0.25s ease-out;\n}\n\n.fancy-slide-out-right {\n animation: fancy-slide-out-right 0.2s ease-in forwards;\n}\n\n/* Vertical drawer edges. The horizontal pair above predates Drawer (it was\n built for MobileMenu.Flyout, which only ever opened left/right); these\n complete the set so `side=\"top\"`/`side=\"bottom\"` animate rather than pop. */\n\n@keyframes fancy-slide-in-top {\n from {\n transform: translateY(-100%);\n }\n to {\n transform: translateY(0);\n }\n}\n\n@keyframes fancy-slide-out-top {\n from {\n transform: translateY(0);\n }\n to {\n transform: translateY(-100%);\n }\n}\n\n@keyframes fancy-slide-in-bottom {\n from {\n transform: translateY(100%);\n }\n to {\n transform: translateY(0);\n }\n}\n\n@keyframes fancy-slide-out-bottom {\n from {\n transform: translateY(0);\n }\n to {\n transform: translateY(100%);\n }\n}\n\n.fancy-slide-in-top {\n animation: fancy-slide-in-top 0.25s ease-out;\n}\n\n.fancy-slide-out-top {\n animation: fancy-slide-out-top 0.2s ease-in forwards;\n}\n\n.fancy-slide-in-bottom {\n animation: fancy-slide-in-bottom 0.25s ease-out;\n}\n\n.fancy-slide-out-bottom {\n animation: fancy-slide-out-bottom 0.2s ease-in forwards;\n}\n\n/* Reduced motion collapses the travel — but must NOT use `animation: none`.\n `useAnimation` unmounts on `animationend`, so removing the animation removes\n the event, and a closed drawer would stay in the DOM forever. A ~0 duration\n still fires it. */\n@media (prefers-reduced-motion: reduce) {\n .fancy-slide-in-left,\n .fancy-slide-out-left,\n .fancy-slide-in-right,\n .fancy-slide-out-right,\n .fancy-slide-in-top,\n .fancy-slide-out-top,\n .fancy-slide-in-bottom,\n .fancy-slide-out-bottom {\n animation-duration: 0.01ms;\n }\n}\n\n/* ─── Marquee ────────────────────────────────────────────────────────────────\n Edge-to-edge auto-scrolling strip. The track holds two identical copies of\n the content; translateX(-50%) over one loop shifts exactly one copy, so the\n wrap is seamless. Duration/gap/fade arrive as custom properties set by the\n component. No animation under prefers-reduced-motion.\n ──────────────────────────────────────────────────────────────────────────── */\n\n[data-react-fancy-marquee] {\n overflow: hidden;\n width: 100%;\n}\n\n.fancy-marquee--fade {\n -webkit-mask-image: linear-gradient(\n to right,\n transparent,\n black var(--fancy-marquee-fade, 48px),\n black calc(100% - var(--fancy-marquee-fade, 48px)),\n transparent\n );\n mask-image: linear-gradient(\n to right,\n transparent,\n black var(--fancy-marquee-fade, 48px),\n black calc(100% - var(--fancy-marquee-fade, 48px)),\n transparent\n );\n}\n\n.fancy-marquee__track {\n display: flex;\n width: max-content;\n animation: fancy-marquee var(--fancy-marquee-duration, 40s) linear infinite;\n will-change: transform;\n}\n\n[data-react-fancy-marquee][data-direction=\"right\"] .fancy-marquee__track {\n animation-direction: reverse;\n}\n\n.fancy-marquee--pause-hover:hover .fancy-marquee__track,\n[data-react-fancy-marquee][data-paused] .fancy-marquee__track {\n animation-play-state: paused;\n}\n\n.fancy-marquee__group {\n display: flex;\n flex: none;\n}\n\n.fancy-marquee__unit {\n display: flex;\n flex: none;\n align-items: center;\n gap: var(--fancy-marquee-gap, 40px);\n padding-inline-end: var(--fancy-marquee-gap, 40px);\n white-space: nowrap;\n}\n\n.fancy-marquee__item,\n.fancy-marquee__separator {\n flex: none;\n}\n\n@keyframes fancy-marquee {\n from {\n transform: translateX(0);\n }\n to {\n transform: translateX(-50%);\n }\n}\n\n@media (prefers-reduced-motion: reduce) {\n .fancy-marquee__track {\n animation: none;\n }\n}\n"],"mappings":"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","names":[]}
package/package.json CHANGED
@@ -1,95 +1,95 @@
1
1
  {
2
- "name": "@particle-academy/react-fancy",
3
- "version": "4.18.0",
4
- "description": "React UI component library for Human+ UX — controlled, agent-bridgeable primitives",
5
- "repository": {
6
- "type": "git",
7
- "url": "git+https://github.com/Particle-Academy/react-fancy.git"
8
- },
9
- "homepage": "https://github.com/Particle-Academy/react-fancy#readme",
10
- "bugs": "https://github.com/Particle-Academy/react-fancy/issues",
11
- "type": "module",
12
- "main": "./dist/index.cjs",
13
- "module": "./dist/index.js",
14
- "types": "./dist/index.d.ts",
15
- "exports": {
16
- ".": {
17
- "import": {
18
- "types": "./dist/index.d.ts",
19
- "default": "./dist/index.js"
20
- },
21
- "require": {
22
- "types": "./dist/index.d.cts",
23
- "default": "./dist/index.cjs"
24
- }
2
+ "name": "@particle-academy/react-fancy",
3
+ "version": "4.19.0",
4
+ "description": "React UI component library for Human+ UX — controlled, agent-bridgeable primitives",
5
+ "repository": {
6
+ "type": "git",
7
+ "url": "git+https://github.com/Particle-Academy/react-fancy.git"
25
8
  },
26
- "./icons": {
27
- "import": {
28
- "types": "./dist/icons.d.ts",
29
- "default": "./dist/icons.js"
30
- },
31
- "require": {
32
- "types": "./dist/icons.d.cts",
33
- "default": "./dist/icons.cjs"
34
- }
9
+ "homepage": "https://github.com/Particle-Academy/react-fancy#readme",
10
+ "bugs": "https://github.com/Particle-Academy/react-fancy/issues",
11
+ "type": "module",
12
+ "main": "./dist/index.cjs",
13
+ "module": "./dist/index.js",
14
+ "types": "./dist/index.d.ts",
15
+ "exports": {
16
+ ".": {
17
+ "import": {
18
+ "types": "./dist/index.d.ts",
19
+ "default": "./dist/index.js"
20
+ },
21
+ "require": {
22
+ "types": "./dist/index.d.cts",
23
+ "default": "./dist/index.cjs"
24
+ }
25
+ },
26
+ "./icons": {
27
+ "import": {
28
+ "types": "./dist/icons.d.ts",
29
+ "default": "./dist/icons.js"
30
+ },
31
+ "require": {
32
+ "types": "./dist/icons.d.cts",
33
+ "default": "./dist/icons.cjs"
34
+ }
35
+ },
36
+ "./styles.css": "./dist/styles.css"
35
37
  },
36
- "./styles.css": "./dist/styles.css"
37
- },
38
- "files": [
39
- "dist",
40
- "docs",
41
- "README.md"
42
- ],
43
- "scripts": {
44
- "build": "tsup",
45
- "dev": "tsup --watch",
46
- "lint": "tsc --noEmit && eslint .",
47
- "clean": "rm -rf dist",
48
- "prepublishOnly": "npm run test && npm run lint && tsup",
49
- "test": "vitest run",
50
- "test:watch": "vitest"
51
- },
52
- "keywords": [
53
- "react",
54
- "components",
55
- "ui",
56
- "tailwind",
57
- "human-plus-ux"
58
- ],
59
- "peerDependencies": {
60
- "react": "^18.0.0 || ^19.0.0",
61
- "react-dom": "^18.0.0 || ^19.0.0",
62
- "tailwindcss": "^4.0.0"
63
- },
64
- "dependencies": {
65
- "@particle-academy/fancy-file-commons": ">=0.2 <2.0",
66
- "clsx": "^2.1.0",
67
- "lucide-react": "^0.511.0",
68
- "marked": "^15.0.0",
69
- "tailwind-merge": "^3.0.0"
70
- },
71
- "devDependencies": {
72
- "@types/react": "^19.0.0",
73
- "@types/react-dom": "^19.0.0",
74
- "eslint": "^10.8.0",
75
- "eslint-plugin-react-hooks": "^7.1.1",
76
- "jsdom": "^29.1.1",
77
- "react": "^19.0.0",
78
- "react-dom": "^19.0.0",
79
- "tailwindcss": "^4.0.0",
80
- "tsup": "^8.0.0",
81
- "typescript": "^5.7.0",
82
- "typescript-eslint": "^8.65.0",
83
- "vitest": "^3.2.7"
84
- },
85
- "publishConfig": {
86
- "access": "public"
87
- },
88
- "license": "MIT",
89
- "sideEffects": [
90
- "**/*.css"
91
- ],
92
- "overrides": {
93
- "esbuild": "^0.28.1"
94
- }
38
+ "files": [
39
+ "dist",
40
+ "docs",
41
+ "README.md"
42
+ ],
43
+ "scripts": {
44
+ "build": "tsup",
45
+ "dev": "tsup --watch",
46
+ "lint": "tsc --noEmit && eslint .",
47
+ "clean": "rm -rf dist",
48
+ "prepublishOnly": "npm run test && npm run lint && tsup",
49
+ "test": "vitest run",
50
+ "test:watch": "vitest"
51
+ },
52
+ "keywords": [
53
+ "react",
54
+ "components",
55
+ "ui",
56
+ "tailwind",
57
+ "human-plus-ux"
58
+ ],
59
+ "peerDependencies": {
60
+ "react": "^18.0.0 || ^19.0.0",
61
+ "react-dom": "^18.0.0 || ^19.0.0",
62
+ "tailwindcss": "^4.0.0"
63
+ },
64
+ "dependencies": {
65
+ "@particle-academy/fancy-file-commons": ">=0.2 <2.0",
66
+ "clsx": "^2.1.0",
67
+ "lucide-react": "^0.511.0",
68
+ "marked": "^15.0.0",
69
+ "tailwind-merge": "^3.0.0"
70
+ },
71
+ "devDependencies": {
72
+ "@types/react": "^19.0.0",
73
+ "@types/react-dom": "^19.0.0",
74
+ "eslint": "^10.8.0",
75
+ "eslint-plugin-react-hooks": "^7.1.1",
76
+ "jsdom": "^29.1.1",
77
+ "react": "^19.0.0",
78
+ "react-dom": "^19.0.0",
79
+ "tailwindcss": "^4.0.0",
80
+ "tsup": "^8.0.0",
81
+ "typescript": "^5.7.0",
82
+ "typescript-eslint": "^8.65.0",
83
+ "vitest": "^3.2.7"
84
+ },
85
+ "publishConfig": {
86
+ "access": "public"
87
+ },
88
+ "license": "MIT",
89
+ "sideEffects": [
90
+ "**/*.css"
91
+ ],
92
+ "overrides": {
93
+ "esbuild": "^0.28.1"
94
+ }
95
95
  }