@lindle/linoardo 1.0.28 → 1.0.30

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 (17) hide show
  1. package/dist/card.cjs +16 -3
  2. package/dist/card.cjs.map +1 -1
  3. package/dist/card.d.cts +7 -1
  4. package/dist/card.d.ts +7 -1
  5. package/dist/card.js +1 -1
  6. package/dist/chip.d.cts +3 -3
  7. package/dist/chip.d.ts +3 -3
  8. package/dist/{chunk-2UL3S6KC.js → chunk-GSYVZCP3.js} +18 -5
  9. package/dist/chunk-GSYVZCP3.js.map +1 -0
  10. package/dist/index.cjs +16 -3
  11. package/dist/index.cjs.map +1 -1
  12. package/dist/index.d.cts +1 -1
  13. package/dist/index.d.ts +1 -1
  14. package/dist/index.js +1 -1
  15. package/dist/styles.css +12 -0
  16. package/package.json +1 -1
  17. package/dist/chunk-2UL3S6KC.js.map +0 -1
package/dist/card.cjs CHANGED
@@ -11,7 +11,11 @@ var paddingClasses = {
11
11
  md: "p-4",
12
12
  lg: "p-6"
13
13
  };
14
- var cardBase = "card-base relative w-full overflow-hidden bg-white text-gray-900 transition-colors dark:bg-slate-900 dark:text-slate-100";
14
+ var overflowClasses = {
15
+ hidden: "overflow-hidden",
16
+ visible: "overflow-visible"
17
+ };
18
+ var cardBase = "card-base relative w-full bg-white text-gray-900 transition-colors dark:bg-slate-900 dark:text-slate-100";
15
19
  var variantClasses = {
16
20
  solid: "rounded-2xl border border-gray-200 bg-white shadow-lg shadow-gray-200/55 dark:border-slate-800 dark:bg-slate-900 dark:shadow-black/30",
17
21
  outline: "rounded-2xl border-2 border-black bg-white shadow-none dark:border-black dark:bg-slate-900",
@@ -27,13 +31,15 @@ var CardRoot = react.forwardRef(function Card({
27
31
  children,
28
32
  variant = "solid",
29
33
  padding = "md",
34
+ overflow = "hidden",
30
35
  interactive = false,
31
36
  dividers = true,
32
37
  ...rest
33
38
  }, ref) {
34
39
  const variantClass = variantClasses[variant] ?? variantClasses.solid;
35
40
  const paddingClass = paddingClasses[padding] ?? paddingClasses.md;
36
- const interactiveClass = interactive ? "transition-all duration-200 hover:-translate-y-0.5 hover:shadow-xl focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/40 focus-visible:ring-offset-2 focus-visible:ring-offset-white dark:focus-visible:ring-offset-slate-900" : void 0;
41
+ const overflowClass = overflowClasses[overflow] ?? overflowClasses.hidden;
42
+ const interactiveClass = interactive ? "transition-all duration-200 hover:-translate-y-0.5 hover:shadow-xl hover:z-10 focus-within:z-10 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/40 focus-visible:ring-offset-2 focus-visible:ring-offset-white dark:focus-visible:ring-offset-slate-900" : void 0;
37
43
  const tabIndexValue = interactive && rest.tabIndex === void 0 ? 0 : rest.tabIndex;
38
44
  const content = applyDividers(children, dividers);
39
45
  return /* @__PURE__ */ jsxRuntime.jsx(
@@ -42,7 +48,14 @@ var CardRoot = react.forwardRef(function Card({
42
48
  ...rest,
43
49
  ref,
44
50
  tabIndex: tabIndexValue,
45
- className: tailwindMerge.twMerge(cardBase, variantClass, paddingClass, interactiveClass, className),
51
+ className: tailwindMerge.twMerge(
52
+ cardBase,
53
+ variantClass,
54
+ paddingClass,
55
+ overflowClass,
56
+ interactiveClass,
57
+ className
58
+ ),
46
59
  children: content
47
60
  }
48
61
  );
package/dist/card.cjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/Blocks/Card/index.tsx"],"names":["forwardRef","jsx","twMerge","Card","Children","isValidElement","cloneElement"],"mappings":"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","file":"card.cjs","sourcesContent":["import { Children, cloneElement, forwardRef, isValidElement } from 'react';\nimport type { ReactElement, ReactNode } from 'react';\nimport type { GlobalVariant } from '@lindle/linoardo/global.types';\nimport { twMerge } from 'tailwind-merge';\nimport type { CardMediaProps, CardProps, CardSectionProps, CardTextProps } from './types.card';\n\nconst paddingClasses: Record<Exclude<CardProps['padding'], undefined>, string> = {\n none: 'p-0',\n sm: 'p-3',\n md: 'p-4',\n lg: 'p-6'\n};\n\nconst cardBase =\n 'card-base relative w-full overflow-hidden bg-white text-gray-900 transition-colors dark:bg-slate-900 dark:text-slate-100';\n\nconst variantClasses: Record<GlobalVariant, string> = {\n solid:\n 'rounded-2xl border border-gray-200 bg-white shadow-lg shadow-gray-200/55 dark:border-slate-800 dark:bg-slate-900 dark:shadow-black/30',\n outline:\n 'rounded-2xl border-2 border-black bg-white shadow-none dark:border-black dark:bg-slate-900',\n text: 'rounded-2xl border border-transparent bg-transparent shadow-none dark:border-transparent dark:bg-transparent',\n ghost:\n 'rounded-2xl border border-transparent bg-gray-50 shadow-none dark:border-transparent dark:bg-slate-800',\n filled:\n 'rounded-2xl border border-gray-200 bg-gray-50 shadow-sm dark:border-slate-800 dark:bg-slate-800 dark:shadow-black/20',\n underlined:\n 'rounded-2xl border border-transparent border-b border-b-gray-200 shadow-none dark:border-transparent dark:border-b-slate-700 dark:bg-transparent',\n rounded:\n 'rounded-3xl border border-gray-200 bg-white shadow-md dark:border-slate-800 dark:bg-slate-900 dark:shadow-black/25',\n sharp:\n 'rounded-none border border-gray-200 bg-white shadow-md dark:border-slate-800 dark:bg-slate-900 dark:shadow-black/25'\n};\n\n/**\n * Card container with optional padding, variants and interactive focus/hover styles.\n */\nconst CardRoot = forwardRef<HTMLDivElement, CardProps>(function Card(\n {\n className,\n children,\n variant = 'solid',\n padding = 'md',\n interactive = false,\n dividers = true,\n ...rest\n },\n ref\n) {\n const variantClass = variantClasses[variant as GlobalVariant] ?? variantClasses.solid;\n const paddingClass = paddingClasses[padding] ?? paddingClasses.md;\n const interactiveClass = interactive\n ? 'transition-all duration-200 hover:-translate-y-0.5 hover:shadow-xl focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/40 focus-visible:ring-offset-2 focus-visible:ring-offset-white dark:focus-visible:ring-offset-slate-900'\n : undefined;\n const tabIndexValue = interactive && rest.tabIndex === undefined ? 0 : rest.tabIndex;\n const content = applyDividers(children, dividers);\n\n return (\n <div\n {...rest}\n ref={ref}\n tabIndex={tabIndexValue}\n className={twMerge(cardBase, variantClass, paddingClass, interactiveClass, className)}\n >\n {content}\n </div>\n );\n});\n\n/**\n * Section for placing the card title, subtitle or actions at the top of the card.\n */\nconst CardHeader: React.FC<CardSectionProps> = ({ className, dividers = true, ...rest }) => (\n <div\n {...rest}\n className={twMerge(\n 'card-header mb-2 flex flex-col gap-1 pb-3',\n dividers ? 'border-b border-gray-100 dark:border-slate-800' : undefined,\n className\n )}\n />\n);\n\n/**\n * Primary content area of the card.\n */\nconst CardBody: React.FC<CardSectionProps> = ({ className, ...rest }) => (\n <div {...rest} className={twMerge('card-body flex flex-col gap-3', className)} />\n);\n\n/**\n * Footer area for actions or supplemental information.\n */\nconst CardFooter: React.FC<CardSectionProps> = ({ className, dividers = true, ...rest }) => (\n <div\n {...rest}\n className={twMerge(\n 'card-footer mt-3 flex flex-wrap items-center gap-3 pt-3',\n dividers ? 'border-t border-gray-100 dark:border-slate-800' : undefined,\n className\n )}\n />\n);\n\n/**\n * Stylized heading for the card.\n */\nconst CardTitle: React.FC<CardSectionProps> = ({ className, ...rest }) => (\n <h3\n {...rest}\n className={twMerge(\n 'card-title text-lg font-semibold text-gray-900 dark:text-slate-50',\n className\n )}\n />\n);\n\n/**\n * Subtitle text for secondary information under the title.\n */\nconst CardSubtitle: React.FC<CardSectionProps> = ({ className, ...rest }) => (\n <p\n {...rest}\n className={twMerge(\n 'card-subtitle text-sm font-medium text-gray-600 dark:text-slate-300',\n className\n )}\n />\n);\n\n/**\n * Body text with default card typography.\n */\nconst CardText: React.FC<CardTextProps> = ({ className, ...rest }) => (\n <p\n {...rest}\n className={twMerge('card-text text-sm text-gray-700 dark:text-slate-200', className)}\n />\n);\n\n/**\n * Media region for images, retaining card spacing and optional rounded corners.\n */\nconst CardMedia: React.FC<CardMediaProps> = ({ className, rounded = false, ...rest }) => (\n <img\n {...rest}\n className={twMerge(\n 'card-media w-full object-cover',\n rounded ? 'rounded-xl' : 'rounded-none',\n rest.height || rest.style ? 'block' : 'block max-h-60',\n className\n )}\n loading={rest.loading ?? 'lazy'}\n />\n);\n\n/**\n * Container for action buttons inside the card.\n */\nconst CardActions: React.FC<CardSectionProps> = ({ className, ...rest }) => (\n <div {...rest} className={twMerge('card-actions flex flex-wrap gap-2', className)} />\n);\n\nexport type { CardProps, CardSectionProps, CardMediaProps, CardTextProps };\n\nconst Card = Object.assign(CardRoot, {\n Header: CardHeader,\n Body: CardBody,\n Footer: CardFooter,\n Title: CardTitle,\n Subtitle: CardSubtitle,\n Text: CardText,\n Media: CardMedia,\n Actions: CardActions\n});\n\nexport default Card;\n\nfunction applyDividers(children: ReactNode, dividers: boolean): ReactNode {\n return Children.map(children, child => {\n if (!isValidElement(child)) return child;\n\n if (isDividerSection(child)) {\n return cloneElement<CardSectionProps>(child, { dividers: child.props.dividers ?? dividers });\n }\n\n if (hasNestedChildren(child)) {\n return cloneElement<{ children?: ReactNode }>(child, {\n children: applyDividers(child.props.children, dividers)\n });\n }\n\n return child;\n });\n}\n\nfunction isDividerSection(element: ReactElement): element is ReactElement<CardSectionProps> {\n return element.type === CardHeader || element.type === CardFooter;\n}\n\nfunction hasNestedChildren(\n element: ReactElement\n): element is ReactElement<{ children?: ReactNode }> {\n const props = element.props as Record<string, unknown>;\n return 'children' in props;\n}\n"]}
1
+ {"version":3,"sources":["../src/Blocks/Card/index.tsx"],"names":["forwardRef","jsx","twMerge","Card","Children","isValidElement","cloneElement"],"mappings":"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","file":"card.cjs","sourcesContent":["import { Children, cloneElement, forwardRef, isValidElement } from 'react';\nimport type { ReactElement, ReactNode } from 'react';\nimport type { GlobalVariant } from '@lindle/linoardo/global.types';\nimport { twMerge } from 'tailwind-merge';\nimport type {\n CardMediaProps,\n CardOverflow,\n CardProps,\n CardSectionProps,\n CardTextProps\n} from './types.card';\n\nconst paddingClasses: Record<Exclude<CardProps['padding'], undefined>, string> = {\n none: 'p-0',\n sm: 'p-3',\n md: 'p-4',\n lg: 'p-6'\n};\n\nconst overflowClasses: Record<Exclude<CardProps['overflow'], undefined>, string> = {\n hidden: 'overflow-hidden',\n visible: 'overflow-visible'\n};\n\nconst cardBase =\n 'card-base relative w-full bg-white text-gray-900 transition-colors dark:bg-slate-900 dark:text-slate-100';\n\nconst variantClasses: Record<GlobalVariant, string> = {\n solid:\n 'rounded-2xl border border-gray-200 bg-white shadow-lg shadow-gray-200/55 dark:border-slate-800 dark:bg-slate-900 dark:shadow-black/30',\n outline:\n 'rounded-2xl border-2 border-black bg-white shadow-none dark:border-black dark:bg-slate-900',\n text: 'rounded-2xl border border-transparent bg-transparent shadow-none dark:border-transparent dark:bg-transparent',\n ghost:\n 'rounded-2xl border border-transparent bg-gray-50 shadow-none dark:border-transparent dark:bg-slate-800',\n filled:\n 'rounded-2xl border border-gray-200 bg-gray-50 shadow-sm dark:border-slate-800 dark:bg-slate-800 dark:shadow-black/20',\n underlined:\n 'rounded-2xl border border-transparent border-b border-b-gray-200 shadow-none dark:border-transparent dark:border-b-slate-700 dark:bg-transparent',\n rounded:\n 'rounded-3xl border border-gray-200 bg-white shadow-md dark:border-slate-800 dark:bg-slate-900 dark:shadow-black/25',\n sharp:\n 'rounded-none border border-gray-200 bg-white shadow-md dark:border-slate-800 dark:bg-slate-900 dark:shadow-black/25'\n};\n\n/**\n * Card container with optional padding, variants and interactive focus/hover styles.\n */\nconst CardRoot = forwardRef<HTMLDivElement, CardProps>(function Card(\n {\n className,\n children,\n variant = 'solid',\n padding = 'md',\n overflow = 'hidden',\n interactive = false,\n dividers = true,\n ...rest\n },\n ref\n) {\n const variantClass = variantClasses[variant as GlobalVariant] ?? variantClasses.solid;\n const paddingClass = paddingClasses[padding] ?? paddingClasses.md;\n const overflowClass = overflowClasses[overflow] ?? overflowClasses.hidden;\n const interactiveClass = interactive\n ? 'transition-all duration-200 hover:-translate-y-0.5 hover:shadow-xl hover:z-10 focus-within:z-10 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/40 focus-visible:ring-offset-2 focus-visible:ring-offset-white dark:focus-visible:ring-offset-slate-900'\n : undefined;\n const tabIndexValue = interactive && rest.tabIndex === undefined ? 0 : rest.tabIndex;\n const content = applyDividers(children, dividers);\n\n return (\n <div\n {...rest}\n ref={ref}\n tabIndex={tabIndexValue}\n className={twMerge(\n cardBase,\n variantClass,\n paddingClass,\n overflowClass,\n interactiveClass,\n className\n )}\n >\n {content}\n </div>\n );\n});\n\n/**\n * Section for placing the card title, subtitle or actions at the top of the card.\n */\nconst CardHeader: React.FC<CardSectionProps> = ({ className, dividers = true, ...rest }) => (\n <div\n {...rest}\n className={twMerge(\n 'card-header mb-2 flex flex-col gap-1 pb-3',\n dividers ? 'border-b border-gray-100 dark:border-slate-800' : undefined,\n className\n )}\n />\n);\n\n/**\n * Primary content area of the card.\n */\nconst CardBody: React.FC<CardSectionProps> = ({ className, ...rest }) => (\n <div {...rest} className={twMerge('card-body flex flex-col gap-3', className)} />\n);\n\n/**\n * Footer area for actions or supplemental information.\n */\nconst CardFooter: React.FC<CardSectionProps> = ({ className, dividers = true, ...rest }) => (\n <div\n {...rest}\n className={twMerge(\n 'card-footer mt-3 flex flex-wrap items-center gap-3 pt-3',\n dividers ? 'border-t border-gray-100 dark:border-slate-800' : undefined,\n className\n )}\n />\n);\n\n/**\n * Stylized heading for the card.\n */\nconst CardTitle: React.FC<CardSectionProps> = ({ className, ...rest }) => (\n <h3\n {...rest}\n className={twMerge(\n 'card-title text-lg font-semibold text-gray-900 dark:text-slate-50',\n className\n )}\n />\n);\n\n/**\n * Subtitle text for secondary information under the title.\n */\nconst CardSubtitle: React.FC<CardSectionProps> = ({ className, ...rest }) => (\n <p\n {...rest}\n className={twMerge(\n 'card-subtitle text-sm font-medium text-gray-600 dark:text-slate-300',\n className\n )}\n />\n);\n\n/**\n * Body text with default card typography.\n */\nconst CardText: React.FC<CardTextProps> = ({ className, ...rest }) => (\n <p\n {...rest}\n className={twMerge('card-text text-sm text-gray-700 dark:text-slate-200', className)}\n />\n);\n\n/**\n * Media region for images, retaining card spacing and optional rounded corners.\n */\nconst CardMedia: React.FC<CardMediaProps> = ({ className, rounded = false, ...rest }) => (\n <img\n {...rest}\n className={twMerge(\n 'card-media w-full object-cover',\n rounded ? 'rounded-xl' : 'rounded-none',\n rest.height || rest.style ? 'block' : 'block max-h-60',\n className\n )}\n loading={rest.loading ?? 'lazy'}\n />\n);\n\n/**\n * Container for action buttons inside the card.\n */\nconst CardActions: React.FC<CardSectionProps> = ({ className, ...rest }) => (\n <div {...rest} className={twMerge('card-actions flex flex-wrap gap-2', className)} />\n);\n\nexport type { CardOverflow, CardProps, CardSectionProps, CardMediaProps, CardTextProps };\n\nconst Card = Object.assign(CardRoot, {\n Header: CardHeader,\n Body: CardBody,\n Footer: CardFooter,\n Title: CardTitle,\n Subtitle: CardSubtitle,\n Text: CardText,\n Media: CardMedia,\n Actions: CardActions\n});\n\nexport default Card;\n\nfunction applyDividers(children: ReactNode, dividers: boolean): ReactNode {\n return Children.map(children, child => {\n if (!isValidElement(child)) return child;\n\n if (isDividerSection(child)) {\n return cloneElement<CardSectionProps>(child, { dividers: child.props.dividers ?? dividers });\n }\n\n if (hasNestedChildren(child)) {\n return cloneElement<{ children?: ReactNode }>(child, {\n children: applyDividers(child.props.children, dividers)\n });\n }\n\n return child;\n });\n}\n\nfunction isDividerSection(element: ReactElement): element is ReactElement<CardSectionProps> {\n return element.type === CardHeader || element.type === CardFooter;\n}\n\nfunction hasNestedChildren(\n element: ReactElement\n): element is ReactElement<{ children?: ReactNode }> {\n const props = element.props as Record<string, unknown>;\n return 'children' in props;\n}\n"]}
package/dist/card.d.cts CHANGED
@@ -2,9 +2,14 @@ import { G as GlobalVariant } from './global.types-E2uVLemv.cjs';
2
2
  import * as react from 'react';
3
3
 
4
4
  type CardPadding = 'none' | 'sm' | 'md' | 'lg';
5
+ type CardOverflow = 'hidden' | 'visible';
5
6
  type CardProps = React.HTMLAttributes<HTMLDivElement> & {
6
7
  variant?: GlobalVariant;
7
8
  padding?: CardPadding;
9
+ /**
10
+ * Controls whether children can overflow the card (useful for menus/popovers).
11
+ */
12
+ overflow?: CardOverflow;
8
13
  /**
9
14
  * Adds a subtle hover + focus ring. Works well for clickable cards.
10
15
  */
@@ -25,6 +30,7 @@ type CardMediaProps = React.ImgHTMLAttributes<HTMLImageElement> & {
25
30
  declare const Card: react.ForwardRefExoticComponent<react.HTMLAttributes<HTMLDivElement> & {
26
31
  variant?: GlobalVariant;
27
32
  padding?: CardPadding;
33
+ overflow?: CardOverflow;
28
34
  interactive?: boolean;
29
35
  dividers?: boolean;
30
36
  } & react.RefAttributes<HTMLDivElement>> & {
@@ -38,4 +44,4 @@ declare const Card: react.ForwardRefExoticComponent<react.HTMLAttributes<HTMLDiv
38
44
  Actions: react.FC<CardSectionProps>;
39
45
  };
40
46
 
41
- export { type CardMediaProps, type CardProps, type CardSectionProps, type CardTextProps, Card as default };
47
+ export { type CardMediaProps, type CardOverflow, type CardProps, type CardSectionProps, type CardTextProps, Card as default };
package/dist/card.d.ts CHANGED
@@ -2,9 +2,14 @@ import { G as GlobalVariant } from './global.types-E2uVLemv.js';
2
2
  import * as react from 'react';
3
3
 
4
4
  type CardPadding = 'none' | 'sm' | 'md' | 'lg';
5
+ type CardOverflow = 'hidden' | 'visible';
5
6
  type CardProps = React.HTMLAttributes<HTMLDivElement> & {
6
7
  variant?: GlobalVariant;
7
8
  padding?: CardPadding;
9
+ /**
10
+ * Controls whether children can overflow the card (useful for menus/popovers).
11
+ */
12
+ overflow?: CardOverflow;
8
13
  /**
9
14
  * Adds a subtle hover + focus ring. Works well for clickable cards.
10
15
  */
@@ -25,6 +30,7 @@ type CardMediaProps = React.ImgHTMLAttributes<HTMLImageElement> & {
25
30
  declare const Card: react.ForwardRefExoticComponent<react.HTMLAttributes<HTMLDivElement> & {
26
31
  variant?: GlobalVariant;
27
32
  padding?: CardPadding;
33
+ overflow?: CardOverflow;
28
34
  interactive?: boolean;
29
35
  dividers?: boolean;
30
36
  } & react.RefAttributes<HTMLDivElement>> & {
@@ -38,4 +44,4 @@ declare const Card: react.ForwardRefExoticComponent<react.HTMLAttributes<HTMLDiv
38
44
  Actions: react.FC<CardSectionProps>;
39
45
  };
40
46
 
41
- export { type CardMediaProps, type CardProps, type CardSectionProps, type CardTextProps, Card as default };
47
+ export { type CardMediaProps, type CardOverflow, type CardProps, type CardSectionProps, type CardTextProps, Card as default };
package/dist/card.js CHANGED
@@ -1,3 +1,3 @@
1
- export { Card_default as default } from './chunk-2UL3S6KC.js';
1
+ export { Card_default as default } from './chunk-GSYVZCP3.js';
2
2
  //# sourceMappingURL=card.js.map
3
3
  //# sourceMappingURL=card.js.map
package/dist/chip.d.cts CHANGED
@@ -76,6 +76,9 @@ declare const Chip: react.ForwardRefExoticComponent<{
76
76
  slot?: string | undefined | undefined;
77
77
  style?: react.CSSProperties | undefined;
78
78
  title?: string | undefined | undefined;
79
+ className?: string | undefined | undefined;
80
+ children?: react.ReactNode;
81
+ onClick?: react.MouseEventHandler<HTMLSpanElement> | undefined;
79
82
  defaultChecked?: boolean | undefined | undefined;
80
83
  defaultValue?: string | number | readonly string[] | undefined;
81
84
  suppressContentEditableWarning?: boolean | undefined | undefined;
@@ -83,7 +86,6 @@ declare const Chip: react.ForwardRefExoticComponent<{
83
86
  accessKey?: string | undefined | undefined;
84
87
  autoCapitalize?: "off" | "none" | "on" | "sentences" | "words" | "characters" | undefined | (string & {}) | undefined;
85
88
  autoFocus?: boolean | undefined | undefined;
86
- className?: string | undefined | undefined;
87
89
  contentEditable?: "inherit" | (boolean | "true" | "false") | "plaintext-only" | undefined;
88
90
  contextMenu?: string | undefined | undefined;
89
91
  dir?: string | undefined | undefined;
@@ -180,7 +182,6 @@ declare const Chip: react.ForwardRefExoticComponent<{
180
182
  "aria-valuemin"?: number | undefined | undefined;
181
183
  "aria-valuenow"?: number | undefined | undefined;
182
184
  "aria-valuetext"?: string | undefined | undefined;
183
- children?: react.ReactNode;
184
185
  dangerouslySetInnerHTML?: {
185
186
  __html: string | TrustedHTML;
186
187
  } | undefined | undefined;
@@ -268,7 +269,6 @@ declare const Chip: react.ForwardRefExoticComponent<{
268
269
  onWaitingCapture?: react.ReactEventHandler<HTMLSpanElement> | undefined;
269
270
  onAuxClick?: react.MouseEventHandler<HTMLSpanElement> | undefined;
270
271
  onAuxClickCapture?: react.MouseEventHandler<HTMLSpanElement> | undefined;
271
- onClick?: react.MouseEventHandler<HTMLSpanElement> | undefined;
272
272
  onClickCapture?: react.MouseEventHandler<HTMLSpanElement> | undefined;
273
273
  onContextMenu?: react.MouseEventHandler<HTMLSpanElement> | undefined;
274
274
  onContextMenuCapture?: react.MouseEventHandler<HTMLSpanElement> | undefined;
package/dist/chip.d.ts CHANGED
@@ -76,6 +76,9 @@ declare const Chip: react.ForwardRefExoticComponent<{
76
76
  slot?: string | undefined | undefined;
77
77
  style?: react.CSSProperties | undefined;
78
78
  title?: string | undefined | undefined;
79
+ className?: string | undefined | undefined;
80
+ children?: react.ReactNode;
81
+ onClick?: react.MouseEventHandler<HTMLSpanElement> | undefined;
79
82
  defaultChecked?: boolean | undefined | undefined;
80
83
  defaultValue?: string | number | readonly string[] | undefined;
81
84
  suppressContentEditableWarning?: boolean | undefined | undefined;
@@ -83,7 +86,6 @@ declare const Chip: react.ForwardRefExoticComponent<{
83
86
  accessKey?: string | undefined | undefined;
84
87
  autoCapitalize?: "off" | "none" | "on" | "sentences" | "words" | "characters" | undefined | (string & {}) | undefined;
85
88
  autoFocus?: boolean | undefined | undefined;
86
- className?: string | undefined | undefined;
87
89
  contentEditable?: "inherit" | (boolean | "true" | "false") | "plaintext-only" | undefined;
88
90
  contextMenu?: string | undefined | undefined;
89
91
  dir?: string | undefined | undefined;
@@ -180,7 +182,6 @@ declare const Chip: react.ForwardRefExoticComponent<{
180
182
  "aria-valuemin"?: number | undefined | undefined;
181
183
  "aria-valuenow"?: number | undefined | undefined;
182
184
  "aria-valuetext"?: string | undefined | undefined;
183
- children?: react.ReactNode;
184
185
  dangerouslySetInnerHTML?: {
185
186
  __html: string | TrustedHTML;
186
187
  } | undefined | undefined;
@@ -268,7 +269,6 @@ declare const Chip: react.ForwardRefExoticComponent<{
268
269
  onWaitingCapture?: react.ReactEventHandler<HTMLSpanElement> | undefined;
269
270
  onAuxClick?: react.MouseEventHandler<HTMLSpanElement> | undefined;
270
271
  onAuxClickCapture?: react.MouseEventHandler<HTMLSpanElement> | undefined;
271
- onClick?: react.MouseEventHandler<HTMLSpanElement> | undefined;
272
272
  onClickCapture?: react.MouseEventHandler<HTMLSpanElement> | undefined;
273
273
  onContextMenu?: react.MouseEventHandler<HTMLSpanElement> | undefined;
274
274
  onContextMenuCapture?: react.MouseEventHandler<HTMLSpanElement> | undefined;
package/dist/{chunk-2UL3S6KC.js → chunk-GSYVZCP3.js} RENAMED
@@ -9,7 +9,11 @@ var paddingClasses = {
9
9
  md: "p-4",
10
10
  lg: "p-6"
11
11
  };
12
- var cardBase = "card-base relative w-full overflow-hidden bg-white text-gray-900 transition-colors dark:bg-slate-900 dark:text-slate-100";
12
+ var overflowClasses = {
13
+ hidden: "overflow-hidden",
14
+ visible: "overflow-visible"
15
+ };
16
+ var cardBase = "card-base relative w-full bg-white text-gray-900 transition-colors dark:bg-slate-900 dark:text-slate-100";
13
17
  var variantClasses = {
14
18
  solid: "rounded-2xl border border-gray-200 bg-white shadow-lg shadow-gray-200/55 dark:border-slate-800 dark:bg-slate-900 dark:shadow-black/30",
15
19
  outline: "rounded-2xl border-2 border-black bg-white shadow-none dark:border-black dark:bg-slate-900",
@@ -25,13 +29,15 @@ var CardRoot = forwardRef(function Card({
25
29
  children,
26
30
  variant = "solid",
27
31
  padding = "md",
32
+ overflow = "hidden",
28
33
  interactive = false,
29
34
  dividers = true,
30
35
  ...rest
31
36
  }, ref) {
32
37
  const variantClass = variantClasses[variant] ?? variantClasses.solid;
33
38
  const paddingClass = paddingClasses[padding] ?? paddingClasses.md;
34
- const interactiveClass = interactive ? "transition-all duration-200 hover:-translate-y-0.5 hover:shadow-xl focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/40 focus-visible:ring-offset-2 focus-visible:ring-offset-white dark:focus-visible:ring-offset-slate-900" : void 0;
39
+ const overflowClass = overflowClasses[overflow] ?? overflowClasses.hidden;
40
+ const interactiveClass = interactive ? "transition-all duration-200 hover:-translate-y-0.5 hover:shadow-xl hover:z-10 focus-within:z-10 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/40 focus-visible:ring-offset-2 focus-visible:ring-offset-white dark:focus-visible:ring-offset-slate-900" : void 0;
35
41
  const tabIndexValue = interactive && rest.tabIndex === void 0 ? 0 : rest.tabIndex;
36
42
  const content = applyDividers(children, dividers);
37
43
  return /* @__PURE__ */ jsx(
@@ -40,7 +46,14 @@ var CardRoot = forwardRef(function Card({
40
46
  ...rest,
41
47
  ref,
42
48
  tabIndex: tabIndexValue,
43
- className: twMerge(cardBase, variantClass, paddingClass, interactiveClass, className),
49
+ className: twMerge(
50
+ cardBase,
51
+ variantClass,
52
+ paddingClass,
53
+ overflowClass,
54
+ interactiveClass,
55
+ className
56
+ ),
44
57
  children: content
45
58
  }
46
59
  );
@@ -143,5 +156,5 @@ function hasNestedChildren(element) {
143
156
  }
144
157
 
145
158
  export { Card_default };
146
- //# sourceMappingURL=chunk-2UL3S6KC.js.map
147
- //# sourceMappingURL=chunk-2UL3S6KC.js.map
159
+ //# sourceMappingURL=chunk-GSYVZCP3.js.map
160
+ //# sourceMappingURL=chunk-GSYVZCP3.js.map
package/dist/chunk-GSYVZCP3.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/Blocks/Card/index.tsx"],"names":["Card"],"mappings":"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","file":"chunk-GSYVZCP3.js","sourcesContent":["import { Children, cloneElement, forwardRef, isValidElement } from 'react';\nimport type { ReactElement, ReactNode } from 'react';\nimport type { GlobalVariant } from '@lindle/linoardo/global.types';\nimport { twMerge } from 'tailwind-merge';\nimport type {\n CardMediaProps,\n CardOverflow,\n CardProps,\n CardSectionProps,\n CardTextProps\n} from './types.card';\n\nconst paddingClasses: Record<Exclude<CardProps['padding'], undefined>, string> = {\n none: 'p-0',\n sm: 'p-3',\n md: 'p-4',\n lg: 'p-6'\n};\n\nconst overflowClasses: Record<Exclude<CardProps['overflow'], undefined>, string> = {\n hidden: 'overflow-hidden',\n visible: 'overflow-visible'\n};\n\nconst cardBase =\n 'card-base relative w-full bg-white text-gray-900 transition-colors dark:bg-slate-900 dark:text-slate-100';\n\nconst variantClasses: Record<GlobalVariant, string> = {\n solid:\n 'rounded-2xl border border-gray-200 bg-white shadow-lg shadow-gray-200/55 dark:border-slate-800 dark:bg-slate-900 dark:shadow-black/30',\n outline:\n 'rounded-2xl border-2 border-black bg-white shadow-none dark:border-black dark:bg-slate-900',\n text: 'rounded-2xl border border-transparent bg-transparent shadow-none dark:border-transparent dark:bg-transparent',\n ghost:\n 'rounded-2xl border border-transparent bg-gray-50 shadow-none dark:border-transparent dark:bg-slate-800',\n filled:\n 'rounded-2xl border border-gray-200 bg-gray-50 shadow-sm dark:border-slate-800 dark:bg-slate-800 dark:shadow-black/20',\n underlined:\n 'rounded-2xl border border-transparent border-b border-b-gray-200 shadow-none dark:border-transparent dark:border-b-slate-700 dark:bg-transparent',\n rounded:\n 'rounded-3xl border border-gray-200 bg-white shadow-md dark:border-slate-800 dark:bg-slate-900 dark:shadow-black/25',\n sharp:\n 'rounded-none border border-gray-200 bg-white shadow-md dark:border-slate-800 dark:bg-slate-900 dark:shadow-black/25'\n};\n\n/**\n * Card container with optional padding, variants and interactive focus/hover styles.\n */\nconst CardRoot = forwardRef<HTMLDivElement, CardProps>(function Card(\n {\n className,\n children,\n variant = 'solid',\n padding = 'md',\n overflow = 'hidden',\n interactive = false,\n dividers = true,\n ...rest\n },\n ref\n) {\n const variantClass = variantClasses[variant as GlobalVariant] ?? variantClasses.solid;\n const paddingClass = paddingClasses[padding] ?? paddingClasses.md;\n const overflowClass = overflowClasses[overflow] ?? overflowClasses.hidden;\n const interactiveClass = interactive\n ? 'transition-all duration-200 hover:-translate-y-0.5 hover:shadow-xl hover:z-10 focus-within:z-10 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/40 focus-visible:ring-offset-2 focus-visible:ring-offset-white dark:focus-visible:ring-offset-slate-900'\n : undefined;\n const tabIndexValue = interactive && rest.tabIndex === undefined ? 0 : rest.tabIndex;\n const content = applyDividers(children, dividers);\n\n return (\n <div\n {...rest}\n ref={ref}\n tabIndex={tabIndexValue}\n className={twMerge(\n cardBase,\n variantClass,\n paddingClass,\n overflowClass,\n interactiveClass,\n className\n )}\n >\n {content}\n </div>\n );\n});\n\n/**\n * Section for placing the card title, subtitle or actions at the top of the card.\n */\nconst CardHeader: React.FC<CardSectionProps> = ({ className, dividers = true, ...rest }) => (\n <div\n {...rest}\n className={twMerge(\n 'card-header mb-2 flex flex-col gap-1 pb-3',\n dividers ? 'border-b border-gray-100 dark:border-slate-800' : undefined,\n className\n )}\n />\n);\n\n/**\n * Primary content area of the card.\n */\nconst CardBody: React.FC<CardSectionProps> = ({ className, ...rest }) => (\n <div {...rest} className={twMerge('card-body flex flex-col gap-3', className)} />\n);\n\n/**\n * Footer area for actions or supplemental information.\n */\nconst CardFooter: React.FC<CardSectionProps> = ({ className, dividers = true, ...rest }) => (\n <div\n {...rest}\n className={twMerge(\n 'card-footer mt-3 flex flex-wrap items-center gap-3 pt-3',\n dividers ? 'border-t border-gray-100 dark:border-slate-800' : undefined,\n className\n )}\n />\n);\n\n/**\n * Stylized heading for the card.\n */\nconst CardTitle: React.FC<CardSectionProps> = ({ className, ...rest }) => (\n <h3\n {...rest}\n className={twMerge(\n 'card-title text-lg font-semibold text-gray-900 dark:text-slate-50',\n className\n )}\n />\n);\n\n/**\n * Subtitle text for secondary information under the title.\n */\nconst CardSubtitle: React.FC<CardSectionProps> = ({ className, ...rest }) => (\n <p\n {...rest}\n className={twMerge(\n 'card-subtitle text-sm font-medium text-gray-600 dark:text-slate-300',\n className\n )}\n />\n);\n\n/**\n * Body text with default card typography.\n */\nconst CardText: React.FC<CardTextProps> = ({ className, ...rest }) => (\n <p\n {...rest}\n className={twMerge('card-text text-sm text-gray-700 dark:text-slate-200', className)}\n />\n);\n\n/**\n * Media region for images, retaining card spacing and optional rounded corners.\n */\nconst CardMedia: React.FC<CardMediaProps> = ({ className, rounded = false, ...rest }) => (\n <img\n {...rest}\n className={twMerge(\n 'card-media w-full object-cover',\n rounded ? 'rounded-xl' : 'rounded-none',\n rest.height || rest.style ? 'block' : 'block max-h-60',\n className\n )}\n loading={rest.loading ?? 'lazy'}\n />\n);\n\n/**\n * Container for action buttons inside the card.\n */\nconst CardActions: React.FC<CardSectionProps> = ({ className, ...rest }) => (\n <div {...rest} className={twMerge('card-actions flex flex-wrap gap-2', className)} />\n);\n\nexport type { CardOverflow, CardProps, CardSectionProps, CardMediaProps, CardTextProps };\n\nconst Card = Object.assign(CardRoot, {\n Header: CardHeader,\n Body: CardBody,\n Footer: CardFooter,\n Title: CardTitle,\n Subtitle: CardSubtitle,\n Text: CardText,\n Media: CardMedia,\n Actions: CardActions\n});\n\nexport default Card;\n\nfunction applyDividers(children: ReactNode, dividers: boolean): ReactNode {\n return Children.map(children, child => {\n if (!isValidElement(child)) return child;\n\n if (isDividerSection(child)) {\n return cloneElement<CardSectionProps>(child, { dividers: child.props.dividers ?? dividers });\n }\n\n if (hasNestedChildren(child)) {\n return cloneElement<{ children?: ReactNode }>(child, {\n children: applyDividers(child.props.children, dividers)\n });\n }\n\n return child;\n });\n}\n\nfunction isDividerSection(element: ReactElement): element is ReactElement<CardSectionProps> {\n return element.type === CardHeader || element.type === CardFooter;\n}\n\nfunction hasNestedChildren(\n element: ReactElement\n): element is ReactElement<{ children?: ReactNode }> {\n const props = element.props as Record<string, unknown>;\n return 'children' in props;\n}\n"]}
package/dist/index.cjs CHANGED
@@ -1575,7 +1575,11 @@ var paddingClasses = {
1575
1575
  md: "p-4",
1576
1576
  lg: "p-6"
1577
1577
  };
1578
- var cardBase = "card-base relative w-full overflow-hidden bg-white text-gray-900 transition-colors dark:bg-slate-900 dark:text-slate-100";
1578
+ var overflowClasses = {
1579
+ hidden: "overflow-hidden",
1580
+ visible: "overflow-visible"
1581
+ };
1582
+ var cardBase = "card-base relative w-full bg-white text-gray-900 transition-colors dark:bg-slate-900 dark:text-slate-100";
1579
1583
  var variantClasses = {
1580
1584
  solid: "rounded-2xl border border-gray-200 bg-white shadow-lg shadow-gray-200/55 dark:border-slate-800 dark:bg-slate-900 dark:shadow-black/30",
1581
1585
  outline: "rounded-2xl border-2 border-black bg-white shadow-none dark:border-black dark:bg-slate-900",
@@ -1591,13 +1595,15 @@ var CardRoot = React4.forwardRef(function Card({
1591
1595
  children,
1592
1596
  variant = "solid",
1593
1597
  padding = "md",
1598
+ overflow = "hidden",
1594
1599
  interactive = false,
1595
1600
  dividers = true,
1596
1601
  ...rest
1597
1602
  }, ref) {
1598
1603
  const variantClass = variantClasses[variant] ?? variantClasses.solid;
1599
1604
  const paddingClass = paddingClasses[padding] ?? paddingClasses.md;
1600
- const interactiveClass = interactive ? "transition-all duration-200 hover:-translate-y-0.5 hover:shadow-xl focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/40 focus-visible:ring-offset-2 focus-visible:ring-offset-white dark:focus-visible:ring-offset-slate-900" : void 0;
1605
+ const overflowClass = overflowClasses[overflow] ?? overflowClasses.hidden;
1606
+ const interactiveClass = interactive ? "transition-all duration-200 hover:-translate-y-0.5 hover:shadow-xl hover:z-10 focus-within:z-10 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/40 focus-visible:ring-offset-2 focus-visible:ring-offset-white dark:focus-visible:ring-offset-slate-900" : void 0;
1601
1607
  const tabIndexValue = interactive && rest.tabIndex === void 0 ? 0 : rest.tabIndex;
1602
1608
  const content = applyDividers(children, dividers);
1603
1609
  return /* @__PURE__ */ jsxRuntime.jsx(
@@ -1606,7 +1612,14 @@ var CardRoot = React4.forwardRef(function Card({
1606
1612
  ...rest,
1607
1613
  ref,
1608
1614
  tabIndex: tabIndexValue,
1609
- className: tailwindMerge.twMerge(cardBase, variantClass, paddingClass, interactiveClass, className),
1615
+ className: tailwindMerge.twMerge(
1616
+ cardBase,
1617
+ variantClass,
1618
+ paddingClass,
1619
+ overflowClass,
1620
+ interactiveClass,
1621
+ className
1622
+ ),
1610
1623
  children: content
1611
1624
  }
1612
1625
  );