@lindle/linoardo 1.0.46 → 1.0.48
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/{ExpansionPanelItem-C9KW1yBc.d.cts → ExpansionPanelItem-By0ziOVw.d.cts} +1 -1
- package/dist/{ExpansionPanelItem-Pi3BM-4v.d.ts → ExpansionPanelItem-CFfWX7ia.d.ts} +1 -1
- package/dist/alert.cjs +3 -3
- package/dist/alert.cjs.map +1 -1
- package/dist/alert.js +1 -1
- package/dist/badge.cjs +10 -10
- package/dist/badge.cjs.map +1 -1
- package/dist/badge.d.cts +1 -1
- package/dist/badge.d.ts +1 -1
- package/dist/badge.js +1 -1
- package/dist/block.cjs +0 -1
- package/dist/block.cjs.map +1 -1
- package/dist/block.d.cts +1 -1
- package/dist/block.d.ts +1 -1
- package/dist/block.js +1 -1
- package/dist/button.cjs +111 -55
- package/dist/button.cjs.map +1 -1
- package/dist/button.d.cts +16 -5
- package/dist/button.d.ts +16 -5
- package/dist/button.js +1 -1
- package/dist/card.cjs +0 -1
- package/dist/card.cjs.map +1 -1
- package/dist/card.d.cts +1 -1
- package/dist/card.d.ts +1 -1
- package/dist/card.js +1 -1
- package/dist/chip.cjs +47 -55
- package/dist/chip.cjs.map +1 -1
- package/dist/chip.d.cts +1 -1
- package/dist/chip.d.ts +1 -1
- package/dist/chip.js +2 -2
- package/dist/{chunk-5GT6L4BE.js → chunk-4NKKWBMP.js} +2 -3
- package/dist/chunk-4NKKWBMP.js.map +1 -0
- package/dist/{chunk-VPF7M2PB.js → chunk-7TQUULYB.js} +23 -26
- package/dist/chunk-7TQUULYB.js.map +1 -0
- package/dist/{chunk-U4P2VJCV.js → chunk-7YZBEH2K.js} +2 -3
- package/dist/chunk-7YZBEH2K.js.map +1 -0
- package/dist/{chunk-NJU7XT54.js → chunk-DMI64Z53.js} +4 -4
- package/dist/chunk-DMI64Z53.js.map +1 -0
- package/dist/{chunk-NADLY6LM.js → chunk-DUEQOGNR.js} +3 -4
- package/dist/chunk-DUEQOGNR.js.map +1 -0
- package/dist/{chunk-5LWU5T2C.js → chunk-GKZFVQW6.js} +16 -16
- package/dist/chunk-GKZFVQW6.js.map +1 -0
- package/dist/{chunk-ZTP2JSQ6.js → chunk-H4742H2N.js} +53 -27
- package/dist/chunk-H4742H2N.js.map +1 -0
- package/dist/{chunk-PSMGRUU5.js → chunk-HGECC2JH.js} +48 -56
- package/dist/chunk-HGECC2JH.js.map +1 -0
- package/dist/{chunk-DIWGVTWO.js → chunk-HVGCLUW2.js} +113 -57
- package/dist/chunk-HVGCLUW2.js.map +1 -0
- package/dist/{chunk-GMDNSU26.js → chunk-KK33I72F.js} +5 -5
- package/dist/{chunk-GMDNSU26.js.map → chunk-KK33I72F.js.map} +1 -1
- package/dist/{chunk-HT5XBHWN.js → chunk-KVXZEMAH.js} +4 -4
- package/dist/{chunk-HT5XBHWN.js.map → chunk-KVXZEMAH.js.map} +1 -1
- package/dist/{chunk-5MVIF5GP.js → chunk-LRWM4ZWZ.js} +4 -7
- package/dist/chunk-LRWM4ZWZ.js.map +1 -0
- package/dist/{chunk-XA74HBMH.js → chunk-LSIAP7ZZ.js} +8 -8
- package/dist/chunk-LSIAP7ZZ.js.map +1 -0
- package/dist/{chunk-HEXJCQRO.js → chunk-LWCRKQEV.js} +10 -10
- package/dist/chunk-LWCRKQEV.js.map +1 -0
- package/dist/{chunk-FEGFA3FN.js → chunk-LZYVTGJD.js} +3 -3
- package/dist/{chunk-FEGFA3FN.js.map → chunk-LZYVTGJD.js.map} +1 -1
- package/dist/{chunk-U2AL7XFY.js → chunk-O3VFEMJ7.js} +4 -4
- package/dist/chunk-O3VFEMJ7.js.map +1 -0
- package/dist/{chunk-HIRPMCQJ.js → chunk-OQYPWJDA.js} +12 -12
- package/dist/{chunk-HIRPMCQJ.js.map → chunk-OQYPWJDA.js.map} +1 -1
- package/dist/{chunk-AUVYU7M5.js → chunk-Q7VTD6NY.js} +20 -20
- package/dist/chunk-Q7VTD6NY.js.map +1 -0
- package/dist/{chunk-F3PI7A6V.js → chunk-TRR7TDVA.js} +3 -4
- package/dist/chunk-TRR7TDVA.js.map +1 -0
- package/dist/chunk-UGG35FPX.js +141 -0
- package/dist/chunk-UGG35FPX.js.map +1 -0
- package/dist/{chunk-HAXGOTZO.js → chunk-UK6RSS4J.js} +3 -3
- package/dist/chunk-UK6RSS4J.js.map +1 -0
- package/dist/{chunk-KQOR3C7E.js → chunk-ZLBGPLM3.js} +5 -5
- package/dist/chunk-ZLBGPLM3.js.map +1 -0
- package/dist/dialog.cjs +2 -2
- package/dist/dialog.cjs.map +1 -1
- package/dist/dialog.js +1 -1
- package/dist/expansion-panel/item.cjs +18 -18
- package/dist/expansion-panel/item.cjs.map +1 -1
- package/dist/expansion-panel/item.d.cts +2 -2
- package/dist/expansion-panel/item.d.ts +2 -2
- package/dist/expansion-panel/item.js +1 -1
- package/dist/expansion-panel.cjs +23 -23
- package/dist/expansion-panel.cjs.map +1 -1
- package/dist/expansion-panel.d.cts +3 -3
- package/dist/expansion-panel.d.ts +3 -3
- package/dist/expansion-panel.js +2 -2
- package/dist/{global.types-gx9A7mUe.d.cts → global.types-CjO3VRWu.d.cts} +1 -1
- package/dist/{global.types-gx9A7mUe.d.ts → global.types-CjO3VRWu.d.ts} +1 -1
- package/dist/hero.cjs +21 -24
- package/dist/hero.cjs.map +1 -1
- package/dist/hero.d.cts +1 -1
- package/dist/hero.d.ts +1 -1
- package/dist/hero.js +1 -1
- package/dist/icon.cjs +8 -8
- package/dist/icon.cjs.map +1 -1
- package/dist/icon.d.cts +1 -1
- package/dist/icon.d.ts +1 -1
- package/dist/icon.js +1 -1
- package/dist/{index-CNwl6vmH.d.ts → index-BgLrabTA.d.ts} +1 -1
- package/dist/{index-BDrBOeFI.d.cts → index-C19gZTrO.d.cts} +1 -1
- package/dist/index.cjs +475 -489
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +4 -4
- package/dist/index.d.ts +4 -4
- package/dist/index.js +68 -68
- package/dist/index.js.map +1 -1
- package/dist/input.cjs +62 -145
- package/dist/input.cjs.map +1 -1
- package/dist/input.d.cts +6 -6
- package/dist/input.d.ts +6 -6
- package/dist/input.js +1 -2
- package/dist/list/item.d.cts +2 -2
- package/dist/list/item.d.ts +2 -2
- package/dist/list.cjs +1 -2
- package/dist/list.cjs.map +1 -1
- package/dist/list.d.cts +3 -3
- package/dist/list.d.ts +3 -3
- package/dist/list.js +1 -1
- package/dist/masonry.cjs +1 -1
- package/dist/masonry.cjs.map +1 -1
- package/dist/masonry.js +1 -1
- package/dist/menu.cjs +51 -25
- package/dist/menu.cjs.map +1 -1
- package/dist/menu.js +1 -1
- package/dist/notification.d.cts +1 -1
- package/dist/notification.d.ts +1 -1
- package/dist/profileCard.cjs +112 -59
- package/dist/profileCard.cjs.map +1 -1
- package/dist/profileCard.d.cts +1 -1
- package/dist/profileCard.d.ts +1 -1
- package/dist/profileCard.js +2 -2
- package/dist/select.cjs +1 -2
- package/dist/select.cjs.map +1 -1
- package/dist/select.d.cts +2 -2
- package/dist/select.d.ts +2 -2
- package/dist/select.js +1 -1
- package/dist/slider.cjs +3 -3
- package/dist/slider.cjs.map +1 -1
- package/dist/slider.d.cts +1 -1
- package/dist/slider.d.ts +1 -1
- package/dist/slider.js +1 -1
- package/dist/styles.css +1156 -148
- package/dist/switch.cjs +14 -14
- package/dist/switch.cjs.map +1 -1
- package/dist/switch.d.cts +1 -1
- package/dist/switch.d.ts +1 -1
- package/dist/switch.js +1 -1
- package/dist/timeline.cjs.map +1 -1
- package/dist/timeline.d.cts +2 -2
- package/dist/timeline.d.ts +2 -2
- package/dist/timeline.js +2 -2
- package/dist/tooltip.cjs +2 -2
- package/dist/tooltip.cjs.map +1 -1
- package/dist/tooltip.js +1 -1
- package/dist/{types-DaTHYIPO.d.ts → types-B4puM-zr.d.cts} +3 -4
- package/dist/{types-CJ0zqPXF.d.cts → types-BDisBwnf.d.ts} +3 -4
- package/package.json +1 -1
- package/readme.md +21 -1
- package/dist/chunk-5GT6L4BE.js.map +0 -1
- package/dist/chunk-5LWU5T2C.js.map +0 -1
- package/dist/chunk-5MVIF5GP.js.map +0 -1
- package/dist/chunk-AUVYU7M5.js.map +0 -1
- package/dist/chunk-DIWGVTWO.js.map +0 -1
- package/dist/chunk-F3PI7A6V.js.map +0 -1
- package/dist/chunk-HAXGOTZO.js.map +0 -1
- package/dist/chunk-HEXJCQRO.js.map +0 -1
- package/dist/chunk-KQOR3C7E.js.map +0 -1
- package/dist/chunk-NADLY6LM.js.map +0 -1
- package/dist/chunk-NJU7XT54.js.map +0 -1
- package/dist/chunk-OBGYXMZ3.js +0 -218
- package/dist/chunk-OBGYXMZ3.js.map +0 -1
- package/dist/chunk-PSMGRUU5.js.map +0 -1
- package/dist/chunk-U2AL7XFY.js.map +0 -1
- package/dist/chunk-U4P2VJCV.js.map +0 -1
- package/dist/chunk-VPF7M2PB.js.map +0 -1
- package/dist/chunk-XA74HBMH.js.map +0 -1
- package/dist/chunk-ZTP2JSQ6.js.map +0 -1
package/dist/button.d.cts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as react from 'react';
|
|
2
|
-
import { b as GlobalVariant, a as Palette, G as GlobalSize, P as PropIcon } from './global.types-
|
|
2
|
+
import { b as GlobalVariant, a as Palette, G as GlobalSize, P as PropIcon } from './global.types-CjO3VRWu.cjs';
|
|
3
3
|
|
|
4
4
|
type ButtonVariant = GlobalVariant;
|
|
5
5
|
type ButtonOwnProps = {
|
|
@@ -14,17 +14,28 @@ type ButtonOwnProps = {
|
|
|
14
14
|
as?: react.ElementType;
|
|
15
15
|
};
|
|
16
16
|
type ButtonProps<T extends react.ElementType = 'button'> = ButtonOwnProps & Omit<react.ComponentPropsWithoutRef<T>, keyof ButtonOwnProps | 'color' | 'size' | 'as'>;
|
|
17
|
+
type ButtonGroupProps = react.HTMLAttributes<HTMLDivElement> & {
|
|
18
|
+
variant?: ButtonVariant;
|
|
19
|
+
color?: Palette;
|
|
20
|
+
size?: GlobalSize;
|
|
21
|
+
block?: boolean;
|
|
22
|
+
disabled?: boolean;
|
|
23
|
+
loading?: boolean;
|
|
24
|
+
iconOnly?: boolean;
|
|
25
|
+
vertical?: boolean;
|
|
26
|
+
attached?: boolean;
|
|
27
|
+
};
|
|
17
28
|
|
|
18
29
|
type PolymorphicRef<T extends react.ElementType> = react.ComponentPropsWithRef<T>['ref'];
|
|
19
|
-
type
|
|
30
|
+
type ButtonBaseComponent = {
|
|
20
31
|
<T extends react.ElementType = 'button'>(props: ButtonProps<T> & {
|
|
21
32
|
ref?: PolymorphicRef<T>;
|
|
22
33
|
}): react.ReactElement | null;
|
|
23
34
|
displayName?: string;
|
|
24
35
|
};
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
36
|
+
type ButtonComponent = ButtonBaseComponent & {
|
|
37
|
+
Group: react.ForwardRefExoticComponent<ButtonGroupProps & react.RefAttributes<HTMLDivElement>>;
|
|
38
|
+
};
|
|
28
39
|
declare const Button: ButtonComponent;
|
|
29
40
|
|
|
30
41
|
export { Button as default };
|
package/dist/button.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as react from 'react';
|
|
2
|
-
import { b as GlobalVariant, a as Palette, G as GlobalSize, P as PropIcon } from './global.types-
|
|
2
|
+
import { b as GlobalVariant, a as Palette, G as GlobalSize, P as PropIcon } from './global.types-CjO3VRWu.js';
|
|
3
3
|
|
|
4
4
|
type ButtonVariant = GlobalVariant;
|
|
5
5
|
type ButtonOwnProps = {
|
|
@@ -14,17 +14,28 @@ type ButtonOwnProps = {
|
|
|
14
14
|
as?: react.ElementType;
|
|
15
15
|
};
|
|
16
16
|
type ButtonProps<T extends react.ElementType = 'button'> = ButtonOwnProps & Omit<react.ComponentPropsWithoutRef<T>, keyof ButtonOwnProps | 'color' | 'size' | 'as'>;
|
|
17
|
+
type ButtonGroupProps = react.HTMLAttributes<HTMLDivElement> & {
|
|
18
|
+
variant?: ButtonVariant;
|
|
19
|
+
color?: Palette;
|
|
20
|
+
size?: GlobalSize;
|
|
21
|
+
block?: boolean;
|
|
22
|
+
disabled?: boolean;
|
|
23
|
+
loading?: boolean;
|
|
24
|
+
iconOnly?: boolean;
|
|
25
|
+
vertical?: boolean;
|
|
26
|
+
attached?: boolean;
|
|
27
|
+
};
|
|
17
28
|
|
|
18
29
|
type PolymorphicRef<T extends react.ElementType> = react.ComponentPropsWithRef<T>['ref'];
|
|
19
|
-
type
|
|
30
|
+
type ButtonBaseComponent = {
|
|
20
31
|
<T extends react.ElementType = 'button'>(props: ButtonProps<T> & {
|
|
21
32
|
ref?: PolymorphicRef<T>;
|
|
22
33
|
}): react.ReactElement | null;
|
|
23
34
|
displayName?: string;
|
|
24
35
|
};
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
36
|
+
type ButtonComponent = ButtonBaseComponent & {
|
|
37
|
+
Group: react.ForwardRefExoticComponent<ButtonGroupProps & react.RefAttributes<HTMLDivElement>>;
|
|
38
|
+
};
|
|
28
39
|
declare const Button: ButtonComponent;
|
|
29
40
|
|
|
30
41
|
export { Button as default };
|
package/dist/button.js
CHANGED
package/dist/card.cjs
CHANGED
|
@@ -23,7 +23,6 @@ var variantClasses = {
|
|
|
23
23
|
text: "rounded-2xl border border-transparent bg-transparent dark:border-transparent dark:bg-transparent",
|
|
24
24
|
filled: "rounded-2xl border border-gray-200 bg-gray-50 dark:border-slate-800 dark:bg-slate-800",
|
|
25
25
|
underlined: " border border-transparent border-b border-b-gray-200 dark:border-transparent dark:border-b-slate-700 dark:bg-transparent",
|
|
26
|
-
rounded: "rounded-3xl border border-gray-200 bg-white dark:border-slate-800 dark:bg-slate-900",
|
|
27
26
|
sharp: "rounded-none border border-gray-200 bg-white dark:border-slate-800 dark:bg-slate-900"
|
|
28
27
|
};
|
|
29
28
|
var elevationClasses = {
|
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 { GlobalElevation, GlobalVariant } from '@lindle/linoardo/global.types';\nimport { twMerge } from 'tailwind-merge';\nimport type { CardMediaProps, CardOverflow, 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 overflowClasses: Record<Exclude<CardProps['overflow'], undefined>, string> = {\n hidden: 'overflow-hidden',\n visible: 'overflow-visible'\n};\n\nconst cardBase = '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: 'rounded-2xl border border-gray-200 bg-white dark:border-slate-800 dark:bg-slate-900',\n outline: 'rounded-2xl border-2 border-black bg-white dark:border-black dark:bg-slate-900',\n ghost: 'rounded-2xl border border-transparent bg-gray-50 dark:border-transparent dark:bg-slate-800',\n text: 'rounded-2xl border border-transparent bg-transparent dark:border-transparent dark:bg-transparent',\n filled: 'rounded-2xl border border-gray-200 bg-gray-50 dark:border-slate-800 dark:bg-slate-800',\n underlined: ' border border-transparent border-b border-b-gray-200 dark:border-transparent dark:border-b-slate-700 dark:bg-transparent',\n rounded: 'rounded-3xl border border-gray-200 bg-white dark:border-slate-800 dark:bg-slate-900',\n sharp: 'rounded-none border border-gray-200 bg-white dark:border-slate-800 dark:bg-slate-900'\n};\n\nconst elevationClasses: Record<GlobalElevation, string> = {\n 0: 'shadow-none',\n 1: 'shadow-sm',\n 2: 'shadow',\n 3: 'shadow-md',\n 4: 'shadow-lg',\n 5: 'shadow-xl',\n 6: 'shadow-2xl'\n};\n\n/**\n * Card container with optional padding, variants and interactive focus/hover styles.\n */\nconst CardRoot = forwardRef<HTMLDivElement, CardProps & { elevation?: GlobalElevation }>(function Card(\n { className, children, variant = 'solid', padding = 'md', overflow = 'hidden', interactive = false, dividers = true, elevation = 0, ...rest },\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 elevationClass = elevationClasses[elevation] ?? elevationClasses[0];\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(cardBase, variantClass, paddingClass, overflowClass, elevationClass, 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 {...rest} className={twMerge('card-title text-lg font-semibold text-gray-900 dark:text-slate-50', className)} />\n);\n\n/**\n * Subtitle text for secondary information under the title.\n */\nconst CardSubtitle: React.FC<CardSectionProps> = ({ className, ...rest }) => (\n <p {...rest} className={twMerge('card-subtitle text-sm font-medium text-gray-600 dark:text-slate-300', className)} />\n);\n\n/**\n * Body text with default card typography.\n */\nconst CardText: React.FC<CardTextProps> = ({ className, ...rest }) => (\n <p {...rest} className={twMerge('card-text text-sm text-gray-700 dark:text-slate-200', className)} />\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(element: ReactElement): 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 { GlobalElevation, GlobalVariant } from '@lindle/linoardo/global.types';\nimport { twMerge } from 'tailwind-merge';\nimport type { CardMediaProps, CardOverflow, 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 overflowClasses: Record<Exclude<CardProps['overflow'], undefined>, string> = {\n hidden: 'overflow-hidden',\n visible: 'overflow-visible'\n};\n\nconst cardBase = '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: 'rounded-2xl border border-gray-200 bg-white dark:border-slate-800 dark:bg-slate-900',\n outline: 'rounded-2xl border-2 border-black bg-white dark:border-black dark:bg-slate-900',\n ghost: 'rounded-2xl border border-transparent bg-gray-50 dark:border-transparent dark:bg-slate-800',\n text: 'rounded-2xl border border-transparent bg-transparent dark:border-transparent dark:bg-transparent',\n filled: 'rounded-2xl border border-gray-200 bg-gray-50 dark:border-slate-800 dark:bg-slate-800',\n underlined: ' border border-transparent border-b border-b-gray-200 dark:border-transparent dark:border-b-slate-700 dark:bg-transparent',\n sharp: 'rounded-none border border-gray-200 bg-white dark:border-slate-800 dark:bg-slate-900'\n};\n\nconst elevationClasses: Record<GlobalElevation, string> = {\n 0: 'shadow-none',\n 1: 'shadow-sm',\n 2: 'shadow',\n 3: 'shadow-md',\n 4: 'shadow-lg',\n 5: 'shadow-xl',\n 6: 'shadow-2xl'\n};\n\n/**\n * Card container with optional padding, variants and interactive focus/hover styles.\n */\nconst CardRoot = forwardRef<HTMLDivElement, CardProps & { elevation?: GlobalElevation }>(function Card(\n { className, children, variant = 'solid', padding = 'md', overflow = 'hidden', interactive = false, dividers = true, elevation = 0, ...rest },\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 elevationClass = elevationClasses[elevation] ?? elevationClasses[0];\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(cardBase, variantClass, paddingClass, overflowClass, elevationClass, 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 {...rest} className={twMerge('card-title text-lg font-semibold text-gray-900 dark:text-slate-50', className)} />\n);\n\n/**\n * Subtitle text for secondary information under the title.\n */\nconst CardSubtitle: React.FC<CardSectionProps> = ({ className, ...rest }) => (\n <p {...rest} className={twMerge('card-subtitle text-sm font-medium text-gray-600 dark:text-slate-300', className)} />\n);\n\n/**\n * Body text with default card typography.\n */\nconst CardText: React.FC<CardTextProps> = ({ className, ...rest }) => (\n <p {...rest} className={twMerge('card-text text-sm text-gray-700 dark:text-slate-200', className)} />\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(element: ReactElement): 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
package/dist/card.d.ts
CHANGED
package/dist/card.js
CHANGED
package/dist/chip.cjs
CHANGED
|
@@ -12,88 +12,80 @@ var iconBaseClasses = {
|
|
|
12
12
|
};
|
|
13
13
|
|
|
14
14
|
// src/Containment/Chip/states.chip.ts
|
|
15
|
-
var chipBaseClasses = "inline-flex items-center gap-1.5 border font-medium leading-tight transition-all duration-200 select-none focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/40 focus-visible:ring-offset-2";
|
|
16
|
-
var closeButtonClasses = "ml-1 flex h-5 w-5 shrink-0 items-center justify-center rounded-full border border-transparent text-current/70 transition-colors duration-200 hover:bg-current/10 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-current/30 focus-visible:ring-offset-2";
|
|
15
|
+
var chipBaseClasses = "inline-flex items-center gap-1.5 border font-medium leading-tight transition-all duration-200 select-none 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-gray-900";
|
|
16
|
+
var closeButtonClasses = "ml-1 flex h-5 w-5 shrink-0 items-center justify-center rounded-full border border-transparent text-current/70 transition-colors duration-200 hover:bg-current/10 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-current/30 focus-visible:ring-offset-2 focus-visible:ring-offset-white dark:focus-visible:ring-offset-gray-900";
|
|
17
17
|
var blackAndWhitePaletteClasses = {
|
|
18
|
-
solid: "bg-black text-white border border-black hover:bg-black/90 focus-visible:ring-black/40 focus-visible:ring-offset-white",
|
|
19
|
-
outline: "bg-white text-black border-2 border-black hover:bg-black hover:text-white focus-visible:ring-black/40 focus-visible:ring-offset-white",
|
|
20
|
-
ghost: "bg-neutral-200 text-black border border-transparent hover:bg-neutral-300 focus-visible:ring-black/20",
|
|
21
|
-
text: "bg-transparent text-black border border-transparent hover:bg-neutral-200 focus-visible:ring-black/20",
|
|
22
|
-
filled: "bg-black/10 text-black border border-black/30 hover:bg-black/20 focus-visible:ring-black/20",
|
|
23
|
-
underlined: "bg-transparent text-black border-0 border-b-2 border-black px-0 rounded-none hover:text-black/80 focus-visible:ring-black/20",
|
|
24
|
-
|
|
25
|
-
sharp: "rounded-none bg-black text-white border border-black hover:bg-black/90 focus-visible:ring-black/40 focus-visible:ring-offset-white"
|
|
18
|
+
solid: "bg-black text-white border border-black hover:bg-black/90 focus-visible:ring-black/40 focus-visible:ring-offset-white dark:bg-white dark:text-black dark:border-white dark:hover:bg-white/90 dark:focus-visible:ring-white/40 dark:focus-visible:ring-offset-gray-900",
|
|
19
|
+
outline: "bg-white text-black border-2 border-black hover:bg-black hover:text-white focus-visible:ring-black/40 focus-visible:ring-offset-white dark:bg-transparent dark:text-white dark:border-white dark:hover:bg-white dark:hover:text-black dark:focus-visible:ring-white/40 dark:focus-visible:ring-offset-gray-900",
|
|
20
|
+
ghost: "bg-neutral-200 text-black border border-transparent hover:bg-neutral-300 focus-visible:ring-black/20 dark:bg-neutral-800 dark:text-white dark:hover:bg-neutral-700",
|
|
21
|
+
text: "bg-transparent text-black border border-transparent hover:bg-neutral-200 focus-visible:ring-black/20 dark:text-white dark:hover:bg-neutral-800",
|
|
22
|
+
filled: "bg-black/10 text-black border border-black/30 hover:bg-black/20 focus-visible:ring-black/20 dark:bg-white/10 dark:text-white dark:border-white/30 dark:hover:bg-white/20",
|
|
23
|
+
underlined: "bg-transparent text-black border-0 border-b-2 border-black px-0 rounded-none hover:text-black/80 focus-visible:ring-black/20 dark:text-white dark:border-white dark:hover:text-white/80",
|
|
24
|
+
sharp: "rounded-none bg-black text-white border border-black hover:bg-black/90 focus-visible:ring-black/40 focus-visible:ring-offset-white dark:bg-white dark:text-black dark:border-white dark:hover:bg-white/90 dark:focus-visible:ring-white/40 dark:focus-visible:ring-offset-gray-900"
|
|
26
25
|
};
|
|
27
26
|
var paletteVariantClasses = {
|
|
28
27
|
primary: {
|
|
29
28
|
solid: "bg-primary text-white border border-primary hover:bg-primary/90",
|
|
30
29
|
sharp: "rounded-none bg-primary text-white border border-primary hover:bg-primary/90",
|
|
31
|
-
outline: "bg-transparent text-primary border border-primary hover:bg-primary/10",
|
|
32
|
-
ghost: "bg-primary/15 text-primary border border-transparent hover:bg-primary/25",
|
|
33
|
-
text: "bg-transparent text-primary border border-transparent hover:text-primary/80",
|
|
34
|
-
filled: "bg-primary/10 text-primary border border-primary/30 hover:bg-primary/20",
|
|
35
|
-
underlined: "bg-transparent text-primary border-0 border-b-2 border-primary px-0 rounded-none hover:text-primary/80"
|
|
36
|
-
rounded: "bg-white text-primary border border-primary/40 shadow-sm hover:bg-primary/5"
|
|
30
|
+
outline: "bg-transparent text-primary border border-primary hover:bg-primary/10 dark:border-primary/60 dark:hover:bg-primary/20",
|
|
31
|
+
ghost: "bg-primary/15 text-primary border border-transparent hover:bg-primary/25 dark:bg-primary/25 dark:hover:bg-primary/35",
|
|
32
|
+
text: "bg-transparent text-primary border border-transparent hover:text-primary/80 dark:hover:bg-primary/15",
|
|
33
|
+
filled: "bg-primary/10 text-primary border border-primary/30 hover:bg-primary/20 dark:bg-primary/20 dark:border-primary/40 dark:hover:bg-primary/30",
|
|
34
|
+
underlined: "bg-transparent text-primary border-0 border-b-2 border-primary px-0 rounded-none hover:text-primary/80 dark:hover:bg-primary/15"
|
|
37
35
|
},
|
|
38
36
|
neutral: {
|
|
39
37
|
solid: "bg-gray-900 text-white border border-gray-900 hover:bg-gray-800",
|
|
40
38
|
sharp: "rounded-none bg-gray-900 text-white border border-gray-900 hover:bg-gray-800",
|
|
41
|
-
outline: "bg-transparent text-gray-900 border border-gray-500 hover:bg-gray-100",
|
|
42
|
-
ghost: "bg-gray-100 text-gray-900 border border-transparent hover:bg-gray-200",
|
|
43
|
-
text: "bg-transparent text-gray-900 border border-transparent hover:text-gray-700",
|
|
44
|
-
filled: "bg-gray-200 text-gray-900 border border-gray-300 hover:bg-gray-300",
|
|
45
|
-
underlined: "bg-transparent text-gray-900 border-0 border-b-2 border-gray-500 px-0 rounded-none hover:text-gray-700"
|
|
46
|
-
rounded: "bg-white text-gray-900 border border-gray-300 shadow-sm hover:bg-gray-100"
|
|
39
|
+
outline: "bg-transparent text-gray-900 border border-gray-500 hover:bg-gray-100 dark:text-gray-200 dark:border-gray-600 dark:hover:bg-gray-800",
|
|
40
|
+
ghost: "bg-gray-100 text-gray-900 border border-transparent hover:bg-gray-200 dark:bg-gray-800 dark:text-gray-100 dark:hover:bg-gray-700",
|
|
41
|
+
text: "bg-transparent text-gray-900 border border-transparent hover:text-gray-700 dark:text-gray-100 dark:hover:bg-gray-800",
|
|
42
|
+
filled: "bg-gray-200 text-gray-900 border border-gray-300 hover:bg-gray-300 dark:bg-gray-800 dark:text-gray-100 dark:border-gray-700 dark:hover:bg-gray-700",
|
|
43
|
+
underlined: "bg-transparent text-gray-900 border-0 border-b-2 border-gray-500 px-0 rounded-none hover:text-gray-700 dark:text-gray-100 dark:border-gray-600 dark:hover:bg-gray-800"
|
|
47
44
|
},
|
|
48
45
|
info: {
|
|
49
46
|
solid: "bg-sky-500 text-white border border-sky-500 hover:bg-sky-600",
|
|
50
47
|
sharp: "rounded-none bg-sky-500 text-white border border-sky-500 hover:bg-sky-600",
|
|
51
|
-
outline: "bg-transparent text-sky-600 border border-sky-500 hover:bg-sky-50",
|
|
52
|
-
ghost: "bg-sky-100 text-sky-700 border border-transparent hover:bg-sky-200",
|
|
53
|
-
text: "bg-transparent text-sky-600 border border-transparent hover:text-sky-700",
|
|
54
|
-
filled: "bg-sky-100 text-sky-700 border border-sky-200 hover:bg-sky-200",
|
|
55
|
-
underlined: "bg-transparent text-sky-600 border-0 border-b-2 border-sky-500 px-0 rounded-none hover:text-sky-700"
|
|
56
|
-
rounded: "bg-white text-sky-700 border border-sky-200 shadow-sm hover:bg-sky-50"
|
|
48
|
+
outline: "bg-transparent text-sky-600 border border-sky-500 hover:bg-sky-50 dark:text-sky-300 dark:border-sky-500/70 dark:hover:bg-sky-900/30",
|
|
49
|
+
ghost: "bg-sky-100 text-sky-700 border border-transparent hover:bg-sky-200 dark:bg-sky-900/35 dark:text-sky-200 dark:hover:bg-sky-900/50",
|
|
50
|
+
text: "bg-transparent text-sky-600 border border-transparent hover:text-sky-700 dark:text-sky-300 dark:hover:bg-sky-900/30",
|
|
51
|
+
filled: "bg-sky-100 text-sky-700 border border-sky-200 hover:bg-sky-200 dark:bg-sky-900/35 dark:text-sky-200 dark:border-sky-700/60 dark:hover:bg-sky-900/50",
|
|
52
|
+
underlined: "bg-transparent text-sky-600 border-0 border-b-2 border-sky-500 px-0 rounded-none hover:text-sky-700 dark:text-sky-300 dark:border-sky-500/70 dark:hover:bg-sky-900/30"
|
|
57
53
|
},
|
|
58
54
|
success: {
|
|
59
55
|
solid: "bg-emerald-500 text-white border border-emerald-500 hover:bg-emerald-600",
|
|
60
56
|
sharp: "rounded-none bg-emerald-500 text-white border border-emerald-500 hover:bg-emerald-600",
|
|
61
|
-
outline: "bg-transparent text-emerald-600 border border-emerald-500 hover:bg-emerald-50",
|
|
62
|
-
ghost: "bg-emerald-100 text-emerald-700 border border-transparent hover:bg-emerald-200",
|
|
63
|
-
text: "bg-transparent text-emerald-600 border border-transparent hover:text-emerald-700",
|
|
64
|
-
filled: "bg-emerald-100 text-emerald-700 border border-emerald-200 hover:bg-emerald-200",
|
|
65
|
-
underlined: "bg-transparent text-emerald-600 border-0 border-b-2 border-emerald-500 px-0 rounded-none hover:text-emerald-700"
|
|
66
|
-
rounded: "bg-white text-emerald-700 border border-emerald-200 shadow-sm hover:bg-emerald-50"
|
|
57
|
+
outline: "bg-transparent text-emerald-600 border border-emerald-500 hover:bg-emerald-50 dark:text-emerald-300 dark:border-emerald-500/70 dark:hover:bg-emerald-900/30",
|
|
58
|
+
ghost: "bg-emerald-100 text-emerald-700 border border-transparent hover:bg-emerald-200 dark:bg-emerald-900/35 dark:text-emerald-200 dark:hover:bg-emerald-900/50",
|
|
59
|
+
text: "bg-transparent text-emerald-600 border border-transparent hover:text-emerald-700 dark:text-emerald-300 dark:hover:bg-emerald-900/30",
|
|
60
|
+
filled: "bg-emerald-100 text-emerald-700 border border-emerald-200 hover:bg-emerald-200 dark:bg-emerald-900/35 dark:text-emerald-200 dark:border-emerald-700/60 dark:hover:bg-emerald-900/50",
|
|
61
|
+
underlined: "bg-transparent text-emerald-600 border-0 border-b-2 border-emerald-500 px-0 rounded-none hover:text-emerald-700 dark:text-emerald-300 dark:border-emerald-500/70 dark:hover:bg-emerald-900/30"
|
|
67
62
|
},
|
|
68
63
|
warning: {
|
|
69
64
|
solid: "bg-amber-500 text-white border border-amber-500 hover:bg-amber-600",
|
|
70
65
|
sharp: "rounded-none bg-amber-500 text-white border border-amber-500 hover:bg-amber-600",
|
|
71
|
-
outline: "bg-transparent text-amber-700 border border-amber-500 hover:bg-amber-50",
|
|
72
|
-
ghost: "bg-amber-100 text-amber-800 border border-transparent hover:bg-amber-200",
|
|
73
|
-
text: "bg-transparent text-amber-700 border border-transparent hover:text-amber-800",
|
|
74
|
-
filled: "bg-amber-100 text-amber-800 border border-amber-200 hover:bg-amber-200",
|
|
75
|
-
underlined: "bg-transparent text-amber-700 border-0 border-b-2 border-amber-500 px-0 rounded-none hover:text-amber-800"
|
|
76
|
-
rounded: "bg-white text-amber-700 border border-amber-200 shadow-sm hover:bg-amber-50"
|
|
66
|
+
outline: "bg-transparent text-amber-700 border border-amber-500 hover:bg-amber-50 dark:text-amber-300 dark:border-amber-500/70 dark:hover:bg-amber-900/30",
|
|
67
|
+
ghost: "bg-amber-100 text-amber-800 border border-transparent hover:bg-amber-200 dark:bg-amber-900/35 dark:text-amber-200 dark:hover:bg-amber-900/50",
|
|
68
|
+
text: "bg-transparent text-amber-700 border border-transparent hover:text-amber-800 dark:text-amber-300 dark:hover:bg-amber-900/30",
|
|
69
|
+
filled: "bg-amber-100 text-amber-800 border border-amber-200 hover:bg-amber-200 dark:bg-amber-900/35 dark:text-amber-200 dark:border-amber-700/60 dark:hover:bg-amber-900/50",
|
|
70
|
+
underlined: "bg-transparent text-amber-700 border-0 border-b-2 border-amber-500 px-0 rounded-none hover:text-amber-800 dark:text-amber-300 dark:border-amber-500/70 dark:hover:bg-amber-900/30"
|
|
77
71
|
},
|
|
78
72
|
danger: {
|
|
79
73
|
solid: "bg-red-500 text-white border border-red-500 hover:bg-red-600",
|
|
80
74
|
sharp: "rounded-none bg-red-500 text-white border border-red-500 hover:bg-red-600",
|
|
81
|
-
outline: "bg-transparent text-red-600 border border-red-500 hover:bg-red-50",
|
|
82
|
-
ghost: "bg-red-100 text-red-700 border border-transparent hover:bg-red-200",
|
|
83
|
-
text: "bg-transparent text-red-600 border border-transparent hover:text-red-700",
|
|
84
|
-
filled: "bg-red-100 text-red-700 border border-red-200 hover:bg-red-200",
|
|
85
|
-
underlined: "bg-transparent text-red-600 border-0 border-b-2 border-red-500 px-0 rounded-none hover:text-red-700"
|
|
86
|
-
rounded: "bg-white text-red-600 border border-red-200 shadow-sm hover:bg-red-50"
|
|
75
|
+
outline: "bg-transparent text-red-600 border border-red-500 hover:bg-red-50 dark:text-red-300 dark:border-red-500/70 dark:hover:bg-red-900/30",
|
|
76
|
+
ghost: "bg-red-100 text-red-700 border border-transparent hover:bg-red-200 dark:bg-red-900/35 dark:text-red-200 dark:hover:bg-red-900/50",
|
|
77
|
+
text: "bg-transparent text-red-600 border border-transparent hover:text-red-700 dark:text-red-300 dark:hover:bg-red-900/30",
|
|
78
|
+
filled: "bg-red-100 text-red-700 border border-red-200 hover:bg-red-200 dark:bg-red-900/35 dark:text-red-200 dark:border-red-700/60 dark:hover:bg-red-900/50",
|
|
79
|
+
underlined: "bg-transparent text-red-600 border-0 border-b-2 border-red-500 px-0 rounded-none hover:text-red-700 dark:text-red-300 dark:border-red-500/70 dark:hover:bg-red-900/30"
|
|
87
80
|
},
|
|
88
81
|
surface: {
|
|
89
|
-
solid: "bg-white text-gray-900 border border-gray-200 hover:bg-gray-50",
|
|
90
|
-
sharp: "rounded-none bg-white text-gray-900 border border-gray-200 hover:bg-gray-50",
|
|
91
|
-
outline: "bg-transparent text-gray-900 border border-gray-300 hover:bg-gray-50",
|
|
92
|
-
ghost: "bg-gray-100 text-gray-900 border border-transparent hover:bg-gray-200",
|
|
93
|
-
text: "bg-transparent text-gray-900 border border-transparent hover:text-gray-600",
|
|
94
|
-
filled: "bg-gray-50 text-gray-900 border border-gray-200 hover:bg-white",
|
|
95
|
-
underlined: "bg-transparent text-gray-900 border-0 border-b-2 border-gray-400 px-0 rounded-none hover:text-gray-600"
|
|
96
|
-
rounded: "bg-white text-gray-900 border border-gray-200 shadow-sm hover:bg-gray-50"
|
|
82
|
+
solid: "bg-white text-gray-900 border border-gray-200 hover:bg-gray-50 dark:bg-gray-900 dark:text-gray-100 dark:border-gray-700 dark:hover:bg-gray-800",
|
|
83
|
+
sharp: "rounded-none bg-white text-gray-900 border border-gray-200 hover:bg-gray-50 dark:bg-gray-900 dark:text-gray-100 dark:border-gray-700 dark:hover:bg-gray-800",
|
|
84
|
+
outline: "bg-transparent text-gray-900 border border-gray-300 hover:bg-gray-50 dark:text-gray-100 dark:border-gray-600 dark:hover:bg-gray-800",
|
|
85
|
+
ghost: "bg-gray-100 text-gray-900 border border-transparent hover:bg-gray-200 dark:bg-gray-800 dark:text-gray-100 dark:hover:bg-gray-700",
|
|
86
|
+
text: "bg-transparent text-gray-900 border border-transparent hover:text-gray-600 dark:text-gray-100 dark:hover:bg-gray-800",
|
|
87
|
+
filled: "bg-gray-50 text-gray-900 border border-gray-200 hover:bg-white dark:bg-gray-800 dark:text-gray-100 dark:border-gray-700 dark:hover:bg-gray-700",
|
|
88
|
+
underlined: "bg-transparent text-gray-900 border-0 border-b-2 border-gray-400 px-0 rounded-none hover:text-gray-600 dark:text-gray-100 dark:border-gray-600 dark:hover:bg-gray-800"
|
|
97
89
|
},
|
|
98
90
|
bw: blackAndWhitePaletteClasses
|
|
99
91
|
};
|
|
@@ -159,7 +151,7 @@ var Chip = react.forwardRef(
|
|
|
159
151
|
const sizeClass = chipSizeClasses[size] ?? chipSizeClasses.medium;
|
|
160
152
|
const pillClass = pill ? "rounded-full" : "rounded-lg";
|
|
161
153
|
const cursorClass = disabled ? "pointer-events-none opacity-50" : isInteractive ? "cursor-pointer" : "cursor-default";
|
|
162
|
-
const selectedClass = selected ? "ring-2 ring-current/50 ring-offset-2 ring-offset-white" : void 0;
|
|
154
|
+
const selectedClass = selected ? "ring-2 ring-current/50 ring-offset-2 ring-offset-white dark:ring-offset-gray-900" : void 0;
|
|
163
155
|
const resolvedRole = disabled ? role : role ?? (isInteractive ? "button" : void 0);
|
|
164
156
|
const resolvedTabIndex = disabled ? -1 : tabIndex ?? (isInteractive ? 0 : void 0);
|
|
165
157
|
const prependIconClassName = resolveIconClassName(prependIcon);
|
package/dist/chip.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/globals.ts","../src/Containment/Chip/states.chip.ts","../src/Containment/Chip/index.tsx"],"names":["normalized","forwardRef","jsx","jsxs","twMerge"],"mappings":"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","file":"chip.cjs","sourcesContent":["export const iconBaseClasses = {\n mdi: ['mdi']\n} as const;\n","import { iconBaseClasses } from '@lindle/linoardo/globals';\nimport { Palette, PropIcon } from '@lindle/linoardo/global.types';\nimport { ChipSize, ChipVariant } from './types.chip';\n\nexport const chipBaseClasses =\n 'inline-flex items-center gap-1.5 border font-medium leading-tight transition-all duration-200 select-none focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/40 focus-visible:ring-offset-2';\n\nexport const chipSizeClasses: Record<ChipSize, string> = {\n small: 'text-xs px-3 py-1 min-h-[1.5rem]',\n medium: 'text-sm px-4 py-1.5 min-h-[2rem]',\n large: 'text-base px-5 py-2 min-h-[2.5rem]'\n};\n\nexport const closeButtonClasses =\n 'ml-1 flex h-5 w-5 shrink-0 items-center justify-center rounded-full border border-transparent text-current/70 transition-colors duration-200 hover:bg-current/10 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-current/30 focus-visible:ring-offset-2';\n\nconst blackAndWhitePaletteClasses = {\n solid: 'bg-black text-white border border-black hover:bg-black/90 focus-visible:ring-black/40 focus-visible:ring-offset-white',\n outline:\n 'bg-white text-black border-2 border-black hover:bg-black hover:text-white focus-visible:ring-black/40 focus-visible:ring-offset-white',\n ghost:\n 'bg-neutral-200 text-black border border-transparent hover:bg-neutral-300 focus-visible:ring-black/20',\n text:\n 'bg-transparent text-black border border-transparent hover:bg-neutral-200 focus-visible:ring-black/20',\n filled:\n 'bg-black/10 text-black border border-black/30 hover:bg-black/20 focus-visible:ring-black/20',\n underlined:\n 'bg-transparent text-black border-0 border-b-2 border-black px-0 rounded-none hover:text-black/80 focus-visible:ring-black/20',\n rounded:\n 'rounded-full bg-white text-black border-2 border-black hover:bg-black hover:text-white focus-visible:ring-black/40 focus-visible:ring-offset-white',\n sharp:\n 'rounded-none bg-black text-white border border-black hover:bg-black/90 focus-visible:ring-black/40 focus-visible:ring-offset-white'\n} satisfies Record<ChipVariant, string>;\n\nconst paletteVariantClasses: Record<Palette, Record<ChipVariant, string>> = {\n primary: {\n solid: 'bg-primary text-white border border-primary hover:bg-primary/90',\n sharp: 'rounded-none bg-primary text-white border border-primary hover:bg-primary/90',\n outline: 'bg-transparent text-primary border border-primary hover:bg-primary/10',\n ghost: 'bg-primary/15 text-primary border border-transparent hover:bg-primary/25',\n text: 'bg-transparent text-primary border border-transparent hover:text-primary/80',\n filled: 'bg-primary/10 text-primary border border-primary/30 hover:bg-primary/20',\n underlined: 'bg-transparent text-primary border-0 border-b-2 border-primary px-0 rounded-none hover:text-primary/80',\n rounded: 'bg-white text-primary border border-primary/40 shadow-sm hover:bg-primary/5'\n },\n neutral: {\n solid: 'bg-gray-900 text-white border border-gray-900 hover:bg-gray-800',\n sharp: 'rounded-none bg-gray-900 text-white border border-gray-900 hover:bg-gray-800',\n outline: 'bg-transparent text-gray-900 border border-gray-500 hover:bg-gray-100',\n ghost: 'bg-gray-100 text-gray-900 border border-transparent hover:bg-gray-200',\n text: 'bg-transparent text-gray-900 border border-transparent hover:text-gray-700',\n filled: 'bg-gray-200 text-gray-900 border border-gray-300 hover:bg-gray-300',\n underlined: 'bg-transparent text-gray-900 border-0 border-b-2 border-gray-500 px-0 rounded-none hover:text-gray-700',\n rounded: 'bg-white text-gray-900 border border-gray-300 shadow-sm hover:bg-gray-100'\n },\n info: {\n solid: 'bg-sky-500 text-white border border-sky-500 hover:bg-sky-600',\n sharp: 'rounded-none bg-sky-500 text-white border border-sky-500 hover:bg-sky-600',\n outline: 'bg-transparent text-sky-600 border border-sky-500 hover:bg-sky-50',\n ghost: 'bg-sky-100 text-sky-700 border border-transparent hover:bg-sky-200',\n text: 'bg-transparent text-sky-600 border border-transparent hover:text-sky-700',\n filled: 'bg-sky-100 text-sky-700 border border-sky-200 hover:bg-sky-200',\n underlined: 'bg-transparent text-sky-600 border-0 border-b-2 border-sky-500 px-0 rounded-none hover:text-sky-700',\n rounded: 'bg-white text-sky-700 border border-sky-200 shadow-sm hover:bg-sky-50'\n },\n success: {\n solid: 'bg-emerald-500 text-white border border-emerald-500 hover:bg-emerald-600',\n sharp: 'rounded-none bg-emerald-500 text-white border border-emerald-500 hover:bg-emerald-600',\n outline: 'bg-transparent text-emerald-600 border border-emerald-500 hover:bg-emerald-50',\n ghost: 'bg-emerald-100 text-emerald-700 border border-transparent hover:bg-emerald-200',\n text: 'bg-transparent text-emerald-600 border border-transparent hover:text-emerald-700',\n filled: 'bg-emerald-100 text-emerald-700 border border-emerald-200 hover:bg-emerald-200',\n underlined:\n 'bg-transparent text-emerald-600 border-0 border-b-2 border-emerald-500 px-0 rounded-none hover:text-emerald-700',\n rounded: 'bg-white text-emerald-700 border border-emerald-200 shadow-sm hover:bg-emerald-50'\n },\n warning: {\n solid: 'bg-amber-500 text-white border border-amber-500 hover:bg-amber-600',\n sharp: 'rounded-none bg-amber-500 text-white border border-amber-500 hover:bg-amber-600',\n outline: 'bg-transparent text-amber-700 border border-amber-500 hover:bg-amber-50',\n ghost: 'bg-amber-100 text-amber-800 border border-transparent hover:bg-amber-200',\n text: 'bg-transparent text-amber-700 border border-transparent hover:text-amber-800',\n filled: 'bg-amber-100 text-amber-800 border border-amber-200 hover:bg-amber-200',\n underlined:\n 'bg-transparent text-amber-700 border-0 border-b-2 border-amber-500 px-0 rounded-none hover:text-amber-800',\n rounded: 'bg-white text-amber-700 border border-amber-200 shadow-sm hover:bg-amber-50'\n },\n danger: {\n solid: 'bg-red-500 text-white border border-red-500 hover:bg-red-600',\n sharp: 'rounded-none bg-red-500 text-white border border-red-500 hover:bg-red-600',\n outline: 'bg-transparent text-red-600 border border-red-500 hover:bg-red-50',\n ghost: 'bg-red-100 text-red-700 border border-transparent hover:bg-red-200',\n text: 'bg-transparent text-red-600 border border-transparent hover:text-red-700',\n filled: 'bg-red-100 text-red-700 border border-red-200 hover:bg-red-200',\n underlined: 'bg-transparent text-red-600 border-0 border-b-2 border-red-500 px-0 rounded-none hover:text-red-700',\n rounded: 'bg-white text-red-600 border border-red-200 shadow-sm hover:bg-red-50'\n },\n surface: {\n solid: 'bg-white text-gray-900 border border-gray-200 hover:bg-gray-50',\n sharp: 'rounded-none bg-white text-gray-900 border border-gray-200 hover:bg-gray-50',\n outline: 'bg-transparent text-gray-900 border border-gray-300 hover:bg-gray-50',\n ghost: 'bg-gray-100 text-gray-900 border border-transparent hover:bg-gray-200',\n text: 'bg-transparent text-gray-900 border border-transparent hover:text-gray-600',\n filled: 'bg-gray-50 text-gray-900 border border-gray-200 hover:bg-white',\n underlined: 'bg-transparent text-gray-900 border-0 border-b-2 border-gray-400 px-0 rounded-none hover:text-gray-600',\n rounded: 'bg-white text-gray-900 border border-gray-200 shadow-sm hover:bg-gray-50'\n },\n bw: blackAndWhitePaletteClasses\n};\n\nexport const resolveVariantClass = (variant: ChipVariant, palette: Palette) => {\n const variants = paletteVariantClasses[palette] ?? paletteVariantClasses.primary;\n return variants[variant] ?? variants.solid;\n};\n\nexport const resolveIconClassName = (icon?: PropIcon) => {\n if (!icon) {\n return undefined;\n }\n\n if (typeof icon === 'string') {\n const trimmed = icon.trim();\n if (!trimmed) {\n return undefined;\n }\n\n if (trimmed.includes(' ')) {\n return trimmed;\n }\n\n const normalized = trimmed.startsWith('mdi-') ? trimmed : `mdi-${trimmed}`;\n return ['mdi', normalized].join(' ');\n }\n\n const [library, providedName] = icon;\n const normalizedLibrary = library.trim();\n const baseClasses = iconBaseClasses[normalizedLibrary as keyof typeof iconBaseClasses] ?? [normalizedLibrary];\n const iconName = providedName.trim();\n if (!iconName) {\n return baseClasses.join(' ');\n }\n\n const normalized = iconName.startsWith('mdi-') ? iconName : `mdi-${iconName}`;\n return Array.from(new Set([...baseClasses, normalized])).join(' ');\n};\n","import { forwardRef } from 'react';\nimport type { KeyboardEvent, MouseEvent } from 'react';\nimport { twMerge } from 'tailwind-merge';\nimport type { ChipProps, ChipSize } from './types.chip';\nimport { chipBaseClasses, closeButtonClasses, resolveIconClassName, resolveVariantClass } from './states.chip';\n\nconst chipSizeClasses: Record<ChipSize, string> = {\n 'x-small': 'h-5 text-[0.65rem] px-1.5',\n small: 'h-6 text-xs px-2',\n medium: 'h-7 text-sm px-2.5',\n large: 'h-8 text-sm px-3',\n 'x-large': 'h-9 text-base px-3.5'\n};\n\n/**\n * Small pill or badge element with optional icons, filter/selection and close affordance.\n */\nconst Chip = forwardRef<HTMLSpanElement, ChipProps>(\n (\n {\n variant = 'solid',\n color = 'primary',\n interactive = false,\n size = 'medium',\n pill = true,\n selected = false,\n closable = false,\n closeIcon = 'mdi-close',\n onClose,\n filter = false,\n filterIcon = 'mdi-check-bold',\n prependIcon,\n appendIcon,\n disabled = false,\n className,\n children,\n ...rest\n },\n ref\n ) => {\n const { onClick, onKeyDown, role, tabIndex, ...nativeProps } = rest;\n const isInteractive = interactive || typeof onClick === 'function';\n\n const variantClass = resolveVariantClass(variant, color);\n const sizeClass = chipSizeClasses[size] ?? chipSizeClasses.medium;\n const pillClass = pill ? 'rounded-full' : 'rounded-lg';\n const cursorClass = disabled ? 'pointer-events-none opacity-50' : isInteractive ? 'cursor-pointer' : 'cursor-default';\n const selectedClass = selected ? 'ring-2 ring-current/50 ring-offset-2 ring-offset-white' : undefined;\n\n const resolvedRole = disabled ? role : role ?? (isInteractive ? 'button' : undefined);\n const resolvedTabIndex = disabled ? -1 : tabIndex ?? (isInteractive ? 0 : undefined);\n const prependIconClassName = resolveIconClassName(prependIcon);\n const appendIconClassName = resolveIconClassName(appendIcon);\n const closeIconClassName = resolveIconClassName(closeIcon);\n const filterIconClassName = filter && selected ? resolveIconClassName(filterIcon) : undefined;\n\n const handleClick = (event: MouseEvent<HTMLSpanElement>) => {\n if (disabled) {\n event.preventDefault();\n event.stopPropagation();\n return;\n }\n\n onClick?.(event);\n };\n\n const handleKeyDown = (event: KeyboardEvent<HTMLSpanElement>) => {\n onKeyDown?.(event);\n if (event.defaultPrevented || disabled || !isInteractive) {\n return;\n }\n\n if (event.key === 'Enter' || event.key === ' ') {\n event.preventDefault();\n (event.currentTarget as HTMLSpanElement).click();\n }\n };\n\n const handleCloseClick = (event: MouseEvent<HTMLButtonElement>) => {\n event.stopPropagation();\n if (disabled) {\n event.preventDefault();\n return;\n }\n onClose?.(event);\n };\n\n const handleCloseKeyDown = (event: KeyboardEvent<HTMLButtonElement>) => {\n if (event.key === ' ' || event.key === 'Enter') {\n event.stopPropagation();\n }\n };\n\n const renderableChildren = typeof children === 'string' || typeof children === 'number' ? <span className='truncate'>{children}</span> : children;\n\n const filterAdornment = filter ? (\n <span className='flex h-4 w-4 shrink-0 items-center justify-center rounded-full border border-current/30 text-[0.55rem]' aria-hidden>\n {filterIconClassName ? <i className={filterIconClassName} aria-hidden /> : null}\n </span>\n ) : null;\n\n return (\n <span\n {...nativeProps}\n ref={ref}\n role={resolvedRole}\n tabIndex={resolvedTabIndex}\n aria-disabled={disabled || undefined}\n aria-pressed={filter ? selected : undefined}\n data-selected={selected || undefined}\n className={twMerge(chipBaseClasses, sizeClass, pillClass, variantClass, cursorClass, selectedClass, className)}\n onClick={isInteractive ? handleClick : undefined}\n onKeyDown={isInteractive ? handleKeyDown : onKeyDown}\n >\n {filterAdornment}\n {prependIconClassName && <i className={twMerge('text-[1.125em] leading-none', prependIconClassName)} aria-hidden />}\n {renderableChildren}\n {appendIconClassName && <i className={twMerge('text-[1.125em] leading-none', appendIconClassName)} aria-hidden />}\n {closable && (\n <button\n type='button'\n disabled={disabled}\n aria-label='Remove chip'\n className={twMerge(closeButtonClasses)}\n onClick={handleCloseClick}\n onKeyDown={handleCloseKeyDown}\n >\n {closeIconClassName ? <i className={closeIconClassName} aria-hidden /> : <span aria-hidden>×</span>}\n </button>\n )}\n </span>\n );\n }\n);\n\nChip.displayName = 'Chip';\n\nexport type { ChipProps, ChipSize, ChipVariant } from './types.chip';\nexport default Chip;\n"]}
|
|
1
|
+
{"version":3,"sources":["../src/globals.ts","../src/Containment/Chip/states.chip.ts","../src/Containment/Chip/index.tsx"],"names":["normalized","forwardRef","jsx","jsxs","twMerge"],"mappings":"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","file":"chip.cjs","sourcesContent":["export const iconBaseClasses = {\n mdi: ['mdi']\n} as const;\n","import { iconBaseClasses } from '@lindle/linoardo/globals';\nimport { Palette, PropIcon } from '@lindle/linoardo/global.types';\nimport { ChipSize, ChipVariant } from './types.chip';\n\nexport const chipBaseClasses =\n 'inline-flex items-center gap-1.5 border font-medium leading-tight transition-all duration-200 select-none 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-gray-900';\n\nexport const chipSizeClasses: Record<ChipSize, string> = {\n 'x-small': 'text-[0.65rem] px-2 py-0.5 min-h-[1.25rem]',\n small: 'text-xs px-3 py-1 min-h-[1.5rem]',\n medium: 'text-sm px-4 py-1.5 min-h-[2rem]',\n large: 'text-base px-5 py-2 min-h-[2.5rem]',\n 'x-large': 'text-lg px-6 py-2.5 min-h-[2.75rem]'\n};\n\nexport const closeButtonClasses =\n 'ml-1 flex h-5 w-5 shrink-0 items-center justify-center rounded-full border border-transparent text-current/70 transition-colors duration-200 hover:bg-current/10 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-current/30 focus-visible:ring-offset-2 focus-visible:ring-offset-white dark:focus-visible:ring-offset-gray-900';\n\nconst blackAndWhitePaletteClasses = {\n solid: 'bg-black text-white border border-black hover:bg-black/90 focus-visible:ring-black/40 focus-visible:ring-offset-white dark:bg-white dark:text-black dark:border-white dark:hover:bg-white/90 dark:focus-visible:ring-white/40 dark:focus-visible:ring-offset-gray-900',\n outline:\n 'bg-white text-black border-2 border-black hover:bg-black hover:text-white focus-visible:ring-black/40 focus-visible:ring-offset-white dark:bg-transparent dark:text-white dark:border-white dark:hover:bg-white dark:hover:text-black dark:focus-visible:ring-white/40 dark:focus-visible:ring-offset-gray-900',\n ghost:\n 'bg-neutral-200 text-black border border-transparent hover:bg-neutral-300 focus-visible:ring-black/20 dark:bg-neutral-800 dark:text-white dark:hover:bg-neutral-700',\n text:\n 'bg-transparent text-black border border-transparent hover:bg-neutral-200 focus-visible:ring-black/20 dark:text-white dark:hover:bg-neutral-800',\n filled:\n 'bg-black/10 text-black border border-black/30 hover:bg-black/20 focus-visible:ring-black/20 dark:bg-white/10 dark:text-white dark:border-white/30 dark:hover:bg-white/20',\n underlined:\n 'bg-transparent text-black border-0 border-b-2 border-black px-0 rounded-none hover:text-black/80 focus-visible:ring-black/20 dark:text-white dark:border-white dark:hover:text-white/80',\n sharp:\n 'rounded-none bg-black text-white border border-black hover:bg-black/90 focus-visible:ring-black/40 focus-visible:ring-offset-white dark:bg-white dark:text-black dark:border-white dark:hover:bg-white/90 dark:focus-visible:ring-white/40 dark:focus-visible:ring-offset-gray-900'\n} satisfies Record<ChipVariant, string>;\n\nconst paletteVariantClasses: Record<Palette, Record<ChipVariant, string>> = {\n primary: {\n solid: 'bg-primary text-white border border-primary hover:bg-primary/90',\n sharp: 'rounded-none bg-primary text-white border border-primary hover:bg-primary/90',\n outline: 'bg-transparent text-primary border border-primary hover:bg-primary/10 dark:border-primary/60 dark:hover:bg-primary/20',\n ghost: 'bg-primary/15 text-primary border border-transparent hover:bg-primary/25 dark:bg-primary/25 dark:hover:bg-primary/35',\n text: 'bg-transparent text-primary border border-transparent hover:text-primary/80 dark:hover:bg-primary/15',\n filled: 'bg-primary/10 text-primary border border-primary/30 hover:bg-primary/20 dark:bg-primary/20 dark:border-primary/40 dark:hover:bg-primary/30',\n underlined: 'bg-transparent text-primary border-0 border-b-2 border-primary px-0 rounded-none hover:text-primary/80 dark:hover:bg-primary/15',\n },\n neutral: {\n solid: 'bg-gray-900 text-white border border-gray-900 hover:bg-gray-800',\n sharp: 'rounded-none bg-gray-900 text-white border border-gray-900 hover:bg-gray-800',\n outline: 'bg-transparent text-gray-900 border border-gray-500 hover:bg-gray-100 dark:text-gray-200 dark:border-gray-600 dark:hover:bg-gray-800',\n ghost: 'bg-gray-100 text-gray-900 border border-transparent hover:bg-gray-200 dark:bg-gray-800 dark:text-gray-100 dark:hover:bg-gray-700',\n text: 'bg-transparent text-gray-900 border border-transparent hover:text-gray-700 dark:text-gray-100 dark:hover:bg-gray-800',\n filled: 'bg-gray-200 text-gray-900 border border-gray-300 hover:bg-gray-300 dark:bg-gray-800 dark:text-gray-100 dark:border-gray-700 dark:hover:bg-gray-700',\n underlined: 'bg-transparent text-gray-900 border-0 border-b-2 border-gray-500 px-0 rounded-none hover:text-gray-700 dark:text-gray-100 dark:border-gray-600 dark:hover:bg-gray-800',\n },\n info: {\n solid: 'bg-sky-500 text-white border border-sky-500 hover:bg-sky-600',\n sharp: 'rounded-none bg-sky-500 text-white border border-sky-500 hover:bg-sky-600',\n outline: 'bg-transparent text-sky-600 border border-sky-500 hover:bg-sky-50 dark:text-sky-300 dark:border-sky-500/70 dark:hover:bg-sky-900/30',\n ghost: 'bg-sky-100 text-sky-700 border border-transparent hover:bg-sky-200 dark:bg-sky-900/35 dark:text-sky-200 dark:hover:bg-sky-900/50',\n text: 'bg-transparent text-sky-600 border border-transparent hover:text-sky-700 dark:text-sky-300 dark:hover:bg-sky-900/30',\n filled: 'bg-sky-100 text-sky-700 border border-sky-200 hover:bg-sky-200 dark:bg-sky-900/35 dark:text-sky-200 dark:border-sky-700/60 dark:hover:bg-sky-900/50',\n underlined: 'bg-transparent text-sky-600 border-0 border-b-2 border-sky-500 px-0 rounded-none hover:text-sky-700 dark:text-sky-300 dark:border-sky-500/70 dark:hover:bg-sky-900/30',\n },\n success: {\n solid: 'bg-emerald-500 text-white border border-emerald-500 hover:bg-emerald-600',\n sharp: 'rounded-none bg-emerald-500 text-white border border-emerald-500 hover:bg-emerald-600',\n outline: 'bg-transparent text-emerald-600 border border-emerald-500 hover:bg-emerald-50 dark:text-emerald-300 dark:border-emerald-500/70 dark:hover:bg-emerald-900/30',\n ghost: 'bg-emerald-100 text-emerald-700 border border-transparent hover:bg-emerald-200 dark:bg-emerald-900/35 dark:text-emerald-200 dark:hover:bg-emerald-900/50',\n text: 'bg-transparent text-emerald-600 border border-transparent hover:text-emerald-700 dark:text-emerald-300 dark:hover:bg-emerald-900/30',\n filled: 'bg-emerald-100 text-emerald-700 border border-emerald-200 hover:bg-emerald-200 dark:bg-emerald-900/35 dark:text-emerald-200 dark:border-emerald-700/60 dark:hover:bg-emerald-900/50',\n underlined:\n 'bg-transparent text-emerald-600 border-0 border-b-2 border-emerald-500 px-0 rounded-none hover:text-emerald-700 dark:text-emerald-300 dark:border-emerald-500/70 dark:hover:bg-emerald-900/30',\n },\n warning: {\n solid: 'bg-amber-500 text-white border border-amber-500 hover:bg-amber-600',\n sharp: 'rounded-none bg-amber-500 text-white border border-amber-500 hover:bg-amber-600',\n outline: 'bg-transparent text-amber-700 border border-amber-500 hover:bg-amber-50 dark:text-amber-300 dark:border-amber-500/70 dark:hover:bg-amber-900/30',\n ghost: 'bg-amber-100 text-amber-800 border border-transparent hover:bg-amber-200 dark:bg-amber-900/35 dark:text-amber-200 dark:hover:bg-amber-900/50',\n text: 'bg-transparent text-amber-700 border border-transparent hover:text-amber-800 dark:text-amber-300 dark:hover:bg-amber-900/30',\n filled: 'bg-amber-100 text-amber-800 border border-amber-200 hover:bg-amber-200 dark:bg-amber-900/35 dark:text-amber-200 dark:border-amber-700/60 dark:hover:bg-amber-900/50',\n underlined:\n 'bg-transparent text-amber-700 border-0 border-b-2 border-amber-500 px-0 rounded-none hover:text-amber-800 dark:text-amber-300 dark:border-amber-500/70 dark:hover:bg-amber-900/30',\n },\n danger: {\n solid: 'bg-red-500 text-white border border-red-500 hover:bg-red-600',\n sharp: 'rounded-none bg-red-500 text-white border border-red-500 hover:bg-red-600',\n outline: 'bg-transparent text-red-600 border border-red-500 hover:bg-red-50 dark:text-red-300 dark:border-red-500/70 dark:hover:bg-red-900/30',\n ghost: 'bg-red-100 text-red-700 border border-transparent hover:bg-red-200 dark:bg-red-900/35 dark:text-red-200 dark:hover:bg-red-900/50',\n text: 'bg-transparent text-red-600 border border-transparent hover:text-red-700 dark:text-red-300 dark:hover:bg-red-900/30',\n filled: 'bg-red-100 text-red-700 border border-red-200 hover:bg-red-200 dark:bg-red-900/35 dark:text-red-200 dark:border-red-700/60 dark:hover:bg-red-900/50',\n underlined: 'bg-transparent text-red-600 border-0 border-b-2 border-red-500 px-0 rounded-none hover:text-red-700 dark:text-red-300 dark:border-red-500/70 dark:hover:bg-red-900/30',\n },\n surface: {\n solid: 'bg-white text-gray-900 border border-gray-200 hover:bg-gray-50 dark:bg-gray-900 dark:text-gray-100 dark:border-gray-700 dark:hover:bg-gray-800',\n sharp: 'rounded-none bg-white text-gray-900 border border-gray-200 hover:bg-gray-50 dark:bg-gray-900 dark:text-gray-100 dark:border-gray-700 dark:hover:bg-gray-800',\n outline: 'bg-transparent text-gray-900 border border-gray-300 hover:bg-gray-50 dark:text-gray-100 dark:border-gray-600 dark:hover:bg-gray-800',\n ghost: 'bg-gray-100 text-gray-900 border border-transparent hover:bg-gray-200 dark:bg-gray-800 dark:text-gray-100 dark:hover:bg-gray-700',\n text: 'bg-transparent text-gray-900 border border-transparent hover:text-gray-600 dark:text-gray-100 dark:hover:bg-gray-800',\n filled: 'bg-gray-50 text-gray-900 border border-gray-200 hover:bg-white dark:bg-gray-800 dark:text-gray-100 dark:border-gray-700 dark:hover:bg-gray-700',\n underlined: 'bg-transparent text-gray-900 border-0 border-b-2 border-gray-400 px-0 rounded-none hover:text-gray-600 dark:text-gray-100 dark:border-gray-600 dark:hover:bg-gray-800',\n },\n bw: blackAndWhitePaletteClasses\n};\n\nexport const resolveVariantClass = (variant: ChipVariant, palette: Palette) => {\n const variants = paletteVariantClasses[palette] ?? paletteVariantClasses.primary;\n return variants[variant] ?? variants.solid;\n};\n\nexport const resolveIconClassName = (icon?: PropIcon) => {\n if (!icon) {\n return undefined;\n }\n\n if (typeof icon === 'string') {\n const trimmed = icon.trim();\n if (!trimmed) {\n return undefined;\n }\n\n if (trimmed.includes(' ')) {\n return trimmed;\n }\n\n const normalized = trimmed.startsWith('mdi-') ? trimmed : `mdi-${trimmed}`;\n return ['mdi', normalized].join(' ');\n }\n\n const [library, providedName] = icon;\n const normalizedLibrary = library.trim();\n const baseClasses = iconBaseClasses[normalizedLibrary as keyof typeof iconBaseClasses] ?? [normalizedLibrary];\n const iconName = providedName.trim();\n if (!iconName) {\n return baseClasses.join(' ');\n }\n\n const normalized = iconName.startsWith('mdi-') ? iconName : `mdi-${iconName}`;\n return Array.from(new Set([...baseClasses, normalized])).join(' ');\n};\n","import { forwardRef } from 'react';\nimport type { KeyboardEvent, MouseEvent } from 'react';\nimport { twMerge } from 'tailwind-merge';\nimport type { ChipProps, ChipSize } from './types.chip';\nimport { chipBaseClasses, closeButtonClasses, resolveIconClassName, resolveVariantClass } from './states.chip';\n\nconst chipSizeClasses: Record<ChipSize, string> = {\n 'x-small': 'h-5 text-[0.65rem] px-1.5',\n small: 'h-6 text-xs px-2',\n medium: 'h-7 text-sm px-2.5',\n large: 'h-8 text-sm px-3',\n 'x-large': 'h-9 text-base px-3.5'\n};\n\n/**\n * Small pill or badge element with optional icons, filter/selection and close affordance.\n */\nconst Chip = forwardRef<HTMLSpanElement, ChipProps>(\n (\n {\n variant = 'solid',\n color = 'primary',\n interactive = false,\n size = 'medium',\n pill = true,\n selected = false,\n closable = false,\n closeIcon = 'mdi-close',\n onClose,\n filter = false,\n filterIcon = 'mdi-check-bold',\n prependIcon,\n appendIcon,\n disabled = false,\n className,\n children,\n ...rest\n },\n ref\n ) => {\n const { onClick, onKeyDown, role, tabIndex, ...nativeProps } = rest;\n const isInteractive = interactive || typeof onClick === 'function';\n\n const variantClass = resolveVariantClass(variant, color);\n const sizeClass = chipSizeClasses[size] ?? chipSizeClasses.medium;\n const pillClass = pill ? 'rounded-full' : 'rounded-lg';\n const cursorClass = disabled ? 'pointer-events-none opacity-50' : isInteractive ? 'cursor-pointer' : 'cursor-default';\n const selectedClass = selected ? 'ring-2 ring-current/50 ring-offset-2 ring-offset-white dark:ring-offset-gray-900' : undefined;\n\n const resolvedRole = disabled ? role : role ?? (isInteractive ? 'button' : undefined);\n const resolvedTabIndex = disabled ? -1 : tabIndex ?? (isInteractive ? 0 : undefined);\n const prependIconClassName = resolveIconClassName(prependIcon);\n const appendIconClassName = resolveIconClassName(appendIcon);\n const closeIconClassName = resolveIconClassName(closeIcon);\n const filterIconClassName = filter && selected ? resolveIconClassName(filterIcon) : undefined;\n\n const handleClick = (event: MouseEvent<HTMLSpanElement>) => {\n if (disabled) {\n event.preventDefault();\n event.stopPropagation();\n return;\n }\n\n onClick?.(event);\n };\n\n const handleKeyDown = (event: KeyboardEvent<HTMLSpanElement>) => {\n onKeyDown?.(event);\n if (event.defaultPrevented || disabled || !isInteractive) {\n return;\n }\n\n if (event.key === 'Enter' || event.key === ' ') {\n event.preventDefault();\n (event.currentTarget as HTMLSpanElement).click();\n }\n };\n\n const handleCloseClick = (event: MouseEvent<HTMLButtonElement>) => {\n event.stopPropagation();\n if (disabled) {\n event.preventDefault();\n return;\n }\n onClose?.(event);\n };\n\n const handleCloseKeyDown = (event: KeyboardEvent<HTMLButtonElement>) => {\n if (event.key === ' ' || event.key === 'Enter') {\n event.stopPropagation();\n }\n };\n\n const renderableChildren = typeof children === 'string' || typeof children === 'number' ? <span className='truncate'>{children}</span> : children;\n\n const filterAdornment = filter ? (\n <span className='flex h-4 w-4 shrink-0 items-center justify-center rounded-full border border-current/30 text-[0.55rem]' aria-hidden>\n {filterIconClassName ? <i className={filterIconClassName} aria-hidden /> : null}\n </span>\n ) : null;\n\n return (\n <span\n {...nativeProps}\n ref={ref}\n role={resolvedRole}\n tabIndex={resolvedTabIndex}\n aria-disabled={disabled || undefined}\n aria-pressed={filter ? selected : undefined}\n data-selected={selected || undefined}\n className={twMerge(chipBaseClasses, sizeClass, pillClass, variantClass, cursorClass, selectedClass, className)}\n onClick={isInteractive ? handleClick : undefined}\n onKeyDown={isInteractive ? handleKeyDown : onKeyDown}\n >\n {filterAdornment}\n {prependIconClassName && <i className={twMerge('text-[1.125em] leading-none', prependIconClassName)} aria-hidden />}\n {renderableChildren}\n {appendIconClassName && <i className={twMerge('text-[1.125em] leading-none', appendIconClassName)} aria-hidden />}\n {closable && (\n <button\n type='button'\n disabled={disabled}\n aria-label='Remove chip'\n className={twMerge(closeButtonClasses)}\n onClick={handleCloseClick}\n onKeyDown={handleCloseKeyDown}\n >\n {closeIconClassName ? <i className={closeIconClassName} aria-hidden /> : <span aria-hidden>×</span>}\n </button>\n )}\n </span>\n );\n }\n);\n\nChip.displayName = 'Chip';\n\nexport type { ChipProps, ChipSize, ChipVariant } from './types.chip';\nexport default Chip;\n"]}
|
package/dist/chip.d.cts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { b as GlobalVariant, G as GlobalSize, a as Palette, P as PropIcon } from './global.types-
|
|
1
|
+
import { b as GlobalVariant, G as GlobalSize, a as Palette, P as PropIcon } from './global.types-CjO3VRWu.cjs';
|
|
2
2
|
import * as react from 'react';
|
|
3
3
|
|
|
4
4
|
type ChipVariant = GlobalVariant;
|
package/dist/chip.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { b as GlobalVariant, G as GlobalSize, a as Palette, P as PropIcon } from './global.types-
|
|
1
|
+
import { b as GlobalVariant, G as GlobalSize, a as Palette, P as PropIcon } from './global.types-CjO3VRWu.js';
|
|
2
2
|
import * as react from 'react';
|
|
3
3
|
|
|
4
4
|
type ChipVariant = GlobalVariant;
|
package/dist/chip.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
export { Chip_default as default } from './chunk-
|
|
2
|
-
import './chunk-
|
|
1
|
+
export { Chip_default as default } from './chunk-KVXZEMAH.js';
|
|
2
|
+
import './chunk-HGECC2JH.js';
|
|
3
3
|
import './chunk-IEILIKS2.js';
|
|
4
4
|
//# sourceMappingURL=chip.js.map
|
|
5
5
|
//# sourceMappingURL=chip.js.map
|
|
@@ -21,7 +21,6 @@ var variantClasses = {
|
|
|
21
21
|
ghost: "rounded-xl bg-white/20 backdrop-opacity-5 border border-white/20 dark:bg-slate-900/30 dark:border-white/10",
|
|
22
22
|
filled: "rounded-xl bg-white/60 backdrop-opacity-5 border border-white/40 dark:bg-slate-900/70 dark:border-white/15",
|
|
23
23
|
underlined: "rounded-xl bg-white/20 backdrop-opacity-5 border-b border-white/40 dark:bg-slate-900/30 dark:border-white/20",
|
|
24
|
-
rounded: "rounded-3xl bg-white/40 backdrop-opacity-5 border border-white/30 dark:bg-slate-900/50 dark:border-white/10",
|
|
25
24
|
sharp: "rounded-none bg-white/40 backdrop-opacity-5 border border-white/30 dark:bg-slate-900/50 dark:border-white/10"
|
|
26
25
|
};
|
|
27
26
|
var Block = React.forwardRef(function Block2({ className, variant = "solid", blur = "sm", interactive = false, children, ...rest }, ref) {
|
|
@@ -44,5 +43,5 @@ Block.displayName = "Block";
|
|
|
44
43
|
var Block_default = Block;
|
|
45
44
|
|
|
46
45
|
export { Block_default };
|
|
47
|
-
//# sourceMappingURL=chunk-
|
|
48
|
-
//# sourceMappingURL=chunk-
|
|
46
|
+
//# sourceMappingURL=chunk-4NKKWBMP.js.map
|
|
47
|
+
//# sourceMappingURL=chunk-4NKKWBMP.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/Blocks/Block/index.tsx"],"names":["Block"],"mappings":";;;;;AAKA,IAAM,SAAA,GAAY,uEAAA;AAElB,IAAM,WAAA,GAAyC;AAAA,EAC7C,IAAA,EAAM,oBAAA;AAAA,EACN,EAAA,EAAI,kBAAA;AAAA,EACJ,IAAA,EAAM,eAAA;AAAA,EACN,EAAA,EAAI,kBAAA;AAAA,EACJ,EAAA,EAAI,kBAAA;AAAA,EACJ,EAAA,EAAI,kBAAA;AAAA,EACJ,KAAA,EAAO,mBAAA;AAAA,EACP,KAAA,EAAO;AACT,CAAA;AAEA,IAAM,cAAA,GAAgD;AAAA,EACpD,KAAA,EACE,4GAAA;AAAA,EACF,OAAA,EACE,4GAAA;AAAA,EACF,IAAA,EAAM,qDAAA;AAAA,EACN,KAAA,EACE,4GAAA;AAAA,EACF,MAAA,EACE,4GAAA;AAAA,EACF,UAAA,EACE,8GAAA;AAAA,EACF,KAAA,EACE;AACJ,CAAA;AAKA,IAAM,QAAc,KAAA,CAAA,UAAA,CAAuC,SAASA,MAAAA,CAClE,EAAE,WAAW,OAAA,GAAU,OAAA,EAAS,IAAA,GAAO,IAAA,EAAM,cAAc,KAAA,EAAO,QAAA,EAAU,GAAG,IAAA,IAC/E,GAAA,EACA;AACA,EAAA,MAAM,YAAA,GAAe,cAAA,CAAe,OAAO,CAAA,IAAK,cAAA,CAAe,KAAA;AAC/D,EAAA,MAAM,SAAA,GAAY,WAAA,CAAY,IAAI,CAAA,IAAK,WAAA,CAAY,EAAA;AACnD,EAAA,MAAM,gBAAA,GAAmB,cACrB,uPAAA,GACA,MAAA;AACJ,EAAA,MAAM,gBAAgB,WAAA,IAAe,IAAA,CAAK,QAAA,KAAa,MAAA,GAAY,IAAI,IAAA,CAAK,QAAA;AAE5E,EAAA,uBACE,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACE,GAAG,IAAA;AAAA,MACJ,GAAA;AAAA,MACA,QAAA,EAAU,aAAA;AAAA,MACV,WAAW,OAAA,CAAQ,SAAA,EAAW,cAAc,SAAA,EAAW,KAAA,EAAO,kBAAkB,SAAS,CAAA;AAAA,MAExF;AAAA;AAAA,GACH;AAEJ,CAAC,CAAA;AAED,KAAA,CAAM,WAAA,GAAc,OAAA;AAIpB,IAAO,aAAA,GAAQ","file":"chunk-4NKKWBMP.js","sourcesContent":["import * as React from 'react';\nimport type { GlobalVariant } from '@lindle/linoardo/global.types';\nimport { twMerge } from 'tailwind-merge';\nimport type { BlockBlur, BlockProps } from './types.block';\n\nconst blockBase = 'block-base relative overflow-hidden text-gray-900 dark:text-slate-100';\n\nconst blurClasses: Record<BlockBlur, string> = {\n none: 'backdrop-blur-none',\n sm: 'backdrop-blur-sm',\n base: 'backdrop-blur',\n md: 'backdrop-blur-md',\n lg: 'backdrop-blur-lg',\n xl: 'backdrop-blur-xl',\n '2xl': 'backdrop-blur-2xl',\n '3xl': 'backdrop-blur-3xl'\n};\n\nconst variantClasses: Record<GlobalVariant, string> = {\n solid:\n 'rounded-xl bg-white/40 backdrop-opacity-5 border border-white/30 dark:bg-slate-900/50 dark:border-white/10',\n outline:\n 'rounded-xl bg-white/10 backdrop-opacity-5 border border-white/60 dark:bg-slate-900/30 dark:border-white/20',\n text: 'rounded-xl bg-transparent border border-transparent',\n ghost:\n 'rounded-xl bg-white/20 backdrop-opacity-5 border border-white/20 dark:bg-slate-900/30 dark:border-white/10',\n filled:\n 'rounded-xl bg-white/60 backdrop-opacity-5 border border-white/40 dark:bg-slate-900/70 dark:border-white/15',\n underlined:\n 'rounded-xl bg-white/20 backdrop-opacity-5 border-b border-white/40 dark:bg-slate-900/30 dark:border-white/20',\n sharp:\n 'rounded-none bg-white/40 backdrop-opacity-5 border border-white/30 dark:bg-slate-900/50 dark:border-white/10'\n};\n\n/**\n * Glass-like block container with blur and shared variant styling.\n */\nconst Block = React.forwardRef<HTMLDivElement, BlockProps>(function Block(\n { className, variant = 'solid', blur = 'sm', interactive = false, children, ...rest },\n ref\n) {\n const variantClass = variantClasses[variant] ?? variantClasses.solid;\n const blurClass = blurClasses[blur] ?? blurClasses.sm;\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\n return (\n <div\n {...rest}\n ref={ref}\n tabIndex={tabIndexValue}\n className={twMerge(blockBase, variantClass, blurClass, 'p-2', interactiveClass, className)}\n >\n {children}\n </div>\n );\n});\n\nBlock.displayName = 'Block';\n\nexport type { BlockProps, BlockBlur };\n\nexport default Block;\n"]}
|
|
@@ -3,14 +3,13 @@ import { jsxs, jsx } from 'react/jsx-runtime';
|
|
|
3
3
|
|
|
4
4
|
// src/Blocks/Hero/index.tsx
|
|
5
5
|
var containerVariants = {
|
|
6
|
-
solid: "bg-gradient-to-br from-primary via-primary/90 to-indigo-600 text-white shadow-2xl shadow-primary/30",
|
|
7
|
-
outline: "border border-gray-200 bg-white text-gray-900",
|
|
8
|
-
text: "bg-transparent text-gray-900",
|
|
9
|
-
ghost: "bg-primary/5 text-gray-900 border border-primary/10",
|
|
10
|
-
filled: "bg-slate-900 text-white shadow-2xl shadow-slate-900/40",
|
|
11
|
-
underlined: "border-b-4 border-primary/70 bg-white text-gray-900",
|
|
12
|
-
|
|
13
|
-
sharp: "rounded-none border border-gray-200 bg-white text-gray-900 shadow"
|
|
6
|
+
solid: "bg-gradient-to-br from-primary via-primary/90 to-indigo-600 text-white shadow-2xl shadow-primary/30 dark:from-primary dark:via-primary/90 dark:to-indigo-700",
|
|
7
|
+
outline: "border border-gray-200 bg-white text-gray-900 dark:border-gray-700 dark:bg-gray-900 dark:text-gray-100",
|
|
8
|
+
text: "bg-transparent text-gray-900 dark:text-gray-100",
|
|
9
|
+
ghost: "bg-primary/5 text-gray-900 border border-primary/10 dark:bg-primary/15 dark:text-gray-100 dark:border-primary/25",
|
|
10
|
+
filled: "bg-slate-900 text-white shadow-2xl shadow-slate-900/40 dark:bg-slate-950",
|
|
11
|
+
underlined: "border-b-4 border-primary/70 bg-white text-gray-900 dark:bg-gray-900 dark:text-gray-100 dark:border-primary/60",
|
|
12
|
+
sharp: "rounded-none border border-gray-200 bg-white text-gray-900 shadow dark:border-gray-700 dark:bg-gray-900 dark:text-gray-100"
|
|
14
13
|
};
|
|
15
14
|
var frameRadii = {
|
|
16
15
|
solid: "rounded-3xl",
|
|
@@ -19,18 +18,16 @@ var frameRadii = {
|
|
|
19
18
|
ghost: "rounded-2xl",
|
|
20
19
|
filled: "rounded-3xl",
|
|
21
20
|
underlined: "rounded-2xl",
|
|
22
|
-
rounded: "rounded-3xl",
|
|
23
21
|
sharp: "rounded-none"
|
|
24
22
|
};
|
|
25
23
|
var badgeVariants = {
|
|
26
24
|
solid: "bg-white/10 text-white border border-white/20",
|
|
27
|
-
outline: "bg-primary/10 text-primary border border-primary/20",
|
|
28
|
-
text: "bg-primary/10 text-primary border border-primary/20",
|
|
29
|
-
ghost: "bg-primary/15 text-primary border border-primary/25",
|
|
25
|
+
outline: "bg-primary/10 text-primary border border-primary/20 dark:bg-primary/20 dark:border-primary/35",
|
|
26
|
+
text: "bg-primary/10 text-primary border border-primary/20 dark:bg-primary/20 dark:border-primary/35",
|
|
27
|
+
ghost: "bg-primary/15 text-primary border border-primary/25 dark:bg-primary/20 dark:border-primary/35",
|
|
30
28
|
filled: "bg-white/10 text-white border border-white/20",
|
|
31
|
-
underlined: "bg-primary/10 text-primary border border-primary/20",
|
|
32
|
-
|
|
33
|
-
sharp: "bg-primary/10 text-primary border border-primary/20"
|
|
29
|
+
underlined: "bg-primary/10 text-primary border border-primary/20 dark:bg-primary/20 dark:border-primary/35",
|
|
30
|
+
sharp: "bg-primary/10 text-primary border border-primary/20 dark:bg-primary/20 dark:border-primary/35"
|
|
34
31
|
};
|
|
35
32
|
var Hero = ({
|
|
36
33
|
title,
|
|
@@ -54,12 +51,12 @@ var Hero = ({
|
|
|
54
51
|
badgeVariants[variant] ?? badgeVariants.solid
|
|
55
52
|
);
|
|
56
53
|
const isDark = variant === "solid" || variant === "filled";
|
|
57
|
-
const subdued = isDark ? "text-white/80" : "text-gray-600";
|
|
58
|
-
const statMuted = isDark ? "text-white/70" : "text-gray-500";
|
|
59
|
-
const actionPrimary = isDark ? "bg-white text-gray-900 hover:bg-white/90 focus-visible:outline-white/70" : "bg-primary text-white hover:bg-primary/90 focus-visible:outline-primary/50";
|
|
60
|
-
const actionSecondary = isDark ? "border border-white/40 text-white hover:bg-white/10 focus-visible:outline-white/60" : "border border-gray-300 text-gray-900 hover:border-primary/60 hover:text-primary focus-visible:outline-primary/50";
|
|
54
|
+
const subdued = isDark ? "text-white/80" : "text-gray-600 dark:text-gray-300";
|
|
55
|
+
const statMuted = isDark ? "text-white/70" : "text-gray-500 dark:text-gray-400";
|
|
56
|
+
const actionPrimary = isDark ? "bg-white text-gray-900 hover:bg-white/90 focus-visible:outline-white/70" : "bg-primary text-white hover:bg-primary/90 focus-visible:outline-primary/50 dark:bg-primary/90 dark:hover:bg-primary";
|
|
57
|
+
const actionSecondary = isDark ? "border border-white/40 text-white hover:bg-white/10 focus-visible:outline-white/60" : "border border-gray-300 text-gray-900 hover:border-primary/60 hover:text-primary focus-visible:outline-primary/50 dark:border-gray-600 dark:text-gray-100 dark:hover:border-primary/60 dark:hover:text-primary";
|
|
61
58
|
const frameRadius = frameRadii[variant] ?? "rounded-2xl";
|
|
62
|
-
const frameDecoration = isDark ? "border-white/10 bg-white/10 shadow-2xl shadow-black/20" : "border-gray-200 bg-white shadow-2xl shadow-gray-200/60";
|
|
59
|
+
const frameDecoration = isDark ? "border-white/10 bg-white/10 shadow-2xl shadow-black/20" : "border-gray-200 bg-white shadow-2xl shadow-gray-200/60 dark:border-gray-700 dark:bg-gray-900 dark:shadow-black/30";
|
|
63
60
|
const renderAction = (action, index) => {
|
|
64
61
|
const { href, label, onClick, variant: actionVariant = "primary" } = action;
|
|
65
62
|
const Component = href ? "a" : "button";
|
|
@@ -80,8 +77,8 @@ var Hero = ({
|
|
|
80
77
|
};
|
|
81
78
|
return /* @__PURE__ */ jsxs("section", { ...rest, className: containerClass, children: [
|
|
82
79
|
/* @__PURE__ */ jsxs("div", { className: "pointer-events-none absolute inset-0 overflow-hidden", children: [
|
|
83
|
-
/* @__PURE__ */ jsx("div", { className: "absolute left-24 top-10 h-64 w-64 rounded-full bg-primary/15 blur-3xl" }),
|
|
84
|
-
/* @__PURE__ */ jsx("div", { className: "absolute -right-16 -bottom-10 h-80 w-80 rounded-full bg-primary/20 blur-3xl" })
|
|
80
|
+
/* @__PURE__ */ jsx("div", { className: "absolute left-24 top-10 h-64 w-64 rounded-full bg-primary/15 dark:bg-primary/25 blur-3xl" }),
|
|
81
|
+
/* @__PURE__ */ jsx("div", { className: "absolute -right-16 -bottom-10 h-80 w-80 rounded-full bg-primary/20 dark:bg-primary/30 blur-3xl" })
|
|
85
82
|
] }),
|
|
86
83
|
/* @__PURE__ */ jsxs("div", { className: "mx-auto flex max-w-6xl flex-col gap-12 px-6 py-16 lg:px-10 lg:py-24", children: [
|
|
87
84
|
/* @__PURE__ */ jsxs("div", { className: "grid items-center gap-12 lg:grid-cols-2", children: [
|
|
@@ -92,7 +89,7 @@ var Hero = ({
|
|
|
92
89
|
{
|
|
93
90
|
className: twMerge(
|
|
94
91
|
"text-4xl font-semibold leading-tight sm:text-5xl",
|
|
95
|
-
isDark ? "text-white" : "text-gray-900"
|
|
92
|
+
isDark ? "text-white" : "text-gray-900 dark:text-gray-100"
|
|
96
93
|
),
|
|
97
94
|
children: title
|
|
98
95
|
}
|
|
@@ -100,7 +97,7 @@ var Hero = ({
|
|
|
100
97
|
description && /* @__PURE__ */ jsx("p", { className: twMerge("text-lg leading-relaxed", subdued), children: description }),
|
|
101
98
|
actions.length > 0 && /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-3", children: actions.map(renderAction) }),
|
|
102
99
|
stats.length > 0 && /* @__PURE__ */ jsx("dl", { className: "grid gap-6 sm:grid-cols-3", children: stats.map((stat) => /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
|
|
103
|
-
/* @__PURE__ */ jsx("dd", { className: twMerge("text-3xl font-semibold", isDark ? "text-white" : "text-gray-900"), children: stat.value }),
|
|
100
|
+
/* @__PURE__ */ jsx("dd", { className: twMerge("text-3xl font-semibold", isDark ? "text-white" : "text-gray-900 dark:text-gray-100"), children: stat.value }),
|
|
104
101
|
/* @__PURE__ */ jsx("dt", { className: twMerge("text-sm font-medium", statMuted), children: stat.label })
|
|
105
102
|
] }, stat.label)) })
|
|
106
103
|
] }),
|
|
@@ -137,5 +134,5 @@ Hero.displayName = "Hero";
|
|
|
137
134
|
var Hero_default = Hero;
|
|
138
135
|
|
|
139
136
|
export { Hero_default };
|
|
140
|
-
//# sourceMappingURL=chunk-
|
|
141
|
-
//# sourceMappingURL=chunk-
|
|
137
|
+
//# sourceMappingURL=chunk-7TQUULYB.js.map
|
|
138
|
+
//# sourceMappingURL=chunk-7TQUULYB.js.map
|