@lindle/linoardo 1.0.18 → 1.0.20
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/card.cjs +81 -19
- package/dist/card.cjs.map +1 -1
- package/dist/card.d.cts +8 -1
- package/dist/card.d.ts +8 -1
- package/dist/card.js +1 -1
- package/dist/chip.cjs +9 -1
- package/dist/chip.cjs.map +1 -1
- package/dist/chip.d.cts +3 -0
- package/dist/chip.d.ts +3 -0
- package/dist/chip.js +1 -1
- package/dist/chunk-36T6I3XH.js +167 -0
- package/dist/chunk-36T6I3XH.js.map +1 -0
- package/dist/{chunk-N65GNKRG.js → chunk-5LWU5T2C.js} +48 -42
- package/dist/chunk-5LWU5T2C.js.map +1 -0
- package/dist/{chunk-PWK6MLZT.js → chunk-5PBPURGP.js} +11 -3
- package/dist/chunk-5PBPURGP.js.map +1 -0
- package/dist/{chunk-XFPBICJG.js → chunk-5WQW6YSJ.js} +12 -3
- package/dist/chunk-5WQW6YSJ.js.map +1 -0
- package/dist/{chunk-5GY2JCBO.js → chunk-AK7LFJI4.js} +16 -5
- package/dist/chunk-AK7LFJI4.js.map +1 -0
- package/dist/chunk-B5FW33K3.js +147 -0
- package/dist/chunk-B5FW33K3.js.map +1 -0
- package/dist/{chunk-AOHXZ7OM.js → chunk-GMDNSU26.js} +19 -5
- package/dist/chunk-GMDNSU26.js.map +1 -0
- package/dist/chunk-HAXGOTZO.js +94 -0
- package/dist/chunk-HAXGOTZO.js.map +1 -0
- package/dist/chunk-HEXJCQRO.js +51 -0
- package/dist/chunk-HEXJCQRO.js.map +1 -0
- package/dist/{chunk-GA6HSRN6.js → chunk-KRYWWWXR.js} +20 -7
- package/dist/chunk-KRYWWWXR.js.map +1 -0
- package/dist/{chunk-U6NAIIDI.js → chunk-LIEBZOLG.js} +42 -20
- package/dist/chunk-LIEBZOLG.js.map +1 -0
- package/dist/{chunk-E32P5AHO.js → chunk-LYP7V32H.js} +10 -4
- package/dist/chunk-LYP7V32H.js.map +1 -0
- package/dist/chunk-MFLH36XK.js +168 -0
- package/dist/chunk-MFLH36XK.js.map +1 -0
- package/dist/{chunk-QGQ66FJD.js → chunk-T37VPLS4.js} +2 -2
- package/dist/chunk-T37VPLS4.js.map +1 -0
- package/dist/{chunk-32KFNI6K.js → chunk-U2AL7XFY.js} +48 -28
- package/dist/chunk-U2AL7XFY.js.map +1 -0
- package/dist/dialog.cjs +40 -18
- package/dist/dialog.cjs.map +1 -1
- package/dist/dialog.d.cts +3 -0
- package/dist/dialog.d.ts +3 -0
- package/dist/dialog.js +1 -1
- package/dist/expansion-panel/item.cjs +11 -2
- package/dist/expansion-panel/item.cjs.map +1 -1
- package/dist/expansion-panel/item.js +1 -1
- package/dist/expansion-panel.cjs +25 -6
- package/dist/expansion-panel.cjs.map +1 -1
- package/dist/expansion-panel.js +2 -2
- package/dist/icon.cjs +53 -0
- package/dist/icon.cjs.map +1 -0
- package/dist/icon.d.cts +15 -0
- package/dist/icon.d.ts +15 -0
- package/dist/icon.js +3 -0
- package/dist/icon.js.map +1 -0
- package/dist/{index-Md3BuoGM.d.cts → index-B5n8tN2G.d.cts} +3 -0
- package/dist/{index-d_JuI06O.d.ts → index-D4-O-oJt.d.ts} +3 -0
- package/dist/index.cjs +956 -149
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +64 -3
- package/dist/index.d.ts +64 -3
- package/dist/index.js +296 -12
- package/dist/index.js.map +1 -1
- package/dist/input.cjs +104 -30
- package/dist/input.cjs.map +1 -1
- package/dist/input.d.cts +8 -19
- package/dist/input.d.ts +8 -19
- package/dist/input.js +1 -1
- package/dist/list/item.cjs +10 -1
- package/dist/list/item.cjs.map +1 -1
- package/dist/list/item.d.cts +1 -1
- package/dist/list/item.d.ts +1 -1
- package/dist/list/item.js +1 -1
- package/dist/list.cjs +23 -3
- package/dist/list.cjs.map +1 -1
- package/dist/list.d.cts +5 -2
- package/dist/list.d.ts +5 -2
- package/dist/list.js +2 -2
- package/dist/masonry.cjs +116 -0
- package/dist/masonry.cjs.map +1 -0
- package/dist/masonry.d.cts +45 -0
- package/dist/masonry.d.ts +45 -0
- package/dist/masonry.js +3 -0
- package/dist/masonry.js.map +1 -0
- package/dist/menu.cjs.map +1 -1
- package/dist/menu.d.cts +3 -0
- package/dist/menu.d.ts +3 -0
- package/dist/menu.js +1 -1
- package/dist/select.cjs +173 -0
- package/dist/select.cjs.map +1 -0
- package/dist/select.d.cts +29 -0
- package/dist/select.d.ts +29 -0
- package/dist/select.js +3 -0
- package/dist/select.js.map +1 -0
- package/dist/slider.cjs +17 -3
- package/dist/slider.cjs.map +1 -1
- package/dist/slider.d.cts +3 -0
- package/dist/slider.d.ts +3 -0
- package/dist/slider.js +1 -1
- package/dist/styles.css +1096 -8
- package/dist/switch.cjs +46 -40
- package/dist/switch.cjs.map +1 -1
- package/dist/switch.d.cts +3 -0
- package/dist/switch.d.ts +3 -0
- package/dist/switch.js +1 -1
- package/dist/tooltip.cjs +46 -26
- package/dist/tooltip.cjs.map +1 -1
- package/dist/tooltip.d.cts +3 -0
- package/dist/tooltip.d.ts +3 -0
- package/dist/tooltip.js +1 -1
- package/dist/types-BCqIOkp1.d.cts +24 -0
- package/dist/types-ChXN4u7x.d.ts +24 -0
- package/package.json +29 -7
- package/readme.md +1 -0
- package/dist/chunk-32KFNI6K.js.map +0 -1
- package/dist/chunk-5GY2JCBO.js.map +0 -1
- package/dist/chunk-AOHXZ7OM.js.map +0 -1
- package/dist/chunk-E32P5AHO.js.map +0 -1
- package/dist/chunk-GA6HSRN6.js.map +0 -1
- package/dist/chunk-N65GNKRG.js.map +0 -1
- package/dist/chunk-PWK6MLZT.js.map +0 -1
- package/dist/chunk-PYG5SDNO.js +0 -98
- package/dist/chunk-PYG5SDNO.js.map +0 -1
- package/dist/chunk-QGQ66FJD.js.map +0 -1
- package/dist/chunk-U6NAIIDI.js.map +0 -1
- package/dist/chunk-V4BVJOSC.js +0 -85
- package/dist/chunk-V4BVJOSC.js.map +0 -1
- package/dist/chunk-XFPBICJG.js.map +0 -1
package/dist/input.cjs
CHANGED
|
@@ -1,8 +1,13 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
+
var React = require('react');
|
|
3
4
|
var tailwindMerge = require('tailwind-merge');
|
|
4
5
|
var jsxRuntime = require('react/jsx-runtime');
|
|
5
6
|
|
|
7
|
+
function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
|
|
8
|
+
|
|
9
|
+
var React__default = /*#__PURE__*/_interopDefault(React);
|
|
10
|
+
|
|
6
11
|
// src/Form/Input/index.tsx
|
|
7
12
|
|
|
8
13
|
// src/globals.ts
|
|
@@ -36,37 +41,49 @@ var resolveIconClassName = (icon) => {
|
|
|
36
41
|
const classes = [...baseClasses, normalizedName];
|
|
37
42
|
return Array.from(new Set(classes)).join(" ");
|
|
38
43
|
};
|
|
39
|
-
|
|
40
|
-
// src/utils/helpers/randomStr.ts
|
|
41
|
-
var characters = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
|
|
42
|
-
function generateString(length = 5) {
|
|
43
|
-
let result = "";
|
|
44
|
-
const charactersLength = characters.length;
|
|
45
|
-
for (let i = 0; i < length; i++) {
|
|
46
|
-
result += characters.charAt(Math.floor(Math.random() * charactersLength));
|
|
47
|
-
}
|
|
48
|
-
return result;
|
|
49
|
-
}
|
|
50
44
|
var Input = ({
|
|
51
45
|
variant = "outline",
|
|
46
|
+
size = "medium",
|
|
52
47
|
success,
|
|
53
48
|
error,
|
|
54
49
|
warn,
|
|
55
50
|
icon,
|
|
56
51
|
className,
|
|
57
52
|
wrapperClassName,
|
|
53
|
+
label,
|
|
58
54
|
...props
|
|
59
55
|
}) => {
|
|
60
|
-
const
|
|
56
|
+
const { placeholder, onFocus, onBlur, ...inputProps } = props;
|
|
57
|
+
const reactId = React__default.default.useId();
|
|
58
|
+
const hasLabel = Boolean(label);
|
|
59
|
+
const hasProvidedPlaceholder = typeof placeholder === "string" && placeholder.trim().length > 0;
|
|
60
|
+
const hidePlaceholderUntilFocus = hasLabel && hasProvidedPlaceholder;
|
|
61
|
+
const [isFocused, setIsFocused] = React__default.default.useState(false);
|
|
62
|
+
const classBase = "input-base focus-visible:outline-none focus-visible:ring-primary transition-colors duration-200 disabled:opacity-50 disabled:cursor-not-allowed w-full text-gray-900 dark:text-gray-100 placeholder:text-gray-500 dark:placeholder:text-gray-400";
|
|
61
63
|
const variantClasses = {
|
|
62
|
-
solid: "rounded border border-gray-400 bg-white shadow-sm focus-visible:border-primary focus-visible:ring-2 focus-visible:ring-primary/30",
|
|
63
|
-
sharp: "rounded-none border border-gray-400 bg-white shadow-sm focus-visible:border-primary focus-visible:ring-2 focus-visible:ring-primary/30",
|
|
64
|
-
outline: "rounded border border-gray-300 bg-transparent focus-visible:border-primary focus-visible:ring-2 focus-visible:ring-primary/30",
|
|
65
|
-
text: "rounded-none border-0 border-b border-transparent px-0 bg-transparent focus-visible:border-primary focus-visible:ring-0 focus-visible:ring-transparent",
|
|
66
|
-
ghost: "rounded border border-transparent bg-gray-50 text-gray-900 focus-visible:bg-white focus-visible:border-primary focus-visible:ring-2 focus-visible:ring-primary/15",
|
|
67
|
-
filled: "rounded border border-gray-200 bg-gray-100 focus-visible:border-primary focus-visible:ring-2 focus-visible:ring-primary/25",
|
|
68
|
-
underlined: "rounded-none border-0 border-b border-gray-300 px-0 bg-transparent focus-visible:border-primary focus-visible:ring-0 focus-visible:ring-transparent",
|
|
69
|
-
rounded: "rounded-full px-4 border border-gray-300 bg-white focus-visible:border-primary focus-visible:ring-2 focus-visible:ring-primary/20 shadow-sm"
|
|
64
|
+
solid: "rounded border border-gray-400 bg-white shadow-sm focus-visible:border-primary focus-visible:ring-2 focus-visible:ring-primary/30 dark:border-gray-600 dark:bg-slate-900 dark:shadow-black/20 dark:focus-visible:border-primary/70 dark:focus-visible:ring-primary/40",
|
|
65
|
+
sharp: "rounded-none border border-gray-400 bg-white shadow-sm focus-visible:border-primary focus-visible:ring-2 focus-visible:ring-primary/30 dark:border-gray-600 dark:bg-slate-900 dark:shadow-black/20 dark:focus-visible:border-primary/70 dark:focus-visible:ring-primary/40",
|
|
66
|
+
outline: "rounded border border-gray-300 bg-transparent focus-visible:border-primary focus-visible:ring-2 focus-visible:ring-primary/30 dark:border-gray-600 dark:bg-transparent dark:focus-visible:border-primary/70 dark:focus-visible:ring-primary/40",
|
|
67
|
+
text: "rounded-none border-0 border-b border-transparent px-0 bg-transparent focus-visible:border-primary focus-visible:ring-0 focus-visible:ring-transparent dark:border-b-gray-600 dark:focus-visible:border-primary/70",
|
|
68
|
+
ghost: "rounded border border-transparent bg-gray-50 text-gray-900 focus-visible:bg-white focus-visible:border-primary focus-visible:ring-2 focus-visible:ring-primary/15 dark:bg-slate-800 dark:text-gray-100 dark:focus-visible:bg-slate-700 dark:focus-visible:border-primary/60 dark:focus-visible:ring-primary/25",
|
|
69
|
+
filled: "rounded border border-gray-200 bg-gray-100 focus-visible:border-primary focus-visible:ring-2 focus-visible:ring-primary/25 dark:border-gray-700 dark:bg-slate-800 dark:focus-visible:border-primary/60 dark:focus-visible:ring-primary/30",
|
|
70
|
+
underlined: "rounded-none border-0 border-b border-gray-300 px-0 bg-transparent focus-visible:border-primary focus-visible:ring-0 focus-visible:ring-transparent dark:border-b-gray-600 dark:focus-visible:border-primary/70",
|
|
71
|
+
rounded: "rounded-full px-4 border border-gray-300 bg-white focus-visible:border-primary focus-visible:ring-2 focus-visible:ring-primary/20 shadow-sm dark:border-gray-600 dark:bg-slate-900 dark:focus-visible:border-primary/70 dark:focus-visible:ring-primary/30 dark:shadow-black/20"
|
|
72
|
+
};
|
|
73
|
+
const sizeClasses = {
|
|
74
|
+
"x-small": { paddingNoIcon: "px-2 py-2", paddingWithIcon: "pl-8 pr-2 py-2", text: "text-xs" },
|
|
75
|
+
small: {
|
|
76
|
+
paddingNoIcon: "px-2.5 py-2.5",
|
|
77
|
+
paddingWithIcon: "pl-9 pr-2.5 py-2.5",
|
|
78
|
+
text: "text-sm"
|
|
79
|
+
},
|
|
80
|
+
medium: { paddingNoIcon: "px-3 py-3", paddingWithIcon: "pl-10 pr-3 py-3", text: "text-base" },
|
|
81
|
+
large: {
|
|
82
|
+
paddingNoIcon: "px-3.5 py-3.5",
|
|
83
|
+
paddingWithIcon: "pl-11 pr-3.5 py-3.5",
|
|
84
|
+
text: "text-lg"
|
|
85
|
+
},
|
|
86
|
+
"x-large": { paddingNoIcon: "px-4 py-4", paddingWithIcon: "pl-12 pr-4 py-4", text: "text-xl" }
|
|
70
87
|
};
|
|
71
88
|
const status = error ? { tone: "error", message: error } : warn ? { tone: "warn", message: warn } : success ? { tone: "success", message: success } : void 0;
|
|
72
89
|
const statusClasses = {
|
|
@@ -75,24 +92,81 @@ var Input = ({
|
|
|
75
92
|
success: "border-emerald-500 focus:border-emerald-500 focus:ring-emerald-400"
|
|
76
93
|
};
|
|
77
94
|
const statusMessageClasses = {
|
|
78
|
-
error: "text-red-600",
|
|
79
|
-
warn: "text-amber-600",
|
|
80
|
-
success: "text-emerald-600"
|
|
95
|
+
error: "text-red-600 dark:text-red-300",
|
|
96
|
+
warn: "text-amber-600 dark:text-amber-300",
|
|
97
|
+
success: "text-emerald-600 dark:text-emerald-300"
|
|
81
98
|
};
|
|
82
99
|
const variantClass = variantClasses[variant] ?? variantClasses.outline;
|
|
83
100
|
const toneClass = status ? statusClasses[status.tone] : void 0;
|
|
84
|
-
|
|
85
|
-
const
|
|
86
|
-
const
|
|
101
|
+
let prependIconClass = resolveIconClassName(icon);
|
|
102
|
+
const sizeConfig = sizeClasses[size] ?? sizeClasses.medium;
|
|
103
|
+
const sizeClass = [
|
|
104
|
+
prependIconClass ? sizeConfig.paddingWithIcon : sizeConfig.paddingNoIcon,
|
|
105
|
+
sizeConfig.text
|
|
106
|
+
].join(" ");
|
|
107
|
+
const inputName = inputProps.name || reactId;
|
|
108
|
+
const basePlaceholder = placeholder ?? (hasLabel ? " " : void 0);
|
|
109
|
+
const placeholderValue = hidePlaceholderUntilFocus ? isFocused ? placeholder : " " : basePlaceholder;
|
|
110
|
+
const placeholderClass = hidePlaceholderUntilFocus ? "placeholder-transparent focus:placeholder-gray-500 focus:dark:placeholder-gray-400" : void 0;
|
|
111
|
+
const labelLeftClass = prependIconClass ? "left-10" : "left-3";
|
|
112
|
+
const labelBgDefault = ["outline", "text", "underlined"].includes(variant) ? "bg-transparent" : "bg-white/90 dark:bg-slate-900";
|
|
113
|
+
const handleFocus = (event) => {
|
|
114
|
+
if (hidePlaceholderUntilFocus) setIsFocused(true);
|
|
115
|
+
onFocus?.(event);
|
|
116
|
+
};
|
|
117
|
+
const handleBlur = (event) => {
|
|
118
|
+
if (hidePlaceholderUntilFocus) setIsFocused(false);
|
|
119
|
+
onBlur?.(event);
|
|
120
|
+
};
|
|
87
121
|
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: tailwindMerge.twMerge("flex flex-col gap-1", wrapperClassName), children: [
|
|
88
122
|
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex items-center", children: [
|
|
89
|
-
prependIconClass && /* @__PURE__ */ jsxRuntime.jsx(
|
|
123
|
+
prependIconClass && /* @__PURE__ */ jsxRuntime.jsx(
|
|
124
|
+
"i",
|
|
125
|
+
{
|
|
126
|
+
className: tailwindMerge.twMerge(
|
|
127
|
+
"pointer-events-none absolute left-3 top-1/2 -translate-y-1/2 text-gray-500 dark:text-gray-400",
|
|
128
|
+
status?.tone && statusMessageClasses[status?.tone] || "",
|
|
129
|
+
prependIconClass
|
|
130
|
+
),
|
|
131
|
+
"aria-hidden": true
|
|
132
|
+
}
|
|
133
|
+
),
|
|
90
134
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
91
135
|
"input",
|
|
92
136
|
{
|
|
93
|
-
...
|
|
94
|
-
|
|
95
|
-
name: inputName
|
|
137
|
+
...inputProps,
|
|
138
|
+
id: inputName,
|
|
139
|
+
name: inputName,
|
|
140
|
+
placeholder: placeholderValue,
|
|
141
|
+
onFocus: handleFocus,
|
|
142
|
+
onBlur: handleBlur,
|
|
143
|
+
className: tailwindMerge.twMerge(
|
|
144
|
+
"peer",
|
|
145
|
+
classBase,
|
|
146
|
+
variantClass,
|
|
147
|
+
toneClass,
|
|
148
|
+
sizeClass,
|
|
149
|
+
placeholderClass,
|
|
150
|
+
className
|
|
151
|
+
)
|
|
152
|
+
}
|
|
153
|
+
),
|
|
154
|
+
label && /* @__PURE__ */ jsxRuntime.jsx(
|
|
155
|
+
"label",
|
|
156
|
+
{
|
|
157
|
+
htmlFor: inputName,
|
|
158
|
+
className: tailwindMerge.twMerge(
|
|
159
|
+
"absolute transition-all duration-150 pointer-events-none text-gray-700 dark:text-gray-200",
|
|
160
|
+
labelLeftClass,
|
|
161
|
+
// Floated state: center label's vertical middle on the top border line
|
|
162
|
+
"top-0 -translate-y-2/3 text-xs px-1",
|
|
163
|
+
labelBgDefault,
|
|
164
|
+
// focus state mirrors floated state (keeps center on border)
|
|
165
|
+
"peer-focus:top-0 peer-focus:-translate-y-1/2 peer-focus:text-xs peer-focus:px-1 peer-focus:bg-white/90 peer-focus:text-gray-600 dark:peer-focus:bg-slate-900 dark:peer-focus:text-gray-300",
|
|
166
|
+
// when input is empty (placeholder shown) -> center label inside input
|
|
167
|
+
"peer-placeholder-shown:top-1/2 peer-placeholder-shown:-translate-y-1/2 peer-placeholder-shown:text-sm peer-placeholder-shown:bg-transparent peer-placeholder-shown:text-gray-500 dark:peer-placeholder-shown:text-gray-400"
|
|
168
|
+
),
|
|
169
|
+
children: label
|
|
96
170
|
}
|
|
97
171
|
)
|
|
98
172
|
] }),
|
package/dist/input.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/globals.ts","../src/Form/Input/states.input.ts","../src/utils/helpers/randomStr.ts","../src/Form/Input/index.tsx"],"names":["normalizedName","twMerge","jsxs","jsx"],"mappings":";;;;;;;;AAAO,IAAM,eAAA,GAAkB;AAAA,EAC7B,GAAA,EAAK,CAAC,KAAK;AACb,CAAA;;;ACCO,IAAM,oBAAA,GAAuB,CAAC,IAAA,KAA6B;AAChE,EAAA,IAAI,CAAC,IAAA,EAAM;AACT,IAAA,OAAO,MAAA;AAAA,EACT;AAEA,EAAA,IAAI,OAAO,SAAS,QAAA,EAAU;AAC5B,IAAA,MAAM,OAAA,GAAU,KAAK,IAAA,EAAK;AAC1B,IAAA,IAAI,CAAC,OAAA,EAAS;AACZ,MAAA,OAAO,MAAA;AAAA,IACT;AAEA,IAAA,IAAI,OAAA,CAAQ,QAAA,CAAS,GAAG,CAAA,EAAG;AACzB,MAAA,OAAO,OAAA;AAAA,IACT;AAEA,IAAA,MAAMA,kBAAiB,OAAA,CAAQ,UAAA,CAAW,MAAM,CAAA,GAAI,OAAA,GAAU,OAAO,OAAO,CAAA,CAAA;AAC5E,IAAA,OAAO,CAAC,KAAA,EAAOA,eAAc,CAAA,CAAE,KAAK,GAAG,CAAA;AAAA,EACzC;AAEA,EAAA,MAAM,CAAC,OAAA,EAAS,WAAW,CAAA,GAAI,IAAA;AAC/B,EAAA,MAAM,WAAA,GAAc,eAAA,CAAgB,OAAO,CAAA,IAAK,CAAC,OAAO,CAAA;AACxD,EAAA,MAAM,QAAA,GAAW,YAAY,IAAA,EAAK;AAClC,EAAA,IAAI,CAAC,QAAA,EAAU;AACb,IAAA,OAAO,WAAA,CAAY,KAAK,GAAG,CAAA;AAAA,EAC7B;AACA,EAAA,MAAM,iBAAiB,QAAA,CAAS,UAAA,CAAW,MAAM,CAAA,GAAI,QAAA,GAAW,OAAO,QAAQ,CAAA,CAAA;AAC/E,EAAA,MAAM,OAAA,GAAU,CAAC,GAAG,WAAA,EAAa,cAAc,CAAA;AAC/C,EAAA,OAAO,KAAA,CAAM,KAAK,IAAI,GAAA,CAAI,OAAO,CAAC,CAAA,CAAE,KAAK,GAAG,CAAA;AAC9C,CAAA;;;AC/BA,IAAM,UAAA,GAAa,gEAAA;AAEZ,SAAS,cAAA,CAAe,SAAS,CAAA,EAAG;AACzC,EAAA,IAAI,MAAA,GAAiB,EAAA;AACrB,EAAA,MAAM,mBAAmB,UAAA,CAAW,MAAA;AACpC,EAAA,KAAA,IAAS,CAAA,GAAI,CAAA,EAAG,CAAA,GAAI,MAAA,EAAQ,CAAA,EAAA,EAAK;AAC/B,IAAA,MAAA,IAAU,UAAA,CAAW,OAAO,IAAA,CAAK,KAAA,CAAM,KAAK,MAAA,EAAO,GAAI,gBAAgB,CAAC,CAAA;AAAA,EAC1E;AAEA,EAAA,OAAO,MAAA;AACT;ACNA,IAAM,QAA6B,CAAC;AAAA,EAClC,OAAA,GAAU,SAAA;AAAA,EACV,OAAA;AAAA,EACA,KAAA;AAAA,EACA,IAAA;AAAA,EACA,IAAA;AAAA,EACA,SAAA;AAAA,EACA,gBAAA;AAAA,EACA,GAAG;AACL,CAAA,KAAM;AACJ,EAAA,MAAM,SAAA,GACJ,kKAAA;AACF,EAAA,MAAM,cAAA,GAAiB;AAAA,IACrB,KAAA,EACE,mIAAA;AAAA,IACF,KAAA,EACE,wIAAA;AAAA,IACF,OAAA,EACE,+HAAA;AAAA,IACF,IAAA,EAAM,wJAAA;AAAA,IACN,KAAA,EACE,mKAAA;AAAA,IACF,MAAA,EACE,4HAAA;AAAA,IACF,UAAA,EACE,qJAAA;AAAA,IACF,OAAA,EACE;AAAA,GACJ;AAEA,EAAA,MAAM,MAAA,GAAS,QACX,EAAE,IAAA,EAAM,SAAkB,OAAA,EAAS,KAAA,KACnC,IAAA,GACA,EAAE,MAAM,MAAA,EAAiB,OAAA,EAAS,MAAK,GACvC,OAAA,GACA,EAAE,IAAA,EAAM,SAAA,EAAoB,OAAA,EAAS,OAAA,EAAQ,GAC7C,MAAA;AAEJ,EAAA,MAAM,aAAA,GAAgB;AAAA,IACpB,KAAA,EAAO,wDAAA;AAAA,IACP,IAAA,EAAM,8DAAA;AAAA,IACN,OAAA,EAAS;AAAA,GACX;AAEA,EAAA,MAAM,oBAAA,GAAuB;AAAA,IAC3B,KAAA,EAAO,cAAA;AAAA,IACP,IAAA,EAAM,gBAAA;AAAA,IACN,OAAA,EAAS;AAAA,GACX;AAEA,EAAA,MAAM,YAAA,GAAe,cAAA,CAAe,OAAO,CAAA,IAAK,cAAA,CAAe,OAAA;AAC/D,EAAA,MAAM,SAAA,GAAY,MAAA,GAAS,aAAA,CAAc,MAAA,CAAO,IAAI,CAAA,GAAI,MAAA;AACxD,EAAA,MAAM,gBAAA,GAAmB,qBAAqB,IAAI,CAAA;AAClD,EAAA,MAAM,cAAA,GAAiB,mBAAmB,OAAA,GAAU,MAAA;AAGpD,EAAA,MAAM,SAAA,GAAY,KAAA,CAAM,IAAA,IAAQ,cAAA,EAAe;AAC/C,EAAA,uCACG,KAAA,EAAA,EAAI,SAAA,EAAWC,qBAAA,CAAQ,qBAAA,EAAuB,gBAAgB,CAAA,EAC7D,QAAA,EAAA;AAAA,oBAAAC,eAAA,CAAC,KAAA,EAAA,EAAI,WAAU,4BAAA,EACZ,QAAA,EAAA;AAAA,MAAA,gBAAA,oBACCC,cAAA,CAAC,OAAE,SAAA,EAAWF,qBAAA,CAAQ,wCAAwC,gBAAgB,CAAA,EAAG,eAAW,IAAA,EAAC,CAAA;AAAA,sBAE/FE,cAAA;AAAA,QAAC,OAAA;AAAA,QAAA;AAAA,UACE,GAAG,KAAA;AAAA,UACJ,WAAWF,qBAAA,CAAQ,SAAA,EAAW,YAAA,EAAc,SAAA,EAAW,gBAAgB,SAAS,CAAA;AAAA,UAChF,IAAA,EAAM;AAAA;AAAA;AACR,KAAA,EAIF,CAAA;AAAA,IACC,MAAA,EAAQ,OAAA,oBACPE,cAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAWF,qBAAA,CAAQ,SAAA,EAAW,oBAAA,CAAqB,MAAA,CAAO,IAAI,CAAC,CAAA,EAAI,iBAAO,OAAA,EAAQ;AAAA,GAAA,EAE5F,CAAA;AAEJ,CAAA;AAEA,IAAO,aAAA,GAAQ","file":"input.cjs","sourcesContent":["export const iconBaseClasses = {\n mdi: ['mdi']\n} as const;\n","import { iconBaseClasses } from '@lindle/linoardo/globals';\nimport { InputProp } from './types';\n\nexport const resolveIconClassName = (icon?: InputProp['icon']) => {\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 normalizedName = trimmed.startsWith('mdi-') ? trimmed : `mdi-${trimmed}`;\n return ['mdi', normalizedName].join(' ');\n }\n\n const [library, iconNameRaw] = icon;\n const baseClasses = iconBaseClasses[library] ?? [library];\n const iconName = iconNameRaw.trim();\n if (!iconName) {\n return baseClasses.join(' ');\n }\n const normalizedName = iconName.startsWith('mdi-') ? iconName : `mdi-${iconName}`;\n const classes = [...baseClasses, normalizedName];\n return Array.from(new Set(classes)).join(' ');\n};\n","const characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';\n\nexport function generateString(length = 5) {\n let result: string = '';\n const charactersLength = characters.length;\n for (let i = 0; i < length; i++) {\n result += characters.charAt(Math.floor(Math.random() * charactersLength));\n }\n\n return result;\n}\n","import { twMerge } from 'tailwind-merge';\nimport { InputProp, InputVariant } from './types';\nimport { resolveIconClassName } from './states.input';\nimport { generateString } from '../../utils/helpers/randomStr';\nconst Input: React.FC<InputProp> = ({\n variant = 'outline',\n success,\n error,\n warn,\n icon,\n className,\n wrapperClassName,\n ...props\n}) => {\n const classBase =\n 'input-base px-3 py-2 focus-visible:outline-none focus-visible:ring-primary transition-colors duration-200 disabled:opacity-50 disabled:cursor-not-allowed w-full';\n const variantClasses = {\n solid:\n 'rounded border border-gray-400 bg-white shadow-sm focus-visible:border-primary focus-visible:ring-2 focus-visible:ring-primary/30',\n sharp:\n 'rounded-none border border-gray-400 bg-white shadow-sm focus-visible:border-primary focus-visible:ring-2 focus-visible:ring-primary/30',\n outline:\n 'rounded border border-gray-300 bg-transparent focus-visible:border-primary focus-visible:ring-2 focus-visible:ring-primary/30',\n text: 'rounded-none border-0 border-b border-transparent px-0 bg-transparent focus-visible:border-primary focus-visible:ring-0 focus-visible:ring-transparent',\n ghost:\n 'rounded border border-transparent bg-gray-50 text-gray-900 focus-visible:bg-white focus-visible:border-primary focus-visible:ring-2 focus-visible:ring-primary/15',\n filled:\n 'rounded border border-gray-200 bg-gray-100 focus-visible:border-primary focus-visible:ring-2 focus-visible:ring-primary/25',\n underlined:\n 'rounded-none border-0 border-b border-gray-300 px-0 bg-transparent focus-visible:border-primary focus-visible:ring-0 focus-visible:ring-transparent',\n rounded:\n 'rounded-full px-4 border border-gray-300 bg-white focus-visible:border-primary focus-visible:ring-2 focus-visible:ring-primary/20 shadow-sm'\n } satisfies Record<InputVariant, string>;\n\n const status = error\n ? { tone: 'error' as const, message: error }\n : warn\n ? { tone: 'warn' as const, message: warn }\n : success\n ? { tone: 'success' as const, message: success }\n : undefined;\n\n const statusClasses = {\n error: 'border-red-500 focus:border-red-500 focus:ring-red-400',\n warn: 'border-amber-500 focus:border-amber-500 focus:ring-amber-400',\n success: 'border-emerald-500 focus:border-emerald-500 focus:ring-emerald-400'\n } as const;\n\n const statusMessageClasses = {\n error: 'text-red-600',\n warn: 'text-amber-600',\n success: 'text-emerald-600'\n } as const;\n\n const variantClass = variantClasses[variant] ?? variantClasses.outline;\n const toneClass = status ? statusClasses[status.tone] : undefined;\n const prependIconClass = resolveIconClassName(icon);\n const prependPadding = prependIconClass ? 'pl-10' : undefined;\n\n // TODO: uprav generovani inputName, tohle zpusobuje: A tree hydrated but some attributes of the server rendered HTML didn't match the client properties. This won't be patched up.\n const inputName = props.name || generateString();\n return (\n <div className={twMerge('flex flex-col gap-1', wrapperClassName)}>\n <div className='relative flex items-center'>\n {prependIconClass && (\n <i className={twMerge('pointer-events-none absolute left-3 ', prependIconClass)} aria-hidden />\n )}\n <input\n {...props}\n className={twMerge(classBase, variantClass, toneClass, prependPadding, className)}\n name={inputName}\n />\n {/* {appendIconClass && (\n <i className={twMerge('pointer-events-none absolute right-3 text-gray-500', appendIconClass)} aria-hidden />\n )} */}\n </div>\n {status?.message && (\n <span className={twMerge('text-sm', statusMessageClasses[status.tone])}>{status.message}</span>\n )}\n </div>\n );\n};\n\nexport default Input;\n"]}
|
|
1
|
+
{"version":3,"sources":["../src/globals.ts","../src/Form/Input/states.input.ts","../src/Form/Input/index.tsx"],"names":["normalizedName","React","twMerge","jsxs","jsx"],"mappings":"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","file":"input.cjs","sourcesContent":["export const iconBaseClasses = {\n mdi: ['mdi']\n} as const;\n","import { iconBaseClasses } from '@lindle/linoardo/globals';\nimport { InputProp } from './types';\n\nexport const resolveIconClassName = (icon?: InputProp['icon']) => {\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 normalizedName = trimmed.startsWith('mdi-') ? trimmed : `mdi-${trimmed}`;\n return ['mdi', normalizedName].join(' ');\n }\n\n const [library, iconNameRaw] = icon;\n const baseClasses = iconBaseClasses[library] ?? [library];\n const iconName = iconNameRaw.trim();\n if (!iconName) {\n return baseClasses.join(' ');\n }\n const normalizedName = iconName.startsWith('mdi-') ? iconName : `mdi-${iconName}`;\n const classes = [...baseClasses, normalizedName];\n return Array.from(new Set(classes)).join(' ');\n};\n","import React from 'react';\nimport { twMerge } from 'tailwind-merge';\nimport { InputProp, InputVariant, InputSize } from './types';\nimport { resolveIconClassName } from './states.input';\n\n/**\n * Text input with multiple visual variants and inline status or icon adornments.\n * Label is purely CSS-driven (peer + placeholder-shown + focus), no hooks used.\n */\nconst Input: React.FC<InputProp> = ({\n variant = 'outline',\n size = 'medium',\n success,\n error,\n warn,\n icon,\n className,\n wrapperClassName,\n label,\n ...props\n}) => {\n const { placeholder, onFocus, onBlur, ...inputProps } = props;\n const reactId = React.useId();\n const hasLabel = Boolean(label);\n const hasProvidedPlaceholder = typeof placeholder === 'string' && placeholder.trim().length > 0;\n const hidePlaceholderUntilFocus = hasLabel && hasProvidedPlaceholder;\n const [isFocused, setIsFocused] = React.useState(false);\n const classBase =\n 'input-base focus-visible:outline-none focus-visible:ring-primary transition-colors duration-200 disabled:opacity-50 disabled:cursor-not-allowed w-full text-gray-900 dark:text-gray-100 placeholder:text-gray-500 dark:placeholder:text-gray-400';\n const variantClasses = {\n solid:\n 'rounded border border-gray-400 bg-white shadow-sm focus-visible:border-primary focus-visible:ring-2 focus-visible:ring-primary/30 dark:border-gray-600 dark:bg-slate-900 dark:shadow-black/20 dark:focus-visible:border-primary/70 dark:focus-visible:ring-primary/40',\n sharp:\n 'rounded-none border border-gray-400 bg-white shadow-sm focus-visible:border-primary focus-visible:ring-2 focus-visible:ring-primary/30 dark:border-gray-600 dark:bg-slate-900 dark:shadow-black/20 dark:focus-visible:border-primary/70 dark:focus-visible:ring-primary/40',\n outline:\n 'rounded border border-gray-300 bg-transparent focus-visible:border-primary focus-visible:ring-2 focus-visible:ring-primary/30 dark:border-gray-600 dark:bg-transparent dark:focus-visible:border-primary/70 dark:focus-visible:ring-primary/40',\n text: 'rounded-none border-0 border-b border-transparent px-0 bg-transparent focus-visible:border-primary focus-visible:ring-0 focus-visible:ring-transparent dark:border-b-gray-600 dark:focus-visible:border-primary/70',\n ghost:\n 'rounded border border-transparent bg-gray-50 text-gray-900 focus-visible:bg-white focus-visible:border-primary focus-visible:ring-2 focus-visible:ring-primary/15 dark:bg-slate-800 dark:text-gray-100 dark:focus-visible:bg-slate-700 dark:focus-visible:border-primary/60 dark:focus-visible:ring-primary/25',\n filled:\n 'rounded border border-gray-200 bg-gray-100 focus-visible:border-primary focus-visible:ring-2 focus-visible:ring-primary/25 dark:border-gray-700 dark:bg-slate-800 dark:focus-visible:border-primary/60 dark:focus-visible:ring-primary/30',\n underlined:\n 'rounded-none border-0 border-b border-gray-300 px-0 bg-transparent focus-visible:border-primary focus-visible:ring-0 focus-visible:ring-transparent dark:border-b-gray-600 dark:focus-visible:border-primary/70',\n rounded:\n 'rounded-full px-4 border border-gray-300 bg-white focus-visible:border-primary focus-visible:ring-2 focus-visible:ring-primary/20 shadow-sm dark:border-gray-600 dark:bg-slate-900 dark:focus-visible:border-primary/70 dark:focus-visible:ring-primary/30 dark:shadow-black/20'\n } satisfies Record<InputVariant, string>;\n const sizeClasses = {\n 'x-small': { paddingNoIcon: 'px-2 py-2', paddingWithIcon: 'pl-8 pr-2 py-2', text: 'text-xs' },\n small: {\n paddingNoIcon: 'px-2.5 py-2.5',\n paddingWithIcon: 'pl-9 pr-2.5 py-2.5',\n text: 'text-sm'\n },\n medium: { paddingNoIcon: 'px-3 py-3', paddingWithIcon: 'pl-10 pr-3 py-3', text: 'text-base' },\n large: {\n paddingNoIcon: 'px-3.5 py-3.5',\n paddingWithIcon: 'pl-11 pr-3.5 py-3.5',\n text: 'text-lg'\n },\n 'x-large': { paddingNoIcon: 'px-4 py-4', paddingWithIcon: 'pl-12 pr-4 py-4', text: 'text-xl' }\n } satisfies Record<InputSize, { paddingNoIcon: string; paddingWithIcon: string; text: string }>;\n\n const status = error\n ? { tone: 'error' as const, message: error }\n : warn\n ? { tone: 'warn' as const, message: warn }\n : success\n ? { tone: 'success' as const, message: success }\n : undefined;\n\n const statusClasses = {\n error: 'border-red-500 focus:border-red-500 focus:ring-red-400',\n warn: 'border-amber-500 focus:border-amber-500 focus:ring-amber-400',\n success: 'border-emerald-500 focus:border-emerald-500 focus:ring-emerald-400'\n } as const;\n\n const statusMessageClasses = {\n error: 'text-red-600 dark:text-red-300',\n warn: 'text-amber-600 dark:text-amber-300',\n success: 'text-emerald-600 dark:text-emerald-300'\n } as const;\n\n const variantClass = variantClasses[variant] ?? variantClasses.outline;\n const toneClass = status ? statusClasses[status.tone] : undefined;\n let prependIconClass = resolveIconClassName(icon);\n const sizeConfig = sizeClasses[size] ?? sizeClasses.medium;\n const sizeClass = [\n prependIconClass ? sizeConfig.paddingWithIcon : sizeConfig.paddingNoIcon,\n sizeConfig.text\n ].join(' ');\n\n // useId keeps SSR/CSR ids consistent while still providing a fallback name\n const inputName = inputProps.name || reactId;\n\n // Ensure placeholder is present when label exists so :placeholder-shown works.\n // Label stays primary; placeholder only appears on focus when the field is empty.\n const basePlaceholder = placeholder ?? (hasLabel ? ' ' : undefined);\n const placeholderValue = hidePlaceholderUntilFocus\n ? isFocused\n ? placeholder\n : ' '\n : basePlaceholder;\n const placeholderClass = hidePlaceholderUntilFocus\n ? 'placeholder-transparent focus:placeholder-gray-500 focus:dark:placeholder-gray-400'\n : undefined;\n\n // Label left offset depends on icon presence\n const labelLeftClass = prependIconClass ? 'left-10' : 'left-3';\n\n // Background for floated label — keep transparent for outline/text/underlined variants\n const labelBgDefault = ['outline', 'text', 'underlined'].includes(variant)\n ? 'bg-transparent'\n : 'bg-white/90 dark:bg-slate-900';\n\n const handleFocus: React.FocusEventHandler<HTMLInputElement> = event => {\n if (hidePlaceholderUntilFocus) setIsFocused(true);\n onFocus?.(event);\n };\n\n const handleBlur: React.FocusEventHandler<HTMLInputElement> = event => {\n if (hidePlaceholderUntilFocus) setIsFocused(false);\n onBlur?.(event);\n };\n\n return (\n <div className={twMerge('flex flex-col gap-1', wrapperClassName)}>\n <div className='relative flex items-center'>\n {prependIconClass && (\n <i\n className={twMerge(\n 'pointer-events-none absolute left-3 top-1/2 -translate-y-1/2 text-gray-500 dark:text-gray-400',\n (status?.tone && statusMessageClasses[status?.tone]) || '',\n prependIconClass\n )}\n aria-hidden\n />\n )}\n\n {/* input is peer so label can react with peer-* utilities */}\n <input\n {...inputProps}\n id={inputName}\n name={inputName}\n placeholder={placeholderValue}\n onFocus={handleFocus}\n onBlur={handleBlur}\n className={twMerge(\n 'peer',\n classBase,\n variantClass,\n toneClass,\n sizeClass,\n placeholderClass,\n className\n )}\n />\n\n {label && (\n <label\n htmlFor={inputName}\n className={twMerge(\n 'absolute transition-all duration-150 pointer-events-none text-gray-700 dark:text-gray-200',\n labelLeftClass,\n // Floated state: center label's vertical middle on the top border line\n 'top-0 -translate-y-2/3 text-xs px-1',\n labelBgDefault,\n // focus state mirrors floated state (keeps center on border)\n 'peer-focus:top-0 peer-focus:-translate-y-1/2 peer-focus:text-xs peer-focus:px-1 peer-focus:bg-white/90 peer-focus:text-gray-600 dark:peer-focus:bg-slate-900 dark:peer-focus:text-gray-300',\n // when input is empty (placeholder shown) -> center label inside input\n 'peer-placeholder-shown:top-1/2 peer-placeholder-shown:-translate-y-1/2 peer-placeholder-shown:text-sm peer-placeholder-shown:bg-transparent peer-placeholder-shown:text-gray-500 dark:peer-placeholder-shown:text-gray-400'\n )}\n >\n {label}\n </label>\n )}\n\n {/* {appendIconClass && (\n <i className={twMerge('pointer-events-none absolute right-3 text-gray-500', appendIconClass)} aria-hidden />\n )} */}\n </div>\n {status?.message && (\n <span className={twMerge('text-sm', statusMessageClasses[status.tone])}>\n {status.message}\n </span>\n )}\n </div>\n );\n};\n\nexport default Input;\n"]}
|
package/dist/input.d.cts
CHANGED
|
@@ -1,22 +1,11 @@
|
|
|
1
|
-
import
|
|
1
|
+
import react__default from 'react';
|
|
2
|
+
import { I as InputProp } from './types-BCqIOkp1.cjs';
|
|
3
|
+
import './global.types-E2uVLemv.cjs';
|
|
2
4
|
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
type InputIcon = string | readonly [IconLibrary, string];
|
|
9
|
-
type InputStatusProps = {
|
|
10
|
-
success?: StatusValue;
|
|
11
|
-
error?: StatusValue;
|
|
12
|
-
warn?: StatusValue;
|
|
13
|
-
};
|
|
14
|
-
type InputProp = React.InputHTMLAttributes<HTMLInputElement> & InputStatusProps & {
|
|
15
|
-
variant?: InputVariant;
|
|
16
|
-
icon?: InputIcon;
|
|
17
|
-
wrapperClassName?: string;
|
|
18
|
-
};
|
|
19
|
-
|
|
20
|
-
declare const Input: React.FC<InputProp>;
|
|
5
|
+
/**
|
|
6
|
+
* Text input with multiple visual variants and inline status or icon adornments.
|
|
7
|
+
* Label is purely CSS-driven (peer + placeholder-shown + focus), no hooks used.
|
|
8
|
+
*/
|
|
9
|
+
declare const Input: react__default.FC<InputProp>;
|
|
21
10
|
|
|
22
11
|
export { Input as default };
|
package/dist/input.d.ts
CHANGED
|
@@ -1,22 +1,11 @@
|
|
|
1
|
-
import
|
|
1
|
+
import react__default from 'react';
|
|
2
|
+
import { I as InputProp } from './types-ChXN4u7x.js';
|
|
3
|
+
import './global.types-E2uVLemv.js';
|
|
2
4
|
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
type InputIcon = string | readonly [IconLibrary, string];
|
|
9
|
-
type InputStatusProps = {
|
|
10
|
-
success?: StatusValue;
|
|
11
|
-
error?: StatusValue;
|
|
12
|
-
warn?: StatusValue;
|
|
13
|
-
};
|
|
14
|
-
type InputProp = React.InputHTMLAttributes<HTMLInputElement> & InputStatusProps & {
|
|
15
|
-
variant?: InputVariant;
|
|
16
|
-
icon?: InputIcon;
|
|
17
|
-
wrapperClassName?: string;
|
|
18
|
-
};
|
|
19
|
-
|
|
20
|
-
declare const Input: React.FC<InputProp>;
|
|
5
|
+
/**
|
|
6
|
+
* Text input with multiple visual variants and inline status or icon adornments.
|
|
7
|
+
* Label is purely CSS-driven (peer + placeholder-shown + focus), no hooks used.
|
|
8
|
+
*/
|
|
9
|
+
declare const Input: react__default.FC<InputProp>;
|
|
21
10
|
|
|
22
11
|
export { Input as default };
|
package/dist/input.js
CHANGED
package/dist/list/item.cjs
CHANGED
|
@@ -132,7 +132,16 @@ var ListItem = React__namespace.forwardRef((props, ref) => {
|
|
|
132
132
|
prepend && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex h-10 w-10 shrink-0 items-center justify-center text-base text-gray-500", children: prepend }),
|
|
133
133
|
/* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex min-w-0 flex-col gap-0.5 text-left", children: [
|
|
134
134
|
overline && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[0.65rem] font-semibold uppercase tracking-wide text-gray-500", children: overline }),
|
|
135
|
-
title && /* @__PURE__ */ jsxRuntime.jsx(
|
|
135
|
+
title && /* @__PURE__ */ jsxRuntime.jsx(
|
|
136
|
+
"span",
|
|
137
|
+
{
|
|
138
|
+
className: tailwindMerge.twMerge(
|
|
139
|
+
"truncate font-medium text-gray-900",
|
|
140
|
+
active ? accent.text : void 0
|
|
141
|
+
),
|
|
142
|
+
children: title
|
|
143
|
+
}
|
|
144
|
+
),
|
|
136
145
|
subtitle && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm text-gray-500", children: subtitle }),
|
|
137
146
|
children
|
|
138
147
|
] }),
|
package/dist/list/item.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/Containment/List/Item/index.tsx"],"names":["React","jsxs","twMerge","jsx"],"mappings":"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","file":"item.cjs","sourcesContent":["import * as React from 'react';\nimport { twMerge } from 'tailwind-merge';\nimport type { Palette } from '@lindle/linoardo/global.types';\n\nimport type { ListDensity, ListLines } from '../types.list';\n\nconst listItemBaseClasses =\n 'relative flex w-full items-center gap-4 bg-transparent text-left text-sm transition-colors duration-150 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/40 focus-visible:ring-offset-2 focus-visible:ring-offset-white hover:bg-neutral-200';\n\nconst densityClasses: Record<ListDensity, string> = {\n default: 'px-4 py-3 text-base',\n comfortable: 'px-4 py-2.5 text-sm',\n compact: 'px-3 py-2 text-sm'\n};\n\nconst lineClasses: Record<ListLines, string> = {\n one: 'min-h-[3rem]',\n two: 'min-h-[3.75rem]',\n three: 'min-h-[4.5rem]'\n};\n\nconst accentClasses: Record<Palette, { text: string; bg: string; indicator: string }> = {\n primary: { text: 'text-primary', bg: 'bg-primary/10', indicator: 'bg-primary' },\n neutral: { text: 'text-gray-900', bg: 'bg-gray-100', indicator: 'bg-gray-900' },\n info: { text: 'text-sky-600', bg: 'bg-sky-50', indicator: 'bg-sky-500' },\n success: { text: 'text-emerald-600', bg: 'bg-emerald-50', indicator: 'bg-emerald-500' },\n warning: { text: 'text-amber-700', bg: 'bg-amber-50', indicator: 'bg-amber-500' },\n danger: { text: 'text-red-600', bg: 'bg-red-50', indicator: 'bg-red-500' },\n surface: { text: 'text-gray-900', bg: 'bg-gray-100', indicator: 'bg-gray-900' },\n bw: { text: 'text-gray-900', bg: 'bg-gray-100', indicator: 'bg-gray-900' }\n};\n\nexport interface ListItemProps extends Omit<React.HTMLAttributes<HTMLElement>, 'title'> {\n component?: React.ElementType;\n href?: string;\n target?: string;\n rel?: string;\n type?: 'button' | 'submit' | 'reset';\n title?: React.ReactNode;\n subtitle?: React.ReactNode;\n overline?: React.ReactNode;\n prepend?: React.ReactNode;\n append?: React.ReactNode;\n active?: boolean;\n disabled?: boolean;\n inset?: boolean;\n density?: ListDensity;\n lines?: ListLines;\n nav?: boolean;\n divided?: boolean;\n color?: Palette;\n sharp?: boolean;\n}\n\nconst ListItem = React.forwardRef<HTMLElement, ListItemProps>((props, ref) => {\n const {\n component,\n href,\n target,\n rel,\n type,\n title,\n subtitle,\n overline,\n prepend,\n append,\n active = false,\n disabled = false,\n inset = false,\n density: densityOverride,\n lines: linesOverride,\n nav: navOverride,\n divided: dividedOverride,\n color: colorOverride,\n sharp: sharpOverride,\n className,\n children,\n tabIndex,\n role,\n ...rest\n } = props;\n\n const density = densityOverride ?? 'default';\n const lines = linesOverride ?? 'one';\n const nav = navOverride ?? false;\n const divided = dividedOverride ?? false;\n const color = colorOverride ?? 'primary';\n const sharp = sharpOverride ?? false;\n const accent = accentClasses[color] ?? accentClasses.primary;\n const shapeClass = divided || sharp ? 'rounded-none' : 'rounded-lg';\n\n const Component = component ?? (href ? 'a' : 'div');\n const interactive = typeof rest.onClick === 'function' || Component === 'a' || Component === 'button';\n\n const resolvedRole = role ?? 'listitem';\n const resolvedTabIndex = disabled ? -1 : tabIndex ?? (interactive && Component === 'div' ? 0 : undefined);\n const resolvedRel = Component === 'a' ? rel : undefined;\n const resolvedTarget = Component === 'a' ? target : undefined;\n const resolvedHref = Component === 'a' ? href : undefined;\n const resolvedType = Component === 'button' ? type ?? 'button' : undefined;\n\n const disabledClass = disabled ? 'pointer-events-none opacity-60' : 'cursor-pointer';\n const navPaddingClass = nav ? 'pl-5' : undefined;\n const insetClass = inset ? 'pl-12' : undefined;\n const activeClasses = active ? accent.bg : undefined;\n\n return (\n <Component\n {...rest}\n ref={ref}\n role={resolvedRole}\n tabIndex={resolvedTabIndex}\n aria-disabled={disabled || undefined}\n aria-current={active ? 'true' : undefined}\n className={twMerge(\n listItemBaseClasses,\n densityClasses[density],\n lineClasses[lines],\n shapeClass,\n navPaddingClass,\n insetClass,\n disabledClass,\n activeClasses,\n className\n )}\n href={resolvedHref}\n target={resolvedTarget}\n rel={resolvedRel}\n type={resolvedType}\n data-active={active || undefined}\n >\n {nav && (\n <span\n aria-hidden\n className={twMerge(\n 'absolute left-1 top-2 bottom-2 w-0.5 rounded-full bg-transparent transition-colors duration-150',\n active ? accent.indicator : undefined\n )}\n />\n )}\n {prepend && (\n <span className='flex h-10 w-10 shrink-0 items-center justify-center text-base text-gray-500'>{prepend}</span>\n )}\n <span className='flex min-w-0 flex-col gap-0.5 text-left'>\n {overline && (\n <span className='text-[0.65rem] font-semibold uppercase tracking-wide text-gray-500'>{overline}</span>\n )}\n {title && (\n <span className={twMerge('truncate font-medium text-gray-900', active ? accent.text : undefined)}>\n {title}\n </span>\n )}\n {subtitle && <span className='text-sm text-gray-500'>{subtitle}</span>}\n {children}\n </span>\n {append && (\n <span className='ml-auto flex items-center gap-2 whitespace-nowrap text-sm text-gray-500'>{append}</span>\n )}\n </Component>\n );\n});\n\nListItem.displayName = 'ListItem';\n\nexport default ListItem;\nexport type { ListDensity, ListLines } from '../types.list';\n"]}
|
|
1
|
+
{"version":3,"sources":["../../src/Containment/List/Item/index.tsx"],"names":["React","jsxs","twMerge","jsx"],"mappings":"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","file":"item.cjs","sourcesContent":["import * as React from 'react';\nimport { twMerge } from 'tailwind-merge';\nimport type { Palette } from '@lindle/linoardo/global.types';\n\nimport type { ListDensity, ListLines } from '../types.list';\n\nconst listItemBaseClasses =\n 'relative flex w-full items-center gap-4 bg-transparent text-left text-sm transition-colors duration-150 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/40 focus-visible:ring-offset-2 focus-visible:ring-offset-white hover:bg-neutral-200';\n\nconst densityClasses: Record<ListDensity, string> = {\n default: 'px-4 py-3 text-base',\n comfortable: 'px-4 py-2.5 text-sm',\n compact: 'px-3 py-2 text-sm'\n};\n\nconst lineClasses: Record<ListLines, string> = {\n one: 'min-h-[3rem]',\n two: 'min-h-[3.75rem]',\n three: 'min-h-[4.5rem]'\n};\n\nconst accentClasses: Record<Palette, { text: string; bg: string; indicator: string }> = {\n primary: { text: 'text-primary', bg: 'bg-primary/10', indicator: 'bg-primary' },\n neutral: { text: 'text-gray-900', bg: 'bg-gray-100', indicator: 'bg-gray-900' },\n info: { text: 'text-sky-600', bg: 'bg-sky-50', indicator: 'bg-sky-500' },\n success: { text: 'text-emerald-600', bg: 'bg-emerald-50', indicator: 'bg-emerald-500' },\n warning: { text: 'text-amber-700', bg: 'bg-amber-50', indicator: 'bg-amber-500' },\n danger: { text: 'text-red-600', bg: 'bg-red-50', indicator: 'bg-red-500' },\n surface: { text: 'text-gray-900', bg: 'bg-gray-100', indicator: 'bg-gray-900' },\n bw: { text: 'text-gray-900', bg: 'bg-gray-100', indicator: 'bg-gray-900' }\n};\n\nexport interface ListItemProps extends Omit<React.HTMLAttributes<HTMLElement>, 'title'> {\n component?: React.ElementType;\n href?: string;\n target?: string;\n rel?: string;\n type?: 'button' | 'submit' | 'reset';\n title?: React.ReactNode;\n subtitle?: React.ReactNode;\n overline?: React.ReactNode;\n prepend?: React.ReactNode;\n append?: React.ReactNode;\n active?: boolean;\n disabled?: boolean;\n inset?: boolean;\n density?: ListDensity;\n lines?: ListLines;\n nav?: boolean;\n divided?: boolean;\n color?: Palette;\n sharp?: boolean;\n}\n\n/**\n * Single list row supporting titles, overlines, adornments and navigation styling.\n */\nconst ListItem = React.forwardRef<HTMLElement, ListItemProps>((props, ref) => {\n const {\n component,\n href,\n target,\n rel,\n type,\n title,\n subtitle,\n overline,\n prepend,\n append,\n active = false,\n disabled = false,\n inset = false,\n density: densityOverride,\n lines: linesOverride,\n nav: navOverride,\n divided: dividedOverride,\n color: colorOverride,\n sharp: sharpOverride,\n className,\n children,\n tabIndex,\n role,\n ...rest\n } = props;\n\n const density = densityOverride ?? 'default';\n const lines = linesOverride ?? 'one';\n const nav = navOverride ?? false;\n const divided = dividedOverride ?? false;\n const color = colorOverride ?? 'primary';\n const sharp = sharpOverride ?? false;\n const accent = accentClasses[color] ?? accentClasses.primary;\n const shapeClass = divided || sharp ? 'rounded-none' : 'rounded-lg';\n\n const Component = component ?? (href ? 'a' : 'div');\n const interactive =\n typeof rest.onClick === 'function' || Component === 'a' || Component === 'button';\n\n const resolvedRole = role ?? 'listitem';\n const resolvedTabIndex = disabled\n ? -1\n : tabIndex ?? (interactive && Component === 'div' ? 0 : undefined);\n const resolvedRel = Component === 'a' ? rel : undefined;\n const resolvedTarget = Component === 'a' ? target : undefined;\n const resolvedHref = Component === 'a' ? href : undefined;\n const resolvedType = Component === 'button' ? type ?? 'button' : undefined;\n\n const disabledClass = disabled ? 'pointer-events-none opacity-60' : 'cursor-pointer';\n const navPaddingClass = nav ? 'pl-5' : undefined;\n const insetClass = inset ? 'pl-12' : undefined;\n const activeClasses = active ? accent.bg : undefined;\n\n return (\n <Component\n {...rest}\n ref={ref}\n role={resolvedRole}\n tabIndex={resolvedTabIndex}\n aria-disabled={disabled || undefined}\n aria-current={active ? 'true' : undefined}\n className={twMerge(\n listItemBaseClasses,\n densityClasses[density],\n lineClasses[lines],\n shapeClass,\n navPaddingClass,\n insetClass,\n disabledClass,\n activeClasses,\n className\n )}\n href={resolvedHref}\n target={resolvedTarget}\n rel={resolvedRel}\n type={resolvedType}\n data-active={active || undefined}\n >\n {nav && (\n <span\n aria-hidden\n className={twMerge(\n 'absolute left-1 top-2 bottom-2 w-0.5 rounded-full bg-transparent transition-colors duration-150',\n active ? accent.indicator : undefined\n )}\n />\n )}\n {prepend && (\n <span className='flex h-10 w-10 shrink-0 items-center justify-center text-base text-gray-500'>\n {prepend}\n </span>\n )}\n <span className='flex min-w-0 flex-col gap-0.5 text-left'>\n {overline && (\n <span className='text-[0.65rem] font-semibold uppercase tracking-wide text-gray-500'>\n {overline}\n </span>\n )}\n {title && (\n <span\n className={twMerge(\n 'truncate font-medium text-gray-900',\n active ? accent.text : undefined\n )}\n >\n {title}\n </span>\n )}\n {subtitle && <span className='text-sm text-gray-500'>{subtitle}</span>}\n {children}\n </span>\n {append && (\n <span className='ml-auto flex items-center gap-2 whitespace-nowrap text-sm text-gray-500'>\n {append}\n </span>\n )}\n </Component>\n );\n});\n\nListItem.displayName = 'ListItem';\n\nexport default ListItem;\nexport type { ListDensity, ListLines } from '../types.list';\n"]}
|
package/dist/list/item.d.cts
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import 'react';
|
|
2
2
|
import '../global.types-E2uVLemv.cjs';
|
|
3
|
-
export { c as ListDensity, a as ListItemProps, d as ListLines, L as default } from '../index-
|
|
3
|
+
export { c as ListDensity, a as ListItemProps, d as ListLines, L as default } from '../index-B5n8tN2G.cjs';
|
package/dist/list/item.d.ts
CHANGED
package/dist/list/item.js
CHANGED
package/dist/list.cjs
CHANGED
|
@@ -134,7 +134,16 @@ var ListItem = React2__namespace.forwardRef((props, ref) => {
|
|
|
134
134
|
prepend && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex h-10 w-10 shrink-0 items-center justify-center text-base text-gray-500", children: prepend }),
|
|
135
135
|
/* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex min-w-0 flex-col gap-0.5 text-left", children: [
|
|
136
136
|
overline && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[0.65rem] font-semibold uppercase tracking-wide text-gray-500", children: overline }),
|
|
137
|
-
title && /* @__PURE__ */ jsxRuntime.jsx(
|
|
137
|
+
title && /* @__PURE__ */ jsxRuntime.jsx(
|
|
138
|
+
"span",
|
|
139
|
+
{
|
|
140
|
+
className: tailwindMerge.twMerge(
|
|
141
|
+
"truncate font-medium text-gray-900",
|
|
142
|
+
active ? accent.text : void 0
|
|
143
|
+
),
|
|
144
|
+
children: title
|
|
145
|
+
}
|
|
146
|
+
),
|
|
138
147
|
subtitle && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm text-gray-500", children: subtitle }),
|
|
139
148
|
children
|
|
140
149
|
] }),
|
|
@@ -207,7 +216,10 @@ var List = React2__namespace.forwardRef((props, ref) => {
|
|
|
207
216
|
});
|
|
208
217
|
}
|
|
209
218
|
if (child.props && typeof child.props === "object" && "children" in child.props) {
|
|
210
|
-
const nestedChildren = React2__namespace.Children.map(
|
|
219
|
+
const nestedChildren = React2__namespace.Children.map(
|
|
220
|
+
child.props.children,
|
|
221
|
+
enhanceChild
|
|
222
|
+
);
|
|
211
223
|
if (nestedChildren !== child.props.children) {
|
|
212
224
|
return React2__namespace.cloneElement(child, void 0, nestedChildren);
|
|
213
225
|
}
|
|
@@ -221,7 +233,15 @@ var List = React2__namespace.forwardRef((props, ref) => {
|
|
|
221
233
|
...rest,
|
|
222
234
|
ref,
|
|
223
235
|
role: role ?? "list",
|
|
224
|
-
className: tailwindMerge.twMerge(
|
|
236
|
+
className: tailwindMerge.twMerge(
|
|
237
|
+
listBaseClasses,
|
|
238
|
+
variantClass,
|
|
239
|
+
roundedClass,
|
|
240
|
+
dividerClass,
|
|
241
|
+
gapClass,
|
|
242
|
+
navClass,
|
|
243
|
+
className
|
|
244
|
+
),
|
|
225
245
|
children: resolvedChildren
|
|
226
246
|
}
|
|
227
247
|
);
|
package/dist/list.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/Containment/List/Item/index.tsx","../src/Containment/List/index.tsx"],"names":["React","jsxs","twMerge","jsx","React2"],"mappings":"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","file":"list.cjs","sourcesContent":["import * as React from 'react';\nimport { twMerge } from 'tailwind-merge';\nimport type { Palette } from '@lindle/linoardo/global.types';\n\nimport type { ListDensity, ListLines } from '../types.list';\n\nconst listItemBaseClasses =\n 'relative flex w-full items-center gap-4 bg-transparent text-left text-sm transition-colors duration-150 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/40 focus-visible:ring-offset-2 focus-visible:ring-offset-white hover:bg-neutral-200';\n\nconst densityClasses: Record<ListDensity, string> = {\n default: 'px-4 py-3 text-base',\n comfortable: 'px-4 py-2.5 text-sm',\n compact: 'px-3 py-2 text-sm'\n};\n\nconst lineClasses: Record<ListLines, string> = {\n one: 'min-h-[3rem]',\n two: 'min-h-[3.75rem]',\n three: 'min-h-[4.5rem]'\n};\n\nconst accentClasses: Record<Palette, { text: string; bg: string; indicator: string }> = {\n primary: { text: 'text-primary', bg: 'bg-primary/10', indicator: 'bg-primary' },\n neutral: { text: 'text-gray-900', bg: 'bg-gray-100', indicator: 'bg-gray-900' },\n info: { text: 'text-sky-600', bg: 'bg-sky-50', indicator: 'bg-sky-500' },\n success: { text: 'text-emerald-600', bg: 'bg-emerald-50', indicator: 'bg-emerald-500' },\n warning: { text: 'text-amber-700', bg: 'bg-amber-50', indicator: 'bg-amber-500' },\n danger: { text: 'text-red-600', bg: 'bg-red-50', indicator: 'bg-red-500' },\n surface: { text: 'text-gray-900', bg: 'bg-gray-100', indicator: 'bg-gray-900' },\n bw: { text: 'text-gray-900', bg: 'bg-gray-100', indicator: 'bg-gray-900' }\n};\n\nexport interface ListItemProps extends Omit<React.HTMLAttributes<HTMLElement>, 'title'> {\n component?: React.ElementType;\n href?: string;\n target?: string;\n rel?: string;\n type?: 'button' | 'submit' | 'reset';\n title?: React.ReactNode;\n subtitle?: React.ReactNode;\n overline?: React.ReactNode;\n prepend?: React.ReactNode;\n append?: React.ReactNode;\n active?: boolean;\n disabled?: boolean;\n inset?: boolean;\n density?: ListDensity;\n lines?: ListLines;\n nav?: boolean;\n divided?: boolean;\n color?: Palette;\n sharp?: boolean;\n}\n\nconst ListItem = React.forwardRef<HTMLElement, ListItemProps>((props, ref) => {\n const {\n component,\n href,\n target,\n rel,\n type,\n title,\n subtitle,\n overline,\n prepend,\n append,\n active = false,\n disabled = false,\n inset = false,\n density: densityOverride,\n lines: linesOverride,\n nav: navOverride,\n divided: dividedOverride,\n color: colorOverride,\n sharp: sharpOverride,\n className,\n children,\n tabIndex,\n role,\n ...rest\n } = props;\n\n const density = densityOverride ?? 'default';\n const lines = linesOverride ?? 'one';\n const nav = navOverride ?? false;\n const divided = dividedOverride ?? false;\n const color = colorOverride ?? 'primary';\n const sharp = sharpOverride ?? false;\n const accent = accentClasses[color] ?? accentClasses.primary;\n const shapeClass = divided || sharp ? 'rounded-none' : 'rounded-lg';\n\n const Component = component ?? (href ? 'a' : 'div');\n const interactive = typeof rest.onClick === 'function' || Component === 'a' || Component === 'button';\n\n const resolvedRole = role ?? 'listitem';\n const resolvedTabIndex = disabled ? -1 : tabIndex ?? (interactive && Component === 'div' ? 0 : undefined);\n const resolvedRel = Component === 'a' ? rel : undefined;\n const resolvedTarget = Component === 'a' ? target : undefined;\n const resolvedHref = Component === 'a' ? href : undefined;\n const resolvedType = Component === 'button' ? type ?? 'button' : undefined;\n\n const disabledClass = disabled ? 'pointer-events-none opacity-60' : 'cursor-pointer';\n const navPaddingClass = nav ? 'pl-5' : undefined;\n const insetClass = inset ? 'pl-12' : undefined;\n const activeClasses = active ? accent.bg : undefined;\n\n return (\n <Component\n {...rest}\n ref={ref}\n role={resolvedRole}\n tabIndex={resolvedTabIndex}\n aria-disabled={disabled || undefined}\n aria-current={active ? 'true' : undefined}\n className={twMerge(\n listItemBaseClasses,\n densityClasses[density],\n lineClasses[lines],\n shapeClass,\n navPaddingClass,\n insetClass,\n disabledClass,\n activeClasses,\n className\n )}\n href={resolvedHref}\n target={resolvedTarget}\n rel={resolvedRel}\n type={resolvedType}\n data-active={active || undefined}\n >\n {nav && (\n <span\n aria-hidden\n className={twMerge(\n 'absolute left-1 top-2 bottom-2 w-0.5 rounded-full bg-transparent transition-colors duration-150',\n active ? accent.indicator : undefined\n )}\n />\n )}\n {prepend && (\n <span className='flex h-10 w-10 shrink-0 items-center justify-center text-base text-gray-500'>{prepend}</span>\n )}\n <span className='flex min-w-0 flex-col gap-0.5 text-left'>\n {overline && (\n <span className='text-[0.65rem] font-semibold uppercase tracking-wide text-gray-500'>{overline}</span>\n )}\n {title && (\n <span className={twMerge('truncate font-medium text-gray-900', active ? accent.text : undefined)}>\n {title}\n </span>\n )}\n {subtitle && <span className='text-sm text-gray-500'>{subtitle}</span>}\n {children}\n </span>\n {append && (\n <span className='ml-auto flex items-center gap-2 whitespace-nowrap text-sm text-gray-500'>{append}</span>\n )}\n </Component>\n );\n});\n\nListItem.displayName = 'ListItem';\n\nexport default ListItem;\nexport type { ListDensity, ListLines } from '../types.list';\n","import * as React from 'react';\nimport { twMerge } from 'tailwind-merge';\nimport type { Palette } from '@lindle/linoardo/global.types';\n\nimport ListItem from './Item';\nimport type { ListItemProps } from './Item';\nimport type { ListDensity, ListLines, ListRounded, ListVariant } from './types.list';\n\nconst listBaseClasses = 'flex w-full min-w-0 flex-col text-gray-900 transition-colors duration-150';\n\nconst listVariantClasses: Record<ListVariant, string> = {\n solid: 'bg-white border border-gray-200 shadow-sm shadow-gray-900/5',\n sharp: 'bg-white border border-gray-200 shadow-sm shadow-gray-900/5 rounded-none',\n outline: 'bg-transparent border border-gray-300',\n ghost: 'bg-gray-50 border border-transparent',\n text: 'bg-transparent border border-transparent',\n filled: 'bg-gray-50 border border-gray-200 shadow-inner shadow-gray-900/5',\n underlined: 'bg-transparent border border-transparent border-b border-gray-200 rounded-none',\n rounded: 'bg-white border border-gray-200 shadow-lg shadow-gray-900/10'\n};\n\nconst listRoundedClasses: Record<ListRounded, string> = {\n none: 'rounded-none',\n sm: 'rounded-sm',\n md: 'rounded-md',\n lg: 'rounded-lg',\n xl: 'rounded-xl',\n pill: 'rounded-full'\n};\n\nexport interface ListProps extends React.HTMLAttributes<HTMLDivElement> {\n variant?: ListVariant;\n density?: ListDensity;\n lines?: ListLines;\n nav?: boolean;\n divided?: boolean;\n rounded?: ListRounded;\n color?: Palette;\n}\n\nconst isListItemElement = (element: React.ReactNode): element is React.ReactElement<ListItemProps> => {\n if (!React.isValidElement(element)) {\n return false;\n }\n\n const elementType = element.type as { displayName?: string };\n return element.type === ListItem || elementType.displayName === ListItem.displayName;\n};\n\nconst List = React.forwardRef<HTMLDivElement, ListProps>((props, ref) => {\n const {\n variant = 'solid',\n density = 'default',\n lines = 'one',\n nav = false,\n divided = false,\n rounded = 'lg',\n color = 'primary',\n className,\n role,\n children,\n ...rest\n } = props;\n\n const isSharpVariant = variant === 'sharp';\n const variantClass = listVariantClasses[variant] ?? listVariantClasses.solid;\n const roundedClass = isSharpVariant ? 'rounded-none' : listRoundedClasses[rounded] ?? listRoundedClasses.lg;\n const dividerClass = divided ? 'divide-y divide-gray-100' : undefined;\n const gapClass = divided ? 'p-0' : 'gap-1 p-1';\n const navClass = nav ? 'py-1' : undefined;\n const accentColor = color;\n\n const enhanceChild = (child: React.ReactNode): React.ReactNode => {\n if (!React.isValidElement(child)) {\n return child;\n }\n\n if (isListItemElement(child)) {\n return React.cloneElement(child, {\n density: child.props.density ?? density,\n lines: child.props.lines ?? lines,\n nav: child.props.nav ?? nav,\n divided: child.props.divided ?? divided,\n color: child.props.color ?? accentColor,\n sharp: child.props.sharp ?? isSharpVariant\n });\n }\n\n if (child.props && typeof child.props === 'object' && 'children' in child.props) {\n const nestedChildren = React.Children.map(child.props.children as React.ReactNode, enhanceChild);\n if (nestedChildren !== child.props.children) {\n return React.cloneElement(child, undefined, nestedChildren);\n }\n }\n\n return child;\n };\n\n const resolvedChildren = React.Children.map(children, enhanceChild);\n\n return (\n <div\n {...rest}\n ref={ref}\n role={role ?? 'list'}\n className={twMerge(listBaseClasses, variantClass, roundedClass, dividerClass, gapClass, navClass, className)}\n >\n {resolvedChildren}\n </div>\n );\n});\n\nList.displayName = 'List';\n\nexport { ListItem };\nexport type { ListItemProps } from './Item';\nexport type { ListVariant, ListDensity, ListLines, ListRounded } from './types.list';\nexport default List;\n"]}
|
|
1
|
+
{"version":3,"sources":["../src/Containment/List/Item/index.tsx","../src/Containment/List/index.tsx"],"names":["React","jsxs","twMerge","jsx","React2"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAMA,IAAM,mBAAA,GACJ,wQAAA;AAEF,IAAM,cAAA,GAA8C;AAAA,EAClD,OAAA,EAAS,qBAAA;AAAA,EACT,WAAA,EAAa,qBAAA;AAAA,EACb,OAAA,EAAS;AACX,CAAA;AAEA,IAAM,WAAA,GAAyC;AAAA,EAC7C,GAAA,EAAK,cAAA;AAAA,EACL,GAAA,EAAK,iBAAA;AAAA,EACL,KAAA,EAAO;AACT,CAAA;AAEA,IAAM,aAAA,GAAkF;AAAA,EACtF,SAAS,EAAE,IAAA,EAAM,gBAAgB,EAAA,EAAI,eAAA,EAAiB,WAAW,YAAA,EAAa;AAAA,EAC9E,SAAS,EAAE,IAAA,EAAM,iBAAiB,EAAA,EAAI,aAAA,EAAe,WAAW,aAAA,EAAc;AAAA,EAC9E,MAAM,EAAE,IAAA,EAAM,gBAAgB,EAAA,EAAI,WAAA,EAAa,WAAW,YAAA,EAAa;AAAA,EACvE,SAAS,EAAE,IAAA,EAAM,oBAAoB,EAAA,EAAI,eAAA,EAAiB,WAAW,gBAAA,EAAiB;AAAA,EACtF,SAAS,EAAE,IAAA,EAAM,kBAAkB,EAAA,EAAI,aAAA,EAAe,WAAW,cAAA,EAAe;AAAA,EAChF,QAAQ,EAAE,IAAA,EAAM,gBAAgB,EAAA,EAAI,WAAA,EAAa,WAAW,YAAA,EAAa;AAAA,EACzE,SAAS,EAAE,IAAA,EAAM,iBAAiB,EAAA,EAAI,aAAA,EAAe,WAAW,aAAA,EAAc;AAAA,EAC9E,IAAI,EAAE,IAAA,EAAM,iBAAiB,EAAA,EAAI,aAAA,EAAe,WAAW,aAAA;AAC7D,CAAA;AA2BA,IAAM,QAAA,GAAiBA,iBAAA,CAAA,UAAA,CAAuC,CAAC,KAAA,EAAO,GAAA,KAAQ;AAC5E,EAAA,MAAM;AAAA,IACJ,SAAA;AAAA,IACA,IAAA;AAAA,IACA,MAAA;AAAA,IACA,GAAA;AAAA,IACA,IAAA;AAAA,IACA,KAAA;AAAA,IACA,QAAA;AAAA,IACA,QAAA;AAAA,IACA,OAAA;AAAA,IACA,MAAA;AAAA,IACA,MAAA,GAAS,KAAA;AAAA,IACT,QAAA,GAAW,KAAA;AAAA,IACX,KAAA,GAAQ,KAAA;AAAA,IACR,OAAA,EAAS,eAAA;AAAA,IACT,KAAA,EAAO,aAAA;AAAA,IACP,GAAA,EAAK,WAAA;AAAA,IACL,OAAA,EAAS,eAAA;AAAA,IACT,KAAA,EAAO,aAAA;AAAA,IACP,KAAA,EAAO,aAAA;AAAA,IACP,SAAA;AAAA,IACA,QAAA;AAAA,IACA,QAAA;AAAA,IACA,IAAA;AAAA,IACA,GAAG;AAAA,GACL,GAAI,KAAA;AAEJ,EAAA,MAAM,UAAU,eAAA,IAAmB,SAAA;AACnC,EAAA,MAAM,QAAQ,aAAA,IAAiB,KAAA;AAC/B,EAAA,MAAM,MAAM,WAAA,IAAe,KAAA;AAC3B,EAAA,MAAM,UAAU,eAAA,IAAmB,KAAA;AACnC,EAAA,MAAM,QAAQ,aAAA,IAAiB,SAAA;AAC/B,EAAA,MAAM,QAAQ,aAAA,IAAiB,KAAA;AAC/B,EAAA,MAAM,MAAA,GAAS,aAAA,CAAc,KAAK,CAAA,IAAK,aAAA,CAAc,OAAA;AACrD,EAAA,MAAM,UAAA,GAAa,OAAA,IAAW,KAAA,GAAQ,cAAA,GAAiB,YAAA;AAEvD,EAAA,MAAM,SAAA,GAAY,SAAA,KAAc,IAAA,GAAO,GAAA,GAAM,KAAA,CAAA;AAC7C,EAAA,MAAM,cACJ,OAAO,IAAA,CAAK,YAAY,UAAA,IAAc,SAAA,KAAc,OAAO,SAAA,KAAc,QAAA;AAE3E,EAAA,MAAM,eAAe,IAAA,IAAQ,UAAA;AAC7B,EAAA,MAAM,mBAAmB,QAAA,GACrB,EAAA,GACA,aAAa,WAAA,IAAe,SAAA,KAAc,QAAQ,CAAA,GAAI,MAAA,CAAA;AAC1D,EAAA,MAAM,WAAA,GAAc,SAAA,KAAc,GAAA,GAAM,GAAA,GAAM,MAAA;AAC9C,EAAA,MAAM,cAAA,GAAiB,SAAA,KAAc,GAAA,GAAM,MAAA,GAAS,MAAA;AACpD,EAAA,MAAM,YAAA,GAAe,SAAA,KAAc,GAAA,GAAM,IAAA,GAAO,MAAA;AAChD,EAAA,MAAM,YAAA,GAAe,SAAA,KAAc,QAAA,GAAW,IAAA,IAAQ,QAAA,GAAW,MAAA;AAEjE,EAAA,MAAM,aAAA,GAAgB,WAAW,gCAAA,GAAmC,gBAAA;AACpE,EAAA,MAAM,eAAA,GAAkB,MAAM,MAAA,GAAS,MAAA;AACvC,EAAA,MAAM,UAAA,GAAa,QAAQ,OAAA,GAAU,MAAA;AACrC,EAAA,MAAM,aAAA,GAAgB,MAAA,GAAS,MAAA,CAAO,EAAA,GAAK,MAAA;AAE3C,EAAA,uBACEC,eAAA;AAAA,IAAC,SAAA;AAAA,IAAA;AAAA,MACE,GAAG,IAAA;AAAA,MACJ,GAAA;AAAA,MACA,IAAA,EAAM,YAAA;AAAA,MACN,QAAA,EAAU,gBAAA;AAAA,MACV,iBAAe,QAAA,IAAY,MAAA;AAAA,MAC3B,cAAA,EAAc,SAAS,MAAA,GAAS,MAAA;AAAA,MAChC,SAAA,EAAWC,qBAAA;AAAA,QACT,mBAAA;AAAA,QACA,eAAe,OAAO,CAAA;AAAA,QACtB,YAAY,KAAK,CAAA;AAAA,QACjB,UAAA;AAAA,QACA,eAAA;AAAA,QACA,UAAA;AAAA,QACA,aAAA;AAAA,QACA,aAAA;AAAA,QACA;AAAA,OACF;AAAA,MACA,IAAA,EAAM,YAAA;AAAA,MACN,MAAA,EAAQ,cAAA;AAAA,MACR,GAAA,EAAK,WAAA;AAAA,MACL,IAAA,EAAM,YAAA;AAAA,MACN,eAAa,MAAA,IAAU,MAAA;AAAA,MAEtB,QAAA,EAAA;AAAA,QAAA,GAAA,oBACCC,cAAA;AAAA,UAAC,MAAA;AAAA,UAAA;AAAA,YACC,aAAA,EAAW,IAAA;AAAA,YACX,SAAA,EAAWD,qBAAA;AAAA,cACT,iGAAA;AAAA,cACA,MAAA,GAAS,OAAO,SAAA,GAAY;AAAA;AAC9B;AAAA,SACF;AAAA,QAED,OAAA,oBACCC,cAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,+EACb,QAAA,EAAA,OAAA,EACH,CAAA;AAAA,wBAEFF,eAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,yCAAA,EACb,QAAA,EAAA;AAAA,UAAA,QAAA,oBACCE,cAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,oEAAA,EACb,QAAA,EAAA,QAAA,EACH,CAAA;AAAA,UAED,KAAA,oBACCA,cAAA;AAAA,YAAC,MAAA;AAAA,YAAA;AAAA,cACC,SAAA,EAAWD,qBAAA;AAAA,gBACT,oCAAA;AAAA,gBACA,MAAA,GAAS,OAAO,IAAA,GAAO;AAAA,eACzB;AAAA,cAEC,QAAA,EAAA;AAAA;AAAA,WACH;AAAA,UAED,QAAA,oBAAYC,cAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,yBAAyB,QAAA,EAAA,QAAA,EAAS,CAAA;AAAA,UAC9D;AAAA,SAAA,EACH,CAAA;AAAA,QACC,MAAA,oBACCA,cAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,2EACb,QAAA,EAAA,MAAA,EACH;AAAA;AAAA;AAAA,GAEJ;AAEJ,CAAC,CAAA;AAED,QAAA,CAAS,WAAA,GAAc,UAAA;AAEvB,IAAO,YAAA,GAAQ;AC7Kf,IAAM,eAAA,GAAkB,2EAAA;AAExB,IAAM,kBAAA,GAAkD;AAAA,EACtD,KAAA,EAAO,6DAAA;AAAA,EACP,KAAA,EAAO,0EAAA;AAAA,EACP,OAAA,EAAS,uCAAA;AAAA,EACT,KAAA,EAAO,sCAAA;AAAA,EACP,IAAA,EAAM,0CAAA;AAAA,EACN,MAAA,EAAQ,kEAAA;AAAA,EACR,UAAA,EAAY,gFAAA;AAAA,EACZ,OAAA,EAAS;AACX,CAAA;AAEA,IAAM,kBAAA,GAAkD;AAAA,EACtD,IAAA,EAAM,cAAA;AAAA,EACN,EAAA,EAAI,YAAA;AAAA,EACJ,EAAA,EAAI,YAAA;AAAA,EACJ,EAAA,EAAI,YAAA;AAAA,EACJ,EAAA,EAAI,YAAA;AAAA,EACJ,IAAA,EAAM;AACR,CAAA;AAYA,IAAM,iBAAA,GAAoB,CACxB,OAAA,KACiD;AACjD,EAAA,IAAI,CAAOC,iBAAA,CAAA,cAAA,CAAe,OAAO,CAAA,EAAG;AAClC,IAAA,OAAO,KAAA;AAAA,EACT;AAEA,EAAA,MAAM,cAAc,OAAA,CAAQ,IAAA;AAC5B,EAAA,OAAO,OAAA,CAAQ,IAAA,KAAS,YAAA,IAAY,WAAA,CAAY,gBAAgB,YAAA,CAAS,WAAA;AAC3E,CAAA;AAKA,IAAM,IAAA,GAAaA,iBAAA,CAAA,UAAA,CAAsC,CAAC,KAAA,EAAO,GAAA,KAAQ;AACvE,EAAA,MAAM;AAAA,IACJ,OAAA,GAAU,OAAA;AAAA,IACV,OAAA,GAAU,SAAA;AAAA,IACV,KAAA,GAAQ,KAAA;AAAA,IACR,GAAA,GAAM,KAAA;AAAA,IACN,OAAA,GAAU,KAAA;AAAA,IACV,OAAA,GAAU,IAAA;AAAA,IACV,KAAA,GAAQ,SAAA;AAAA,IACR,SAAA;AAAA,IACA,IAAA;AAAA,IACA,QAAA;AAAA,IACA,GAAG;AAAA,GACL,GAAI,KAAA;AAEJ,EAAA,MAAM,iBAAiB,OAAA,KAAY,OAAA;AACnC,EAAA,MAAM,YAAA,GAAe,kBAAA,CAAmB,OAAO,CAAA,IAAK,kBAAA,CAAmB,KAAA;AACvE,EAAA,MAAM,eAAe,cAAA,GACjB,cAAA,GACA,kBAAA,CAAmB,OAAO,KAAK,kBAAA,CAAmB,EAAA;AACtD,EAAA,MAAM,YAAA,GAAe,UAAU,0BAAA,GAA6B,MAAA;AAC5D,EAAA,MAAM,QAAA,GAAW,UAAU,KAAA,GAAQ,WAAA;AACnC,EAAA,MAAM,QAAA,GAAW,MAAM,MAAA,GAAS,MAAA;AAChC,EAAA,MAAM,WAAA,GAAc,KAAA;AAEpB,EAAA,MAAM,YAAA,GAAe,CAAC,KAAA,KAA4C;AAChE,IAAA,IAAI,CAAOA,iBAAA,CAAA,cAAA,CAAe,KAAK,CAAA,EAAG;AAChC,MAAA,OAAO,KAAA;AAAA,IACT;AAEA,IAAA,IAAI,iBAAA,CAAkB,KAAK,CAAA,EAAG;AAC5B,MAAA,OAAaA,+BAAa,KAAA,EAAO;AAAA,QAC/B,OAAA,EAAS,KAAA,CAAM,KAAA,CAAM,OAAA,IAAW,OAAA;AAAA,QAChC,KAAA,EAAO,KAAA,CAAM,KAAA,CAAM,KAAA,IAAS,KAAA;AAAA,QAC5B,GAAA,EAAK,KAAA,CAAM,KAAA,CAAM,GAAA,IAAO,GAAA;AAAA,QACxB,OAAA,EAAS,KAAA,CAAM,KAAA,CAAM,OAAA,IAAW,OAAA;AAAA,QAChC,KAAA,EAAO,KAAA,CAAM,KAAA,CAAM,KAAA,IAAS,WAAA;AAAA,QAC5B,KAAA,EAAO,KAAA,CAAM,KAAA,CAAM,KAAA,IAAS;AAAA,OAC7B,CAAA;AAAA,IACH;AAEA,IAAA,IAAI,KAAA,CAAM,SAAS,OAAO,KAAA,CAAM,UAAU,QAAA,IAAY,UAAA,IAAc,MAAM,KAAA,EAAO;AAC/E,MAAA,MAAM,iBAAuBA,iBAAA,CAAA,QAAA,CAAS,GAAA;AAAA,QACpC,MAAM,KAAA,CAAM,QAAA;AAAA,QACZ;AAAA,OACF;AACA,MAAA,IAAI,cAAA,KAAmB,KAAA,CAAM,KAAA,CAAM,QAAA,EAAU;AAC3C,QAAA,OAAaA,iBAAA,CAAA,YAAA,CAAa,KAAA,EAAO,MAAA,EAAW,cAAc,CAAA;AAAA,MAC5D;AAAA,IACF;AAEA,IAAA,OAAO,KAAA;AAAA,EACT,CAAA;AAEA,EAAA,MAAM,gBAAA,GAAyBA,iBAAA,CAAA,QAAA,CAAS,GAAA,CAAI,QAAA,EAAU,YAAY,CAAA;AAElE,EAAA,uBACED,cAAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACE,GAAG,IAAA;AAAA,MACJ,GAAA;AAAA,MACA,MAAM,IAAA,IAAQ,MAAA;AAAA,MACd,SAAA,EAAWD,qBAAAA;AAAA,QACT,eAAA;AAAA,QACA,YAAA;AAAA,QACA,YAAA;AAAA,QACA,YAAA;AAAA,QACA,QAAA;AAAA,QACA,QAAA;AAAA,QACA;AAAA,OACF;AAAA,MAEC,QAAA,EAAA;AAAA;AAAA,GACH;AAEJ,CAAC,CAAA;AAED,IAAA,CAAK,WAAA,GAAc,MAAA;AAKnB,IAAO,YAAA,GAAQ","file":"list.cjs","sourcesContent":["import * as React from 'react';\nimport { twMerge } from 'tailwind-merge';\nimport type { Palette } from '@lindle/linoardo/global.types';\n\nimport type { ListDensity, ListLines } from '../types.list';\n\nconst listItemBaseClasses =\n 'relative flex w-full items-center gap-4 bg-transparent text-left text-sm transition-colors duration-150 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/40 focus-visible:ring-offset-2 focus-visible:ring-offset-white hover:bg-neutral-200';\n\nconst densityClasses: Record<ListDensity, string> = {\n default: 'px-4 py-3 text-base',\n comfortable: 'px-4 py-2.5 text-sm',\n compact: 'px-3 py-2 text-sm'\n};\n\nconst lineClasses: Record<ListLines, string> = {\n one: 'min-h-[3rem]',\n two: 'min-h-[3.75rem]',\n three: 'min-h-[4.5rem]'\n};\n\nconst accentClasses: Record<Palette, { text: string; bg: string; indicator: string }> = {\n primary: { text: 'text-primary', bg: 'bg-primary/10', indicator: 'bg-primary' },\n neutral: { text: 'text-gray-900', bg: 'bg-gray-100', indicator: 'bg-gray-900' },\n info: { text: 'text-sky-600', bg: 'bg-sky-50', indicator: 'bg-sky-500' },\n success: { text: 'text-emerald-600', bg: 'bg-emerald-50', indicator: 'bg-emerald-500' },\n warning: { text: 'text-amber-700', bg: 'bg-amber-50', indicator: 'bg-amber-500' },\n danger: { text: 'text-red-600', bg: 'bg-red-50', indicator: 'bg-red-500' },\n surface: { text: 'text-gray-900', bg: 'bg-gray-100', indicator: 'bg-gray-900' },\n bw: { text: 'text-gray-900', bg: 'bg-gray-100', indicator: 'bg-gray-900' }\n};\n\nexport interface ListItemProps extends Omit<React.HTMLAttributes<HTMLElement>, 'title'> {\n component?: React.ElementType;\n href?: string;\n target?: string;\n rel?: string;\n type?: 'button' | 'submit' | 'reset';\n title?: React.ReactNode;\n subtitle?: React.ReactNode;\n overline?: React.ReactNode;\n prepend?: React.ReactNode;\n append?: React.ReactNode;\n active?: boolean;\n disabled?: boolean;\n inset?: boolean;\n density?: ListDensity;\n lines?: ListLines;\n nav?: boolean;\n divided?: boolean;\n color?: Palette;\n sharp?: boolean;\n}\n\n/**\n * Single list row supporting titles, overlines, adornments and navigation styling.\n */\nconst ListItem = React.forwardRef<HTMLElement, ListItemProps>((props, ref) => {\n const {\n component,\n href,\n target,\n rel,\n type,\n title,\n subtitle,\n overline,\n prepend,\n append,\n active = false,\n disabled = false,\n inset = false,\n density: densityOverride,\n lines: linesOverride,\n nav: navOverride,\n divided: dividedOverride,\n color: colorOverride,\n sharp: sharpOverride,\n className,\n children,\n tabIndex,\n role,\n ...rest\n } = props;\n\n const density = densityOverride ?? 'default';\n const lines = linesOverride ?? 'one';\n const nav = navOverride ?? false;\n const divided = dividedOverride ?? false;\n const color = colorOverride ?? 'primary';\n const sharp = sharpOverride ?? false;\n const accent = accentClasses[color] ?? accentClasses.primary;\n const shapeClass = divided || sharp ? 'rounded-none' : 'rounded-lg';\n\n const Component = component ?? (href ? 'a' : 'div');\n const interactive =\n typeof rest.onClick === 'function' || Component === 'a' || Component === 'button';\n\n const resolvedRole = role ?? 'listitem';\n const resolvedTabIndex = disabled\n ? -1\n : tabIndex ?? (interactive && Component === 'div' ? 0 : undefined);\n const resolvedRel = Component === 'a' ? rel : undefined;\n const resolvedTarget = Component === 'a' ? target : undefined;\n const resolvedHref = Component === 'a' ? href : undefined;\n const resolvedType = Component === 'button' ? type ?? 'button' : undefined;\n\n const disabledClass = disabled ? 'pointer-events-none opacity-60' : 'cursor-pointer';\n const navPaddingClass = nav ? 'pl-5' : undefined;\n const insetClass = inset ? 'pl-12' : undefined;\n const activeClasses = active ? accent.bg : undefined;\n\n return (\n <Component\n {...rest}\n ref={ref}\n role={resolvedRole}\n tabIndex={resolvedTabIndex}\n aria-disabled={disabled || undefined}\n aria-current={active ? 'true' : undefined}\n className={twMerge(\n listItemBaseClasses,\n densityClasses[density],\n lineClasses[lines],\n shapeClass,\n navPaddingClass,\n insetClass,\n disabledClass,\n activeClasses,\n className\n )}\n href={resolvedHref}\n target={resolvedTarget}\n rel={resolvedRel}\n type={resolvedType}\n data-active={active || undefined}\n >\n {nav && (\n <span\n aria-hidden\n className={twMerge(\n 'absolute left-1 top-2 bottom-2 w-0.5 rounded-full bg-transparent transition-colors duration-150',\n active ? accent.indicator : undefined\n )}\n />\n )}\n {prepend && (\n <span className='flex h-10 w-10 shrink-0 items-center justify-center text-base text-gray-500'>\n {prepend}\n </span>\n )}\n <span className='flex min-w-0 flex-col gap-0.5 text-left'>\n {overline && (\n <span className='text-[0.65rem] font-semibold uppercase tracking-wide text-gray-500'>\n {overline}\n </span>\n )}\n {title && (\n <span\n className={twMerge(\n 'truncate font-medium text-gray-900',\n active ? accent.text : undefined\n )}\n >\n {title}\n </span>\n )}\n {subtitle && <span className='text-sm text-gray-500'>{subtitle}</span>}\n {children}\n </span>\n {append && (\n <span className='ml-auto flex items-center gap-2 whitespace-nowrap text-sm text-gray-500'>\n {append}\n </span>\n )}\n </Component>\n );\n});\n\nListItem.displayName = 'ListItem';\n\nexport default ListItem;\nexport type { ListDensity, ListLines } from '../types.list';\n","import * as React from 'react';\nimport { twMerge } from 'tailwind-merge';\nimport type { Palette } from '@lindle/linoardo/global.types';\n\nimport ListItem from './Item';\nimport type { ListItemProps } from './Item';\nimport type { ListDensity, ListLines, ListRounded, ListVariant } from './types.list';\n\nconst listBaseClasses = 'flex w-full min-w-0 flex-col text-gray-900 transition-colors duration-150';\n\nconst listVariantClasses: Record<ListVariant, string> = {\n solid: 'bg-white border border-gray-200 shadow-sm shadow-gray-900/5',\n sharp: 'bg-white border border-gray-200 shadow-sm shadow-gray-900/5 rounded-none',\n outline: 'bg-transparent border border-gray-300',\n ghost: 'bg-gray-50 border border-transparent',\n text: 'bg-transparent border border-transparent',\n filled: 'bg-gray-50 border border-gray-200 shadow-inner shadow-gray-900/5',\n underlined: 'bg-transparent border border-transparent border-b border-gray-200 rounded-none',\n rounded: 'bg-white border border-gray-200 shadow-lg shadow-gray-900/10'\n};\n\nconst listRoundedClasses: Record<ListRounded, string> = {\n none: 'rounded-none',\n sm: 'rounded-sm',\n md: 'rounded-md',\n lg: 'rounded-lg',\n xl: 'rounded-xl',\n pill: 'rounded-full'\n};\n\nexport interface ListProps extends React.HTMLAttributes<HTMLDivElement> {\n variant?: ListVariant;\n density?: ListDensity;\n lines?: ListLines;\n nav?: boolean;\n divided?: boolean;\n rounded?: ListRounded;\n color?: Palette;\n}\n\nconst isListItemElement = (\n element: React.ReactNode\n): element is React.ReactElement<ListItemProps> => {\n if (!React.isValidElement(element)) {\n return false;\n }\n\n const elementType = element.type as { displayName?: string };\n return element.type === ListItem || elementType.displayName === ListItem.displayName;\n};\n\n/**\n * List container that normalizes spacing, rounding and density for nested `ListItem` children.\n */\nconst List = React.forwardRef<HTMLDivElement, ListProps>((props, ref) => {\n const {\n variant = 'solid',\n density = 'default',\n lines = 'one',\n nav = false,\n divided = false,\n rounded = 'lg',\n color = 'primary',\n className,\n role,\n children,\n ...rest\n } = props;\n\n const isSharpVariant = variant === 'sharp';\n const variantClass = listVariantClasses[variant] ?? listVariantClasses.solid;\n const roundedClass = isSharpVariant\n ? 'rounded-none'\n : listRoundedClasses[rounded] ?? listRoundedClasses.lg;\n const dividerClass = divided ? 'divide-y divide-gray-100' : undefined;\n const gapClass = divided ? 'p-0' : 'gap-1 p-1';\n const navClass = nav ? 'py-1' : undefined;\n const accentColor = color;\n\n const enhanceChild = (child: React.ReactNode): React.ReactNode => {\n if (!React.isValidElement(child)) {\n return child;\n }\n\n if (isListItemElement(child)) {\n return React.cloneElement(child, {\n density: child.props.density ?? density,\n lines: child.props.lines ?? lines,\n nav: child.props.nav ?? nav,\n divided: child.props.divided ?? divided,\n color: child.props.color ?? accentColor,\n sharp: child.props.sharp ?? isSharpVariant\n });\n }\n\n if (child.props && typeof child.props === 'object' && 'children' in child.props) {\n const nestedChildren = React.Children.map(\n child.props.children as React.ReactNode,\n enhanceChild\n );\n if (nestedChildren !== child.props.children) {\n return React.cloneElement(child, undefined, nestedChildren);\n }\n }\n\n return child;\n };\n\n const resolvedChildren = React.Children.map(children, enhanceChild);\n\n return (\n <div\n {...rest}\n ref={ref}\n role={role ?? 'list'}\n className={twMerge(\n listBaseClasses,\n variantClass,\n roundedClass,\n dividerClass,\n gapClass,\n navClass,\n className\n )}\n >\n {resolvedChildren}\n </div>\n );\n});\n\nList.displayName = 'List';\n\nexport { ListItem };\nexport type { ListItemProps } from './Item';\nexport type { ListVariant, ListDensity, ListLines, ListRounded } from './types.list';\nexport default List;\n"]}
|
package/dist/list.d.cts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as react from 'react';
|
|
2
2
|
import { P as Palette } from './global.types-E2uVLemv.cjs';
|
|
3
|
-
import { b as ListVariant, c as ListDensity, d as ListLines, e as ListRounded } from './index-
|
|
4
|
-
export { L as ListItem, a as ListItemProps } from './index-
|
|
3
|
+
import { b as ListVariant, c as ListDensity, d as ListLines, e as ListRounded } from './index-B5n8tN2G.cjs';
|
|
4
|
+
export { L as ListItem, a as ListItemProps } from './index-B5n8tN2G.cjs';
|
|
5
5
|
|
|
6
6
|
interface ListProps extends react.HTMLAttributes<HTMLDivElement> {
|
|
7
7
|
variant?: ListVariant;
|
|
@@ -12,6 +12,9 @@ interface ListProps extends react.HTMLAttributes<HTMLDivElement> {
|
|
|
12
12
|
rounded?: ListRounded;
|
|
13
13
|
color?: Palette;
|
|
14
14
|
}
|
|
15
|
+
/**
|
|
16
|
+
* List container that normalizes spacing, rounding and density for nested `ListItem` children.
|
|
17
|
+
*/
|
|
15
18
|
declare const List: react.ForwardRefExoticComponent<ListProps & react.RefAttributes<HTMLDivElement>>;
|
|
16
19
|
|
|
17
20
|
export { ListDensity, ListLines, type ListProps, ListRounded, ListVariant, List as default };
|
package/dist/list.d.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as react from 'react';
|
|
2
2
|
import { P as Palette } from './global.types-E2uVLemv.js';
|
|
3
|
-
import { b as ListVariant, c as ListDensity, d as ListLines, e as ListRounded } from './index-
|
|
4
|
-
export { L as ListItem, a as ListItemProps } from './index-
|
|
3
|
+
import { b as ListVariant, c as ListDensity, d as ListLines, e as ListRounded } from './index-D4-O-oJt.js';
|
|
4
|
+
export { L as ListItem, a as ListItemProps } from './index-D4-O-oJt.js';
|
|
5
5
|
|
|
6
6
|
interface ListProps extends react.HTMLAttributes<HTMLDivElement> {
|
|
7
7
|
variant?: ListVariant;
|
|
@@ -12,6 +12,9 @@ interface ListProps extends react.HTMLAttributes<HTMLDivElement> {
|
|
|
12
12
|
rounded?: ListRounded;
|
|
13
13
|
color?: Palette;
|
|
14
14
|
}
|
|
15
|
+
/**
|
|
16
|
+
* List container that normalizes spacing, rounding and density for nested `ListItem` children.
|
|
17
|
+
*/
|
|
15
18
|
declare const List: react.ForwardRefExoticComponent<ListProps & react.RefAttributes<HTMLDivElement>>;
|
|
16
19
|
|
|
17
20
|
export { ListDensity, ListLines, type ListProps, ListRounded, ListVariant, List as default };
|
package/dist/list.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export { List_default as default } from './chunk-
|
|
2
|
-
export { Item_default as ListItem } from './chunk-
|
|
1
|
+
export { List_default as default } from './chunk-AK7LFJI4.js';
|
|
2
|
+
export { Item_default as ListItem } from './chunk-5WQW6YSJ.js';
|
|
3
3
|
//# sourceMappingURL=list.js.map
|
|
4
4
|
//# sourceMappingURL=list.js.map
|