@particle-academy/react-fancy 5.24.0 → 5.26.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.
@@ -78,8 +78,8 @@ var CardMedia = forwardRef(
78
78
  "data-react-fancy-card-media": "",
79
79
  className: cn(
80
80
  "relative overflow-hidden rounded-t-lg",
81
- // Card's `padding` prop pads EVERY direct div child
82
- // (`[&>div]:px-4 …`), which would inset the media and break the
81
+ // Card's `padding` prop pads EVERY direct child
82
+ // (`[&>*]:px-4 …`), which would inset the media and break the
83
83
  // flush-to-the-edge look every caller wants. `!` wins regardless of
84
84
  // stylesheet order, which plain `p-0` would not.
85
85
  "!px-0 !py-0",
@@ -120,9 +120,9 @@ var variantClasses = {
120
120
  };
121
121
  var paddingClasses = {
122
122
  none: "",
123
- sm: "[&>div]:px-3 [&>div]:py-2",
124
- md: "[&>div]:px-4 [&>div]:py-3",
125
- lg: "[&>div]:px-6 [&>div]:py-4"
123
+ sm: "[&>*]:px-3 [&>*]:py-2",
124
+ md: "[&>*]:px-4 [&>*]:py-3",
125
+ lg: "[&>*]:px-6 [&>*]:py-4"
126
126
  };
127
127
  var CardRoot = forwardRef(
128
128
  ({
@@ -163,5 +163,5 @@ var Card = Object.assign(CardRoot, {
163
163
  });
164
164
 
165
165
  export { Card, CardBody, CardFooter, CardHeader, CardMedia };
166
- //# sourceMappingURL=chunk-4K4ECIKK.js.map
167
- //# sourceMappingURL=chunk-4K4ECIKK.js.map
166
+ //# sourceMappingURL=chunk-ZIDBI6JX.js.map
167
+ //# sourceMappingURL=chunk-ZIDBI6JX.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/Card/CardHeader.tsx","../src/components/Card/CardBody.tsx","../src/components/Card/CardFooter.tsx","../src/components/Card/CardMedia.tsx","../src/components/Card/Card.tsx"],"names":["forwardRef","jsx"],"mappings":"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","file":"chunk-4K4ECIKK.js","sourcesContent":["import { forwardRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport type { CardHeaderProps } from \"./Card.types\";\n\nexport const CardHeader = forwardRef<HTMLDivElement, CardHeaderProps>(\n ({ className, children, ...props }, ref) => {\n return (\n <div\n ref={ref}\n data-react-fancy-card-header=\"\"\n className={cn(\n \"border-b border-zinc-200 dark:border-zinc-700\",\n className,\n )}\n {...props}\n >\n {children}\n </div>\n );\n },\n);\n\nCardHeader.displayName = \"CardHeader\";\n","import { forwardRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport type { CardBodyProps } from \"./Card.types\";\n\nexport const CardBody = forwardRef<HTMLDivElement, CardBodyProps>(\n ({ className, children, ...props }, ref) => {\n return (\n <div\n ref={ref}\n data-react-fancy-card-body=\"\"\n className={cn(className)}\n {...props}\n >\n {children}\n </div>\n );\n },\n);\n\nCardBody.displayName = \"CardBody\";\n","import { forwardRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport type { CardFooterProps } from \"./Card.types\";\n\nexport const CardFooter = forwardRef<HTMLDivElement, CardFooterProps>(\n ({ className, children, ...props }, ref) => {\n return (\n <div\n ref={ref}\n data-react-fancy-card-footer=\"\"\n className={cn(\n \"border-t border-zinc-200 dark:border-zinc-700\",\n className,\n )}\n {...props}\n >\n {children}\n </div>\n );\n },\n);\n\nCardFooter.displayName = \"CardFooter\";\n","import { forwardRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport type { CardMediaProps } from \"./Card.types\";\n\n/**\n * The fixed-ratio media region at the top of a card: a thumbnail, gradient or\n * solid swatch, with slots pinned to its corners.\n *\n * This is `Card.Media` rather than a separate `<MediaCard>` because the thing\n * being asked for was never a different card — it was a card with a picture in\n * it. Four surfaces had each rebuilt exactly this (a gallery index, a package\n * grid, a starter-kit grid and a showcase grid) and one of them was already\n * wrapping `Card` and hand-rolling only this region.\n *\n * ## The `background` is not decoration\n *\n * It shows through while the image loads and stays visible if the image never\n * arrives. The gallery relied on that: each style card is keyed to a swatch, so\n * a missing screenshot degrades to the right colour rather than to a hole.\n */\nexport const CardMedia = forwardRef<HTMLDivElement, CardMediaProps>(\n (\n {\n src,\n alt = \"\",\n ratio = \"16/9\",\n height,\n background,\n objectPosition = \"center\",\n loading = \"lazy\",\n topLeft,\n topRight,\n bottomLeft,\n bottomRight,\n className,\n style,\n children,\n ...props\n },\n ref,\n ) => {\n return (\n <div\n ref={ref}\n data-react-fancy-card-media=\"\"\n className={cn(\n \"relative overflow-hidden rounded-t-lg\",\n // Card's `padding` prop pads EVERY direct div child\n // (`[&>div]:px-4 …`), which would inset the media and break the\n // flush-to-the-edge look every caller wants. `!` wins regardless of\n // stylesheet order, which plain `p-0` would not.\n \"!px-0 !py-0\",\n className,\n )}\n style={{\n ...(height === undefined ? { aspectRatio: ratio } : { height }),\n ...(background ? { background } : null),\n ...style,\n }}\n {...props}\n >\n {src ? (\n <img\n src={src}\n alt={alt}\n loading={loading}\n className=\"absolute inset-0 h-full w-full object-cover\"\n style={{ objectPosition }}\n />\n ) : null}\n\n {children}\n\n {topLeft ? <span className=\"absolute left-2 top-2 z-10\">{topLeft}</span> : null}\n {topRight ? <span className=\"absolute right-2 top-2 z-10\">{topRight}</span> : null}\n {bottomLeft ? <span className=\"absolute bottom-2 left-2 z-10\">{bottomLeft}</span> : null}\n {bottomRight ? <span className=\"absolute bottom-2 right-2 z-10\">{bottomRight}</span> : null}\n </div>\n );\n },\n);\n\nCardMedia.displayName = \"CardMedia\";\n","import { forwardRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { CardHeader } from \"./CardHeader\";\nimport { CardBody } from \"./CardBody\";\nimport { CardFooter } from \"./CardFooter\";\nimport { CardMedia } from \"./CardMedia\";\nimport type { CardProps } from \"./Card.types\";\n\nconst variantClasses: Record<NonNullable<CardProps[\"variant\"]>, string> = {\n outlined: \"border border-zinc-200 dark:border-zinc-700\",\n elevated: \"shadow-md border border-zinc-100 dark:border-zinc-800\",\n flat: \"bg-zinc-50 dark:bg-zinc-800/50\",\n};\n\nconst paddingClasses: Record<NonNullable<CardProps[\"padding\"]>, string> = {\n none: \"\",\n sm: \"[&>div]:px-3 [&>div]:py-2\",\n md: \"[&>div]:px-4 [&>div]:py-3\",\n lg: \"[&>div]:px-6 [&>div]:py-4\",\n};\n\nconst CardRoot = forwardRef<HTMLDivElement, CardProps>(\n (\n {\n variant = \"outlined\",\n padding = \"md\",\n interactive = false,\n className,\n children,\n ...props\n },\n ref,\n ) => {\n return (\n <div\n ref={ref}\n data-react-fancy-card=\"\"\n className={cn(\n \"rounded-lg bg-white dark:bg-zinc-900\",\n variantClasses[variant],\n // `overflow-hidden` is part of `interactive` rather than always-on:\n // clipping unconditionally would cut off popovers and dropdowns that\n // legitimately overflow a static card.\n interactive &&\n \"overflow-hidden transition hover:-translate-y-0.5 hover:shadow-lg hover:border-zinc-300 dark:hover:border-zinc-600\",\n paddingClasses[padding],\n className,\n )}\n {...props}\n >\n {children}\n </div>\n );\n },\n);\n\nCardRoot.displayName = \"Card\";\n\nexport const Card = Object.assign(CardRoot, {\n Media: CardMedia,\n Header: CardHeader,\n Body: CardBody,\n Footer: CardFooter,\n});\n"]}
1
+ {"version":3,"sources":["../src/components/Card/CardHeader.tsx","../src/components/Card/CardBody.tsx","../src/components/Card/CardFooter.tsx","../src/components/Card/CardMedia.tsx","../src/components/Card/Card.tsx"],"names":["forwardRef","jsx"],"mappings":"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","file":"chunk-ZIDBI6JX.js","sourcesContent":["import { forwardRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport type { CardHeaderProps } from \"./Card.types\";\n\nexport const CardHeader = forwardRef<HTMLDivElement, CardHeaderProps>(\n ({ className, children, ...props }, ref) => {\n return (\n <div\n ref={ref}\n data-react-fancy-card-header=\"\"\n className={cn(\n \"border-b border-zinc-200 dark:border-zinc-700\",\n className,\n )}\n {...props}\n >\n {children}\n </div>\n );\n },\n);\n\nCardHeader.displayName = \"CardHeader\";\n","import { forwardRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport type { CardBodyProps } from \"./Card.types\";\n\nexport const CardBody = forwardRef<HTMLDivElement, CardBodyProps>(\n ({ className, children, ...props }, ref) => {\n return (\n <div\n ref={ref}\n data-react-fancy-card-body=\"\"\n className={cn(className)}\n {...props}\n >\n {children}\n </div>\n );\n },\n);\n\nCardBody.displayName = \"CardBody\";\n","import { forwardRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport type { CardFooterProps } from \"./Card.types\";\n\nexport const CardFooter = forwardRef<HTMLDivElement, CardFooterProps>(\n ({ className, children, ...props }, ref) => {\n return (\n <div\n ref={ref}\n data-react-fancy-card-footer=\"\"\n className={cn(\n \"border-t border-zinc-200 dark:border-zinc-700\",\n className,\n )}\n {...props}\n >\n {children}\n </div>\n );\n },\n);\n\nCardFooter.displayName = \"CardFooter\";\n","import { forwardRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport type { CardMediaProps } from \"./Card.types\";\n\n/**\n * The fixed-ratio media region at the top of a card: a thumbnail, gradient or\n * solid swatch, with slots pinned to its corners.\n *\n * This is `Card.Media` rather than a separate `<MediaCard>` because the thing\n * being asked for was never a different card — it was a card with a picture in\n * it. Four surfaces had each rebuilt exactly this (a gallery index, a package\n * grid, a starter-kit grid and a showcase grid) and one of them was already\n * wrapping `Card` and hand-rolling only this region.\n *\n * ## The `background` is not decoration\n *\n * It shows through while the image loads and stays visible if the image never\n * arrives. The gallery relied on that: each style card is keyed to a swatch, so\n * a missing screenshot degrades to the right colour rather than to a hole.\n */\nexport const CardMedia = forwardRef<HTMLDivElement, CardMediaProps>(\n (\n {\n src,\n alt = \"\",\n ratio = \"16/9\",\n height,\n background,\n objectPosition = \"center\",\n loading = \"lazy\",\n topLeft,\n topRight,\n bottomLeft,\n bottomRight,\n className,\n style,\n children,\n ...props\n },\n ref,\n ) => {\n return (\n <div\n ref={ref}\n data-react-fancy-card-media=\"\"\n className={cn(\n \"relative overflow-hidden rounded-t-lg\",\n // Card's `padding` prop pads EVERY direct child\n // (`[&>*]:px-4 …`), which would inset the media and break the\n // flush-to-the-edge look every caller wants. `!` wins regardless of\n // stylesheet order, which plain `p-0` would not.\n \"!px-0 !py-0\",\n className,\n )}\n style={{\n ...(height === undefined ? { aspectRatio: ratio } : { height }),\n ...(background ? { background } : null),\n ...style,\n }}\n {...props}\n >\n {src ? (\n <img\n src={src}\n alt={alt}\n loading={loading}\n className=\"absolute inset-0 h-full w-full object-cover\"\n style={{ objectPosition }}\n />\n ) : null}\n\n {children}\n\n {topLeft ? <span className=\"absolute left-2 top-2 z-10\">{topLeft}</span> : null}\n {topRight ? <span className=\"absolute right-2 top-2 z-10\">{topRight}</span> : null}\n {bottomLeft ? <span className=\"absolute bottom-2 left-2 z-10\">{bottomLeft}</span> : null}\n {bottomRight ? <span className=\"absolute bottom-2 right-2 z-10\">{bottomRight}</span> : null}\n </div>\n );\n },\n);\n\nCardMedia.displayName = \"CardMedia\";\n","import { forwardRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { CardHeader } from \"./CardHeader\";\nimport { CardBody } from \"./CardBody\";\nimport { CardFooter } from \"./CardFooter\";\nimport { CardMedia } from \"./CardMedia\";\nimport type { CardProps } from \"./Card.types\";\n\nconst variantClasses: Record<NonNullable<CardProps[\"variant\"]>, string> = {\n outlined: \"border border-zinc-200 dark:border-zinc-700\",\n elevated: \"shadow-md border border-zinc-100 dark:border-zinc-800\",\n flat: \"bg-zinc-50 dark:bg-zinc-800/50\",\n};\n\n/**\n * Padding is applied to the card's DIRECT CHILDREN rather than the card\n * itself, so a full-bleed child (`Card.Media`) can opt out with `!px-0`\n * without having to undo a padding that is already baked into the frame.\n *\n * The selector is `&>*`, not `&>div`. It was `&>div` until 5.24.0, which meant\n * the tag a caller happened to choose silently decided whether that child was\n * padded: `<Card><div>a</div><p>b</p></Card>` inset the div and left the\n * paragraph hard against the border. Nothing in the caller's code hinted at\n * the rule, and the result read as a bug in the card.\n */\nconst paddingClasses: Record<NonNullable<CardProps[\"padding\"]>, string> = {\n none: \"\",\n sm: \"[&>*]:px-3 [&>*]:py-2\",\n md: \"[&>*]:px-4 [&>*]:py-3\",\n lg: \"[&>*]:px-6 [&>*]:py-4\",\n};\n\nconst CardRoot = forwardRef<HTMLDivElement, CardProps>(\n (\n {\n variant = \"outlined\",\n padding = \"md\",\n interactive = false,\n className,\n children,\n ...props\n },\n ref,\n ) => {\n return (\n <div\n ref={ref}\n data-react-fancy-card=\"\"\n className={cn(\n \"rounded-lg bg-white dark:bg-zinc-900\",\n variantClasses[variant],\n // `overflow-hidden` is part of `interactive` rather than always-on:\n // clipping unconditionally would cut off popovers and dropdowns that\n // legitimately overflow a static card.\n interactive &&\n \"overflow-hidden transition hover:-translate-y-0.5 hover:shadow-lg hover:border-zinc-300 dark:hover:border-zinc-600\",\n paddingClasses[padding],\n className,\n )}\n {...props}\n >\n {children}\n </div>\n );\n },\n);\n\nCardRoot.displayName = \"Card\";\n\nexport const Card = Object.assign(CardRoot, {\n Media: CardMedia,\n Header: CardHeader,\n Body: CardBody,\n Footer: CardFooter,\n});\n"]}
package/dist/index.cjs CHANGED
@@ -40,7 +40,7 @@ var chunk6LOV75CN_cjs = require('./chunk-6LOV75CN.cjs');
40
40
  var chunkHIN6PHSE_cjs = require('./chunk-HIN6PHSE.cjs');
41
41
  var chunkYAJYIRQL_cjs = require('./chunk-YAJYIRQL.cjs');
42
42
  var chunkWKNVZUWZ_cjs = require('./chunk-WKNVZUWZ.cjs');
43
- var chunk5XTNJBC5_cjs = require('./chunk-5XTNJBC5.cjs');
43
+ var chunk7HN4M5MV_cjs = require('./chunk-7HN4M5MV.cjs');
44
44
  var chunkXQNYFXBY_cjs = require('./chunk-XQNYFXBY.cjs');
45
45
  var chunkVUKIFFWK_cjs = require('./chunk-VUKIFFWK.cjs');
46
46
  var chunkHBCKKE24_cjs = require('./chunk-HBCKKE24.cjs');
@@ -101,8 +101,8 @@ var chunkQKFOJKVE_cjs = require('./chunk-QKFOJKVE.cjs');
101
101
  var chunkBFKCVSNK_cjs = require('./chunk-BFKCVSNK.cjs');
102
102
  var chunkQOGKO6JH_cjs = require('./chunk-QOGKO6JH.cjs');
103
103
  require('./chunk-3I2KWNXT.cjs');
104
- var chunkCJVNO5YM_cjs = require('./chunk-CJVNO5YM.cjs');
105
- var chunk524TOKU3_cjs = require('./chunk-524TOKU3.cjs');
104
+ var chunkEJHAIXAE_cjs = require('./chunk-EJHAIXAE.cjs');
105
+ var chunk5DQ2XUJI_cjs = require('./chunk-5DQ2XUJI.cjs');
106
106
  var chunk6SO2ZX3J_cjs = require('./chunk-6SO2ZX3J.cjs');
107
107
  var chunkN4VHOTMK_cjs = require('./chunk-N4VHOTMK.cjs');
108
108
  var chunkZTC3EQFZ_cjs = require('./chunk-ZTC3EQFZ.cjs');
@@ -290,51 +290,51 @@ Object.defineProperty(exports, "usePopover", {
290
290
  });
291
291
  Object.defineProperty(exports, "JSON_FIELD_TYPES", {
292
292
  enumerable: true,
293
- get: function () { return chunk5XTNJBC5_cjs.JSON_FIELD_TYPES; }
293
+ get: function () { return chunk7HN4M5MV_cjs.JSON_FIELD_TYPES; }
294
294
  });
295
295
  Object.defineProperty(exports, "JsonEditor", {
296
296
  enumerable: true,
297
- get: function () { return chunk5XTNJBC5_cjs.JsonEditor; }
297
+ get: function () { return chunk7HN4M5MV_cjs.JsonEditor; }
298
298
  });
299
299
  Object.defineProperty(exports, "applyJsonEdit", {
300
300
  enumerable: true,
301
- get: function () { return chunk5XTNJBC5_cjs.applyJsonEdit; }
301
+ get: function () { return chunk7HN4M5MV_cjs.applyJsonEdit; }
302
302
  });
303
303
  Object.defineProperty(exports, "describeEdit", {
304
304
  enumerable: true,
305
- get: function () { return chunk5XTNJBC5_cjs.describeEdit; }
305
+ get: function () { return chunk7HN4M5MV_cjs.describeEdit; }
306
306
  });
307
307
  Object.defineProperty(exports, "findJsonConflicts", {
308
308
  enumerable: true,
309
- get: function () { return chunk5XTNJBC5_cjs.findJsonConflicts; }
309
+ get: function () { return chunk7HN4M5MV_cjs.findJsonConflicts; }
310
310
  });
311
311
  Object.defineProperty(exports, "getAtPath", {
312
312
  enumerable: true,
313
- get: function () { return chunk5XTNJBC5_cjs.getAtPath; }
313
+ get: function () { return chunk7HN4M5MV_cjs.getAtPath; }
314
314
  });
315
315
  Object.defineProperty(exports, "inferType", {
316
316
  enumerable: true,
317
- get: function () { return chunk5XTNJBC5_cjs.inferType; }
317
+ get: function () { return chunk7HN4M5MV_cjs.inferType; }
318
318
  });
319
319
  Object.defineProperty(exports, "parseKeyMap", {
320
320
  enumerable: true,
321
- get: function () { return chunk5XTNJBC5_cjs.parseKeyMap; }
321
+ get: function () { return chunk7HN4M5MV_cjs.parseKeyMap; }
322
322
  });
323
323
  Object.defineProperty(exports, "parsePath", {
324
324
  enumerable: true,
325
- get: function () { return chunk5XTNJBC5_cjs.parsePath; }
325
+ get: function () { return chunk7HN4M5MV_cjs.parsePath; }
326
326
  });
327
327
  Object.defineProperty(exports, "pathToString", {
328
328
  enumerable: true,
329
- get: function () { return chunk5XTNJBC5_cjs.pathToString; }
329
+ get: function () { return chunk7HN4M5MV_cjs.pathToString; }
330
330
  });
331
331
  Object.defineProperty(exports, "resolveKeyRule", {
332
332
  enumerable: true,
333
- get: function () { return chunk5XTNJBC5_cjs.resolveKeyRule; }
333
+ get: function () { return chunk7HN4M5MV_cjs.resolveKeyRule; }
334
334
  });
335
335
  Object.defineProperty(exports, "typeMatches", {
336
336
  enumerable: true,
337
- get: function () { return chunk5XTNJBC5_cjs.typeMatches; }
337
+ get: function () { return chunk7HN4M5MV_cjs.typeMatches; }
338
338
  });
339
339
  Object.defineProperty(exports, "Switch", {
340
340
  enumerable: true,
@@ -718,11 +718,11 @@ Object.defineProperty(exports, "Calendar", {
718
718
  });
719
719
  Object.defineProperty(exports, "Callout", {
720
720
  enumerable: true,
721
- get: function () { return chunkCJVNO5YM_cjs.Callout; }
721
+ get: function () { return chunkEJHAIXAE_cjs.Callout; }
722
722
  });
723
723
  Object.defineProperty(exports, "Card", {
724
724
  enumerable: true,
725
- get: function () { return chunk524TOKU3_cjs.Card; }
725
+ get: function () { return chunk5DQ2XUJI_cjs.Card; }
726
726
  });
727
727
  Object.defineProperty(exports, "Carousel", {
728
728
  enumerable: true,
package/dist/index.js CHANGED
@@ -38,7 +38,7 @@ export { OtpInput } from './chunk-2LBRS6Z4.js';
38
38
  export { Pagination } from './chunk-YF2EHBTV.js';
39
39
  export { Pillbox } from './chunk-SX4CSO6C.js';
40
40
  export { Popover, usePopover } from './chunk-6KXAFP2T.js';
41
- export { JSON_FIELD_TYPES, JsonEditor, applyJsonEdit, describeEdit, findJsonConflicts, getAtPath, inferType, parseKeyMap, parsePath, pathToString, resolveKeyRule, typeMatches } from './chunk-E2I4C5EA.js';
41
+ export { JSON_FIELD_TYPES, JsonEditor, applyJsonEdit, describeEdit, findJsonConflicts, getAtPath, inferType, parseKeyMap, parsePath, pathToString, resolveKeyRule, typeMatches } from './chunk-IUWUXCCB.js';
42
42
  export { Switch } from './chunk-QJKWBU3I.js';
43
43
  export { DatePicker } from './chunk-L2FPIFMN.js';
44
44
  export { Input } from './chunk-JAAJJJKI.js';
@@ -99,8 +99,8 @@ export { Icon, configureIcons, registerIconAddendum, registerIconSet, registerIc
99
99
  export { sanitizeHref, sanitizeHtml } from './chunk-XJXQG34J.js';
100
100
  export { Calendar } from './chunk-NTMHP7FS.js';
101
101
  import './chunk-NMXCQOHV.js';
102
- export { Callout } from './chunk-HOP3XXPV.js';
103
- export { Card } from './chunk-4K4ECIKK.js';
102
+ export { Callout } from './chunk-4JGUPG22.js';
103
+ export { Card } from './chunk-ZIDBI6JX.js';
104
104
  export { Carousel, useCarousel } from './chunk-RFLPFQFF.js';
105
105
  export { Accordion, useAccordion } from './chunk-LYHQ4VBR.js';
106
106
  export { AccordionPanel, AccordionPanelContent, AccordionPanelSection, AccordionPanelTrigger, useAccordionPanel, useAccordionSection } from './chunk-I3RPL3GE.js';
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var chunk5XTNJBC5_cjs = require('./chunk-5XTNJBC5.cjs');
3
+ var chunk7HN4M5MV_cjs = require('./chunk-7HN4M5MV.cjs');
4
4
  require('./chunk-XQNYFXBY.cjs');
5
5
  require('./chunk-VUKIFFWK.cjs');
6
6
  require('./chunk-HBCKKE24.cjs');
@@ -17,7 +17,7 @@ require('./chunk-F2VJEXN2.cjs');
17
17
  require('./chunk-XCZZVRBY.cjs');
18
18
  require('./chunk-QKFOJKVE.cjs');
19
19
  require('./chunk-BFKCVSNK.cjs');
20
- require('./chunk-CJVNO5YM.cjs');
20
+ require('./chunk-EJHAIXAE.cjs');
21
21
  require('./chunk-J2DI6RMR.cjs');
22
22
  require('./chunk-KJ22KE56.cjs');
23
23
  require('./chunk-L3V3BYVS.cjs');
@@ -31,47 +31,47 @@ require('./chunk-ZU5Q77OT.cjs');
31
31
 
32
32
  Object.defineProperty(exports, "JsonEditor", {
33
33
  enumerable: true,
34
- get: function () { return chunk5XTNJBC5_cjs.JsonEditor; }
34
+ get: function () { return chunk7HN4M5MV_cjs.JsonEditor; }
35
35
  });
36
36
  Object.defineProperty(exports, "applyJsonEdit", {
37
37
  enumerable: true,
38
- get: function () { return chunk5XTNJBC5_cjs.applyJsonEdit; }
38
+ get: function () { return chunk7HN4M5MV_cjs.applyJsonEdit; }
39
39
  });
40
40
  Object.defineProperty(exports, "describeEdit", {
41
41
  enumerable: true,
42
- get: function () { return chunk5XTNJBC5_cjs.describeEdit; }
42
+ get: function () { return chunk7HN4M5MV_cjs.describeEdit; }
43
43
  });
44
44
  Object.defineProperty(exports, "findJsonConflicts", {
45
45
  enumerable: true,
46
- get: function () { return chunk5XTNJBC5_cjs.findJsonConflicts; }
46
+ get: function () { return chunk7HN4M5MV_cjs.findJsonConflicts; }
47
47
  });
48
48
  Object.defineProperty(exports, "getAtPath", {
49
49
  enumerable: true,
50
- get: function () { return chunk5XTNJBC5_cjs.getAtPath; }
50
+ get: function () { return chunk7HN4M5MV_cjs.getAtPath; }
51
51
  });
52
52
  Object.defineProperty(exports, "inferType", {
53
53
  enumerable: true,
54
- get: function () { return chunk5XTNJBC5_cjs.inferType; }
54
+ get: function () { return chunk7HN4M5MV_cjs.inferType; }
55
55
  });
56
56
  Object.defineProperty(exports, "parseKeyMap", {
57
57
  enumerable: true,
58
- get: function () { return chunk5XTNJBC5_cjs.parseKeyMap; }
58
+ get: function () { return chunk7HN4M5MV_cjs.parseKeyMap; }
59
59
  });
60
60
  Object.defineProperty(exports, "parsePath", {
61
61
  enumerable: true,
62
- get: function () { return chunk5XTNJBC5_cjs.parsePath; }
62
+ get: function () { return chunk7HN4M5MV_cjs.parsePath; }
63
63
  });
64
64
  Object.defineProperty(exports, "pathToString", {
65
65
  enumerable: true,
66
- get: function () { return chunk5XTNJBC5_cjs.pathToString; }
66
+ get: function () { return chunk7HN4M5MV_cjs.pathToString; }
67
67
  });
68
68
  Object.defineProperty(exports, "resolveKeyRule", {
69
69
  enumerable: true,
70
- get: function () { return chunk5XTNJBC5_cjs.resolveKeyRule; }
70
+ get: function () { return chunk7HN4M5MV_cjs.resolveKeyRule; }
71
71
  });
72
72
  Object.defineProperty(exports, "typeMatches", {
73
73
  enumerable: true,
74
- get: function () { return chunk5XTNJBC5_cjs.typeMatches; }
74
+ get: function () { return chunk7HN4M5MV_cjs.typeMatches; }
75
75
  });
76
76
  //# sourceMappingURL=json-editor.cjs.map
77
77
  //# sourceMappingURL=json-editor.cjs.map
@@ -1,4 +1,4 @@
1
- export { JsonEditor, applyJsonEdit, describeEdit, findJsonConflicts, getAtPath, inferType, parseKeyMap, parsePath, pathToString, resolveKeyRule, typeMatches } from './chunk-E2I4C5EA.js';
1
+ export { JsonEditor, applyJsonEdit, describeEdit, findJsonConflicts, getAtPath, inferType, parseKeyMap, parsePath, pathToString, resolveKeyRule, typeMatches } from './chunk-IUWUXCCB.js';
2
2
  import './chunk-QJKWBU3I.js';
3
3
  import './chunk-L2FPIFMN.js';
4
4
  import './chunk-JAAJJJKI.js';
@@ -15,7 +15,7 @@ import './chunk-VYQI4R6S.js';
15
15
  import './chunk-45BBNJQD.js';
16
16
  import './chunk-IVRYSSM7.js';
17
17
  import './chunk-XJXQG34J.js';
18
- import './chunk-HOP3XXPV.js';
18
+ import './chunk-4JGUPG22.js';
19
19
  import './chunk-MQ6VGG62.js';
20
20
  import './chunk-OL53XYHF.js';
21
21
  import './chunk-NRXK42LO.js';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@particle-academy/react-fancy",
3
- "version": "5.24.0",
3
+ "version": "5.26.0",
4
4
  "description": "React UI component library for Human+ UX — controlled, agent-bridgeable primitives",
5
5
  "repository": {
6
6
  "type": "git",
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/components/Callout/Callout.colors.ts","../src/components/Callout/Callout.tsx"],"names":["forwardRef","jsxs","cn","jsx","X"],"mappings":"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","file":"chunk-CJVNO5YM.cjs","sourcesContent":["// AUTO-GENERATED by scripts/gen-callout-colors — do not edit by hand.\n// Literal Tailwind class strings for every color in the v4 palette so the\n// scanner can detect them in the published dist (template-built names are\n// invisible to Tailwind's JIT). Regenerate after changing the palette.\nimport type { Color } from \"../../utils/types\";\n\nexport const calloutContainer: Record<Color, string> = {\n slate: \"border-slate-500 bg-slate-50 text-slate-900 dark:border-slate-400 dark:bg-slate-950/50 dark:text-slate-100\",\n gray: \"border-gray-500 bg-gray-50 text-gray-900 dark:border-gray-400 dark:bg-gray-950/50 dark:text-gray-100\",\n zinc: \"border-zinc-500 bg-zinc-50 text-zinc-900 dark:border-zinc-400 dark:bg-zinc-950/50 dark:text-zinc-100\",\n neutral: \"border-neutral-500 bg-neutral-50 text-neutral-900 dark:border-neutral-400 dark:bg-neutral-950/50 dark:text-neutral-100\",\n stone: \"border-stone-500 bg-stone-50 text-stone-900 dark:border-stone-400 dark:bg-stone-950/50 dark:text-stone-100\",\n red: \"border-red-500 bg-red-50 text-red-900 dark:border-red-400 dark:bg-red-950/50 dark:text-red-100\",\n orange: \"border-orange-500 bg-orange-50 text-orange-900 dark:border-orange-400 dark:bg-orange-950/50 dark:text-orange-100\",\n amber: \"border-amber-500 bg-amber-50 text-amber-900 dark:border-amber-400 dark:bg-amber-950/50 dark:text-amber-100\",\n yellow: \"border-yellow-500 bg-yellow-50 text-yellow-900 dark:border-yellow-400 dark:bg-yellow-950/50 dark:text-yellow-100\",\n lime: \"border-lime-500 bg-lime-50 text-lime-900 dark:border-lime-400 dark:bg-lime-950/50 dark:text-lime-100\",\n green: \"border-green-500 bg-green-50 text-green-900 dark:border-green-400 dark:bg-green-950/50 dark:text-green-100\",\n emerald: \"border-emerald-500 bg-emerald-50 text-emerald-900 dark:border-emerald-400 dark:bg-emerald-950/50 dark:text-emerald-100\",\n teal: \"border-teal-500 bg-teal-50 text-teal-900 dark:border-teal-400 dark:bg-teal-950/50 dark:text-teal-100\",\n cyan: \"border-cyan-500 bg-cyan-50 text-cyan-900 dark:border-cyan-400 dark:bg-cyan-950/50 dark:text-cyan-100\",\n sky: \"border-sky-500 bg-sky-50 text-sky-900 dark:border-sky-400 dark:bg-sky-950/50 dark:text-sky-100\",\n blue: \"border-blue-500 bg-blue-50 text-blue-900 dark:border-blue-400 dark:bg-blue-950/50 dark:text-blue-100\",\n indigo: \"border-indigo-500 bg-indigo-50 text-indigo-900 dark:border-indigo-400 dark:bg-indigo-950/50 dark:text-indigo-100\",\n violet: \"border-violet-500 bg-violet-50 text-violet-900 dark:border-violet-400 dark:bg-violet-950/50 dark:text-violet-100\",\n purple: \"border-purple-500 bg-purple-50 text-purple-900 dark:border-purple-400 dark:bg-purple-950/50 dark:text-purple-100\",\n fuchsia: \"border-fuchsia-500 bg-fuchsia-50 text-fuchsia-900 dark:border-fuchsia-400 dark:bg-fuchsia-950/50 dark:text-fuchsia-100\",\n pink: \"border-pink-500 bg-pink-50 text-pink-900 dark:border-pink-400 dark:bg-pink-950/50 dark:text-pink-100\",\n rose: \"border-rose-500 bg-rose-50 text-rose-900 dark:border-rose-400 dark:bg-rose-950/50 dark:text-rose-100\",\n};\n\nexport const calloutIcon: Record<Color, string> = {\n slate: \"text-slate-500 dark:text-slate-400\",\n gray: \"text-gray-500 dark:text-gray-400\",\n zinc: \"text-zinc-500 dark:text-zinc-400\",\n neutral: \"text-neutral-500 dark:text-neutral-400\",\n stone: \"text-stone-500 dark:text-stone-400\",\n red: \"text-red-500 dark:text-red-400\",\n orange: \"text-orange-500 dark:text-orange-400\",\n amber: \"text-amber-500 dark:text-amber-400\",\n yellow: \"text-yellow-500 dark:text-yellow-400\",\n lime: \"text-lime-500 dark:text-lime-400\",\n green: \"text-green-500 dark:text-green-400\",\n emerald: \"text-emerald-500 dark:text-emerald-400\",\n teal: \"text-teal-500 dark:text-teal-400\",\n cyan: \"text-cyan-500 dark:text-cyan-400\",\n sky: \"text-sky-500 dark:text-sky-400\",\n blue: \"text-blue-500 dark:text-blue-400\",\n indigo: \"text-indigo-500 dark:text-indigo-400\",\n violet: \"text-violet-500 dark:text-violet-400\",\n purple: \"text-purple-500 dark:text-purple-400\",\n fuchsia: \"text-fuchsia-500 dark:text-fuchsia-400\",\n pink: \"text-pink-500 dark:text-pink-400\",\n rose: \"text-rose-500 dark:text-rose-400\",\n};\n","import { forwardRef } from \"react\";\nimport { X } from \"lucide-react\";\nimport { cn } from \"../../utils/cn\";\nimport type { CalloutProps } from \"./Callout.types\";\nimport { calloutContainer, calloutIcon } from \"./Callout.colors\";\n\nexport const Callout = forwardRef<HTMLDivElement, CalloutProps>(\n (\n {\n children,\n color = \"blue\",\n icon,\n dismissible = false,\n onDismiss,\n className,\n },\n ref,\n ) => {\n return (\n <div\n ref={ref}\n role=\"alert\"\n data-react-fancy-callout=\"\"\n className={cn(\n \"flex items-start gap-3 rounded-lg border-l-4 p-4\",\n calloutContainer[color],\n className,\n )}\n >\n {icon && (\n <span className={cn(\"mt-0.5 shrink-0\", calloutIcon[color])}>\n {icon}\n </span>\n )}\n <div className=\"min-w-0 flex-1\">{children}</div>\n {dismissible && (\n <button\n type=\"button\"\n onClick={onDismiss}\n className={cn(\n \"shrink-0 rounded p-0.5 opacity-70 transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-current\",\n )}\n aria-label=\"Dismiss\"\n >\n <X size={16} />\n </button>\n )}\n </div>\n );\n },\n);\n\nCallout.displayName = \"Callout\";\n"]}
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/components/Callout/Callout.colors.ts","../src/components/Callout/Callout.tsx"],"names":[],"mappings":"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","file":"chunk-HOP3XXPV.js","sourcesContent":["// AUTO-GENERATED by scripts/gen-callout-colors — do not edit by hand.\n// Literal Tailwind class strings for every color in the v4 palette so the\n// scanner can detect them in the published dist (template-built names are\n// invisible to Tailwind's JIT). Regenerate after changing the palette.\nimport type { Color } from \"../../utils/types\";\n\nexport const calloutContainer: Record<Color, string> = {\n slate: \"border-slate-500 bg-slate-50 text-slate-900 dark:border-slate-400 dark:bg-slate-950/50 dark:text-slate-100\",\n gray: \"border-gray-500 bg-gray-50 text-gray-900 dark:border-gray-400 dark:bg-gray-950/50 dark:text-gray-100\",\n zinc: \"border-zinc-500 bg-zinc-50 text-zinc-900 dark:border-zinc-400 dark:bg-zinc-950/50 dark:text-zinc-100\",\n neutral: \"border-neutral-500 bg-neutral-50 text-neutral-900 dark:border-neutral-400 dark:bg-neutral-950/50 dark:text-neutral-100\",\n stone: \"border-stone-500 bg-stone-50 text-stone-900 dark:border-stone-400 dark:bg-stone-950/50 dark:text-stone-100\",\n red: \"border-red-500 bg-red-50 text-red-900 dark:border-red-400 dark:bg-red-950/50 dark:text-red-100\",\n orange: \"border-orange-500 bg-orange-50 text-orange-900 dark:border-orange-400 dark:bg-orange-950/50 dark:text-orange-100\",\n amber: \"border-amber-500 bg-amber-50 text-amber-900 dark:border-amber-400 dark:bg-amber-950/50 dark:text-amber-100\",\n yellow: \"border-yellow-500 bg-yellow-50 text-yellow-900 dark:border-yellow-400 dark:bg-yellow-950/50 dark:text-yellow-100\",\n lime: \"border-lime-500 bg-lime-50 text-lime-900 dark:border-lime-400 dark:bg-lime-950/50 dark:text-lime-100\",\n green: \"border-green-500 bg-green-50 text-green-900 dark:border-green-400 dark:bg-green-950/50 dark:text-green-100\",\n emerald: \"border-emerald-500 bg-emerald-50 text-emerald-900 dark:border-emerald-400 dark:bg-emerald-950/50 dark:text-emerald-100\",\n teal: \"border-teal-500 bg-teal-50 text-teal-900 dark:border-teal-400 dark:bg-teal-950/50 dark:text-teal-100\",\n cyan: \"border-cyan-500 bg-cyan-50 text-cyan-900 dark:border-cyan-400 dark:bg-cyan-950/50 dark:text-cyan-100\",\n sky: \"border-sky-500 bg-sky-50 text-sky-900 dark:border-sky-400 dark:bg-sky-950/50 dark:text-sky-100\",\n blue: \"border-blue-500 bg-blue-50 text-blue-900 dark:border-blue-400 dark:bg-blue-950/50 dark:text-blue-100\",\n indigo: \"border-indigo-500 bg-indigo-50 text-indigo-900 dark:border-indigo-400 dark:bg-indigo-950/50 dark:text-indigo-100\",\n violet: \"border-violet-500 bg-violet-50 text-violet-900 dark:border-violet-400 dark:bg-violet-950/50 dark:text-violet-100\",\n purple: \"border-purple-500 bg-purple-50 text-purple-900 dark:border-purple-400 dark:bg-purple-950/50 dark:text-purple-100\",\n fuchsia: \"border-fuchsia-500 bg-fuchsia-50 text-fuchsia-900 dark:border-fuchsia-400 dark:bg-fuchsia-950/50 dark:text-fuchsia-100\",\n pink: \"border-pink-500 bg-pink-50 text-pink-900 dark:border-pink-400 dark:bg-pink-950/50 dark:text-pink-100\",\n rose: \"border-rose-500 bg-rose-50 text-rose-900 dark:border-rose-400 dark:bg-rose-950/50 dark:text-rose-100\",\n};\n\nexport const calloutIcon: Record<Color, string> = {\n slate: \"text-slate-500 dark:text-slate-400\",\n gray: \"text-gray-500 dark:text-gray-400\",\n zinc: \"text-zinc-500 dark:text-zinc-400\",\n neutral: \"text-neutral-500 dark:text-neutral-400\",\n stone: \"text-stone-500 dark:text-stone-400\",\n red: \"text-red-500 dark:text-red-400\",\n orange: \"text-orange-500 dark:text-orange-400\",\n amber: \"text-amber-500 dark:text-amber-400\",\n yellow: \"text-yellow-500 dark:text-yellow-400\",\n lime: \"text-lime-500 dark:text-lime-400\",\n green: \"text-green-500 dark:text-green-400\",\n emerald: \"text-emerald-500 dark:text-emerald-400\",\n teal: \"text-teal-500 dark:text-teal-400\",\n cyan: \"text-cyan-500 dark:text-cyan-400\",\n sky: \"text-sky-500 dark:text-sky-400\",\n blue: \"text-blue-500 dark:text-blue-400\",\n indigo: \"text-indigo-500 dark:text-indigo-400\",\n violet: \"text-violet-500 dark:text-violet-400\",\n purple: \"text-purple-500 dark:text-purple-400\",\n fuchsia: \"text-fuchsia-500 dark:text-fuchsia-400\",\n pink: \"text-pink-500 dark:text-pink-400\",\n rose: \"text-rose-500 dark:text-rose-400\",\n};\n","import { forwardRef } from \"react\";\nimport { X } from \"lucide-react\";\nimport { cn } from \"../../utils/cn\";\nimport type { CalloutProps } from \"./Callout.types\";\nimport { calloutContainer, calloutIcon } from \"./Callout.colors\";\n\nexport const Callout = forwardRef<HTMLDivElement, CalloutProps>(\n (\n {\n children,\n color = \"blue\",\n icon,\n dismissible = false,\n onDismiss,\n className,\n },\n ref,\n ) => {\n return (\n <div\n ref={ref}\n role=\"alert\"\n data-react-fancy-callout=\"\"\n className={cn(\n \"flex items-start gap-3 rounded-lg border-l-4 p-4\",\n calloutContainer[color],\n className,\n )}\n >\n {icon && (\n <span className={cn(\"mt-0.5 shrink-0\", calloutIcon[color])}>\n {icon}\n </span>\n )}\n <div className=\"min-w-0 flex-1\">{children}</div>\n {dismissible && (\n <button\n type=\"button\"\n onClick={onDismiss}\n className={cn(\n \"shrink-0 rounded p-0.5 opacity-70 transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-current\",\n )}\n aria-label=\"Dismiss\"\n >\n <X size={16} />\n </button>\n )}\n </div>\n );\n },\n);\n\nCallout.displayName = \"Callout\";\n"]}