@particle-academy/react-fancy 5.24.0 → 5.25.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.
package/dist/card.cjs CHANGED
@@ -1,29 +1,29 @@
1
1
  'use strict';
2
2
 
3
- var chunk524TOKU3_cjs = require('./chunk-524TOKU3.cjs');
3
+ var chunk5DQ2XUJI_cjs = require('./chunk-5DQ2XUJI.cjs');
4
4
  require('./chunk-ZU5Q77OT.cjs');
5
5
 
6
6
 
7
7
 
8
8
  Object.defineProperty(exports, "Card", {
9
9
  enumerable: true,
10
- get: function () { return chunk524TOKU3_cjs.Card; }
10
+ get: function () { return chunk5DQ2XUJI_cjs.Card; }
11
11
  });
12
12
  Object.defineProperty(exports, "CardBody", {
13
13
  enumerable: true,
14
- get: function () { return chunk524TOKU3_cjs.CardBody; }
14
+ get: function () { return chunk5DQ2XUJI_cjs.CardBody; }
15
15
  });
16
16
  Object.defineProperty(exports, "CardFooter", {
17
17
  enumerable: true,
18
- get: function () { return chunk524TOKU3_cjs.CardFooter; }
18
+ get: function () { return chunk5DQ2XUJI_cjs.CardFooter; }
19
19
  });
20
20
  Object.defineProperty(exports, "CardHeader", {
21
21
  enumerable: true,
22
- get: function () { return chunk524TOKU3_cjs.CardHeader; }
22
+ get: function () { return chunk5DQ2XUJI_cjs.CardHeader; }
23
23
  });
24
24
  Object.defineProperty(exports, "CardMedia", {
25
25
  enumerable: true,
26
- get: function () { return chunk524TOKU3_cjs.CardMedia; }
26
+ get: function () { return chunk5DQ2XUJI_cjs.CardMedia; }
27
27
  });
28
28
  //# sourceMappingURL=card.cjs.map
29
29
  //# sourceMappingURL=card.cjs.map
package/dist/card.js CHANGED
@@ -1,4 +1,4 @@
1
- export { Card, CardBody, CardFooter, CardHeader, CardMedia } from './chunk-4K4ECIKK.js';
1
+ export { Card, CardBody, CardFooter, CardHeader, CardMedia } from './chunk-ZIDBI6JX.js';
2
2
  import './chunk-MMW2JGKZ.js';
3
3
  //# sourceMappingURL=card.js.map
4
4
  //# sourceMappingURL=card.js.map
@@ -80,8 +80,8 @@ var CardMedia = react.forwardRef(
80
80
  "data-react-fancy-card-media": "",
81
81
  className: chunkZU5Q77OT_cjs.cn(
82
82
  "relative overflow-hidden rounded-t-lg",
83
- // Card's `padding` prop pads EVERY direct div child
84
- // (`[&>div]:px-4 …`), which would inset the media and break the
83
+ // Card's `padding` prop pads EVERY direct child
84
+ // (`[&>*]:px-4 …`), which would inset the media and break the
85
85
  // flush-to-the-edge look every caller wants. `!` wins regardless of
86
86
  // stylesheet order, which plain `p-0` would not.
87
87
  "!px-0 !py-0",
@@ -122,9 +122,9 @@ var variantClasses = {
122
122
  };
123
123
  var paddingClasses = {
124
124
  none: "",
125
- sm: "[&>div]:px-3 [&>div]:py-2",
126
- md: "[&>div]:px-4 [&>div]:py-3",
127
- lg: "[&>div]:px-6 [&>div]:py-4"
125
+ sm: "[&>*]:px-3 [&>*]:py-2",
126
+ md: "[&>*]:px-4 [&>*]:py-3",
127
+ lg: "[&>*]:px-6 [&>*]:py-4"
128
128
  };
129
129
  var CardRoot = react.forwardRef(
130
130
  ({
@@ -169,5 +169,5 @@ exports.CardBody = CardBody;
169
169
  exports.CardFooter = CardFooter;
170
170
  exports.CardHeader = CardHeader;
171
171
  exports.CardMedia = CardMedia;
172
- //# sourceMappingURL=chunk-524TOKU3.cjs.map
173
- //# sourceMappingURL=chunk-524TOKU3.cjs.map
172
+ //# sourceMappingURL=chunk-5DQ2XUJI.cjs.map
173
+ //# sourceMappingURL=chunk-5DQ2XUJI.cjs.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","cn","jsxs"],"mappings":"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","file":"chunk-524TOKU3.cjs","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","cn","jsxs"],"mappings":"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","file":"chunk-5DQ2XUJI.cjs","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"]}
@@ -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
@@ -102,7 +102,7 @@ var chunkBFKCVSNK_cjs = require('./chunk-BFKCVSNK.cjs');
102
102
  var chunkQOGKO6JH_cjs = require('./chunk-QOGKO6JH.cjs');
103
103
  require('./chunk-3I2KWNXT.cjs');
104
104
  var chunkCJVNO5YM_cjs = require('./chunk-CJVNO5YM.cjs');
105
- var chunk524TOKU3_cjs = require('./chunk-524TOKU3.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');
@@ -722,7 +722,7 @@ Object.defineProperty(exports, "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
@@ -100,7 +100,7 @@ export { sanitizeHref, sanitizeHtml } from './chunk-XJXQG34J.js';
100
100
  export { Calendar } from './chunk-NTMHP7FS.js';
101
101
  import './chunk-NMXCQOHV.js';
102
102
  export { Callout } from './chunk-HOP3XXPV.js';
103
- export { Card } from './chunk-4K4ECIKK.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';
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.25.0",
4
4
  "description": "React UI component library for Human+ UX — controlled, agent-bridgeable primitives",
5
5
  "repository": {
6
6
  "type": "git",