@lindle/linoardo 1.0.43 → 1.0.45
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-CEhDj2Uw.d.cts → ExpansionPanelItem-B9srsYMI.d.cts} +0 -1
- package/dist/{ExpansionPanelItem-C4-2nlhq.d.ts → ExpansionPanelItem-DYcbxZnv.d.ts} +0 -1
- package/dist/{chunk-SCJMH5VE.js → chunk-67TAA2MA.js} +3 -2
- package/dist/chunk-67TAA2MA.js.map +1 -0
- package/dist/chunk-FJNKMRYQ.js +85 -0
- package/dist/chunk-FJNKMRYQ.js.map +1 -0
- package/dist/{chunk-KRYWWWXR.js → chunk-RG5FCFLX.js} +25 -52
- package/dist/chunk-RG5FCFLX.js.map +1 -0
- package/dist/expansion-panel/item.cjs +22 -49
- package/dist/expansion-panel/item.cjs.map +1 -1
- package/dist/expansion-panel/item.d.cts +1 -1
- package/dist/expansion-panel/item.d.ts +1 -1
- package/dist/expansion-panel/item.js +1 -1
- package/dist/expansion-panel.cjs +37 -109
- package/dist/expansion-panel.cjs.map +1 -1
- package/dist/expansion-panel.d.cts +8 -5
- package/dist/expansion-panel.d.ts +8 -5
- package/dist/expansion-panel.js +2 -2
- package/dist/index.cjs +37 -109
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.js +3 -3
- package/dist/styles.css +31 -11
- package/dist/textarea.cjs +1 -0
- package/dist/textarea.cjs.map +1 -1
- package/dist/textarea.js +1 -1
- package/package.json +3 -2
- package/dist/chunk-HBF4S2KY.js +0 -131
- package/dist/chunk-HBF4S2KY.js.map +0 -1
- package/dist/chunk-KRYWWWXR.js.map +0 -1
- package/dist/chunk-SCJMH5VE.js.map +0 -1
package/dist/expansion-panel.cjs
CHANGED
|
@@ -6,6 +6,7 @@ var react = require('react');
|
|
|
6
6
|
var tailwindMerge = require('tailwind-merge');
|
|
7
7
|
var jsxRuntime = require('react/jsx-runtime');
|
|
8
8
|
|
|
9
|
+
// src/Containment/ExpansionPanel/index.tsx
|
|
9
10
|
var EXPANSION_PANEL_CONTEXT_PROP = "__expansionPanelContext";
|
|
10
11
|
var EXPANSION_PANEL_ITEM_MARKER = "__isExpansionPanelItem";
|
|
11
12
|
var hasMarker = (type) => {
|
|
@@ -110,31 +111,17 @@ var ExpansionPanelItemInner = (props) => {
|
|
|
110
111
|
__expansionPanelContext,
|
|
111
112
|
...rest
|
|
112
113
|
} = props;
|
|
113
|
-
const [standaloneExpanded, setStandaloneExpanded] = react.useState(false);
|
|
114
|
-
const generatedValueRef = react.useRef(null);
|
|
115
|
-
if (generatedValueRef.current === null) {
|
|
116
|
-
generatedValueRef.current = generateId("expansion-panel-value");
|
|
117
|
-
}
|
|
118
|
-
const generatedValue = generatedValueRef.current;
|
|
119
|
-
const headerIdRef = react.useRef(null);
|
|
120
|
-
if (!headerIdRef.current) {
|
|
121
|
-
headerIdRef.current = generateId("expansion-panel-header");
|
|
122
|
-
}
|
|
123
|
-
const headerId = headerIdRef.current;
|
|
124
|
-
const contentIdRef = react.useRef(null);
|
|
125
|
-
if (!contentIdRef.current) {
|
|
126
|
-
contentIdRef.current = generateId("expansion-panel-content");
|
|
127
|
-
}
|
|
128
|
-
const contentId = contentIdRef.current;
|
|
129
114
|
const context = __expansionPanelContext ?? null;
|
|
130
|
-
const
|
|
115
|
+
const safeValue = typeof value === "string" || typeof value === "number" ? String(value) : null;
|
|
116
|
+
const idBase = safeValue ?? generateId("expansion-panel");
|
|
117
|
+
const inputId = `expansion-panel-toggle-${idBase}`;
|
|
131
118
|
const density = context?.density ?? "default";
|
|
132
119
|
const color = colorOverride ?? context?.color ?? "primary";
|
|
133
120
|
const divider = context?.divider ?? true;
|
|
134
121
|
const variant = context?.variant ?? "elevated";
|
|
135
122
|
const rounded = context?.rounded ?? "lg";
|
|
136
123
|
const accent = accentClasses[color] ?? accentClasses.primary;
|
|
137
|
-
const isExpanded =
|
|
124
|
+
const isExpanded = value !== null && value !== void 0 ? context?.expandedValues.includes(value) ?? false : false;
|
|
138
125
|
const rootSurface = divider ? "bg-transparent border-0 shadow-none" : itemVariantClasses[variant];
|
|
139
126
|
const shapeClass = divider ? void 0 : roundedClasses[rounded] ?? roundedClasses.lg;
|
|
140
127
|
const densityPadding = densityClasses[density] ?? densityClasses.default;
|
|
@@ -152,30 +139,19 @@ var ExpansionPanelItemInner = (props) => {
|
|
|
152
139
|
}
|
|
153
140
|
);
|
|
154
141
|
const hasContent = Boolean(children ?? text);
|
|
155
|
-
const contentAnimationClass = isExpanded ? "pb-5 opacity-100" : "pb-0 opacity-0";
|
|
156
142
|
const toggleIconNode = hideToggleIcon ? null : isExpanded && collapseIcon ? collapseIcon : expandIcon ?? defaultToggleIcon;
|
|
157
143
|
const shouldRotateDefaultIcon = !expandIcon && !collapseIcon && !hideToggleIcon;
|
|
158
144
|
const toggleWrapperClass = tailwindMerge.twMerge(
|
|
159
|
-
"ml-3 flex h-6 w-6 items-center justify-center text-gray-500 transition-transform duration-200",
|
|
145
|
+
"expansion-panel-item__icon ml-3 flex h-6 w-6 items-center justify-center text-gray-500 transition-transform duration-200",
|
|
160
146
|
shouldRotateDefaultIcon && isExpanded ? "rotate-180" : void 0
|
|
161
147
|
);
|
|
162
|
-
const handleToggle = () => {
|
|
163
|
-
if (disabled) {
|
|
164
|
-
return;
|
|
165
|
-
}
|
|
166
|
-
if (context) {
|
|
167
|
-
context.toggle(panelValue, disabled);
|
|
168
|
-
return;
|
|
169
|
-
}
|
|
170
|
-
setStandaloneExpanded((prev) => !prev);
|
|
171
|
-
};
|
|
172
148
|
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
173
149
|
"div",
|
|
174
150
|
{
|
|
175
151
|
...rest,
|
|
176
152
|
ref: forwardedRef,
|
|
177
153
|
className: tailwindMerge.twMerge(
|
|
178
|
-
"expansion-panel-item flex flex-col overflow-hidden transition-colors duration-200",
|
|
154
|
+
"expansion-panel-item group flex flex-col overflow-hidden transition-colors duration-200",
|
|
179
155
|
rootSurface,
|
|
180
156
|
shapeClass,
|
|
181
157
|
className
|
|
@@ -183,22 +159,28 @@ var ExpansionPanelItemInner = (props) => {
|
|
|
183
159
|
"data-state": isExpanded ? "open" : "closed",
|
|
184
160
|
"data-disabled": disabled || void 0,
|
|
185
161
|
children: [
|
|
162
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
163
|
+
"input",
|
|
164
|
+
{
|
|
165
|
+
id: inputId,
|
|
166
|
+
type: "checkbox",
|
|
167
|
+
className: "expansion-panel-item__toggle",
|
|
168
|
+
defaultChecked: isExpanded,
|
|
169
|
+
disabled
|
|
170
|
+
}
|
|
171
|
+
),
|
|
186
172
|
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
187
|
-
"
|
|
173
|
+
"label",
|
|
188
174
|
{
|
|
189
|
-
|
|
190
|
-
id: headerId,
|
|
191
|
-
onClick: handleToggle,
|
|
192
|
-
disabled,
|
|
193
|
-
"aria-expanded": isExpanded,
|
|
194
|
-
"aria-controls": hasContent ? contentId : void 0,
|
|
175
|
+
htmlFor: inputId,
|
|
195
176
|
className: tailwindMerge.twMerge(
|
|
196
|
-
"flex w-full items-center gap-4 px-4 text-left
|
|
177
|
+
"expansion-panel-item__header flex w-full list-none items-center gap-4 px-4 text-left",
|
|
197
178
|
densityPadding,
|
|
198
179
|
disabledClass,
|
|
199
180
|
isExpanded ? accent.bg : void 0,
|
|
200
181
|
headerClassName
|
|
201
182
|
),
|
|
183
|
+
"aria-disabled": disabled || void 0,
|
|
202
184
|
"data-state": isExpanded ? "open" : "closed",
|
|
203
185
|
children: [
|
|
204
186
|
prepend && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex h-10 w-10 items-center justify-center text-gray-500", children: prepend }),
|
|
@@ -214,22 +196,14 @@ var ExpansionPanelItemInner = (props) => {
|
|
|
214
196
|
hasContent && /* @__PURE__ */ jsxRuntime.jsx(
|
|
215
197
|
"div",
|
|
216
198
|
{
|
|
217
|
-
className: "
|
|
218
|
-
style: { gridTemplateRows: isExpanded ? "1fr" : "0fr" },
|
|
219
|
-
"aria-hidden": isExpanded ? void 0 : true,
|
|
199
|
+
className: "expansion-panel-item__content overflow-hidden border-t border-gray-100",
|
|
220
200
|
"data-state": isExpanded ? "open" : "closed",
|
|
221
201
|
children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
222
202
|
"div",
|
|
223
203
|
{
|
|
224
|
-
id: contentId,
|
|
225
|
-
role: "region",
|
|
226
|
-
"aria-labelledby": headerId,
|
|
227
|
-
"data-state": isExpanded ? "open" : "closed",
|
|
228
204
|
className: tailwindMerge.twMerge(
|
|
229
|
-
"min-h-0 px-4 pt-0 text-sm text-gray-600
|
|
205
|
+
"expansion-panel-item__body min-h-0 px-4 pt-0 text-sm text-gray-600",
|
|
230
206
|
activeBorderClass,
|
|
231
|
-
contentAnimationClass,
|
|
232
|
-
isExpanded ? "pointer-events-auto" : "pointer-events-none",
|
|
233
207
|
contentClassName
|
|
234
208
|
),
|
|
235
209
|
children: children ?? text
|
|
@@ -269,7 +243,6 @@ var normalizeValues = (value, allowMultiple) => {
|
|
|
269
243
|
}
|
|
270
244
|
return normalized.length ? [normalized[0]] : [];
|
|
271
245
|
};
|
|
272
|
-
var clampValues = (values, allowMultiple) => allowMultiple ? uniqueValues(values) : values.length ? [values[0]] : [];
|
|
273
246
|
var ExpansionPanelInner = (props, forwardedRef) => {
|
|
274
247
|
const {
|
|
275
248
|
variant = "elevated",
|
|
@@ -286,64 +259,16 @@ var ExpansionPanelInner = (props, forwardedRef) => {
|
|
|
286
259
|
...rest
|
|
287
260
|
} = props;
|
|
288
261
|
const allowMultiple = multiple ?? false;
|
|
289
|
-
const
|
|
290
|
-
const
|
|
291
|
-
|
|
292
|
-
|
|
293
|
-
|
|
294
|
-
|
|
295
|
-
|
|
296
|
-
|
|
297
|
-
|
|
298
|
-
|
|
299
|
-
setInternalValues((prev) => clampValues(prev, allowMultiple));
|
|
300
|
-
}
|
|
301
|
-
prevAllowMultipleRef.current = allowMultiple;
|
|
302
|
-
prevIsControlledRef.current = isControlled;
|
|
303
|
-
}, [allowMultiple, isControlled]);
|
|
304
|
-
const handleValueChange = react.useCallback(
|
|
305
|
-
(next) => {
|
|
306
|
-
if (!isControlled) {
|
|
307
|
-
setInternalValues(next);
|
|
308
|
-
}
|
|
309
|
-
if (onChange) {
|
|
310
|
-
if (allowMultiple) {
|
|
311
|
-
onChange(next);
|
|
312
|
-
} else {
|
|
313
|
-
onChange(next[0] ?? null);
|
|
314
|
-
}
|
|
315
|
-
}
|
|
316
|
-
},
|
|
317
|
-
[allowMultiple, isControlled, onChange]
|
|
318
|
-
);
|
|
319
|
-
const handleToggle = react.useCallback(
|
|
320
|
-
(panelValue, disabled) => {
|
|
321
|
-
if (disabled) {
|
|
322
|
-
return;
|
|
323
|
-
}
|
|
324
|
-
const expandedValues2 = isControlled ? normalizeValues(value, allowMultiple) : internalValues;
|
|
325
|
-
const isActive = expandedValues2.includes(panelValue);
|
|
326
|
-
const next = allowMultiple ? isActive ? expandedValues2.filter((v) => v !== panelValue) : [...expandedValues2, panelValue] : isActive ? [] : [panelValue];
|
|
327
|
-
handleValueChange(next);
|
|
328
|
-
},
|
|
329
|
-
[allowMultiple, handleValueChange, internalValues, isControlled, value]
|
|
330
|
-
);
|
|
331
|
-
const expandedValues = react.useMemo(
|
|
332
|
-
() => isControlled ? normalizeValues(value, allowMultiple) : internalValues,
|
|
333
|
-
[allowMultiple, internalValues, isControlled, value]
|
|
334
|
-
);
|
|
335
|
-
const providerValue = react.useMemo(
|
|
336
|
-
() => ({
|
|
337
|
-
expandedValues,
|
|
338
|
-
toggle: handleToggle,
|
|
339
|
-
density,
|
|
340
|
-
color,
|
|
341
|
-
divider,
|
|
342
|
-
rounded,
|
|
343
|
-
variant
|
|
344
|
-
}),
|
|
345
|
-
[color, density, divider, expandedValues, handleToggle, rounded, variant]
|
|
346
|
-
);
|
|
262
|
+
const resolvedValue = value !== void 0 ? value : defaultValue;
|
|
263
|
+
const expandedValues = normalizeValues(resolvedValue, allowMultiple);
|
|
264
|
+
const providerValue = {
|
|
265
|
+
expandedValues,
|
|
266
|
+
density,
|
|
267
|
+
color,
|
|
268
|
+
divider,
|
|
269
|
+
rounded,
|
|
270
|
+
variant
|
|
271
|
+
};
|
|
347
272
|
const variantClass = divider ? variantContainerClasses[variant] : "bg-transparent border border-transparent shadow-none";
|
|
348
273
|
const shapeClass = roundedClasses2[rounded] ?? roundedClasses2.lg;
|
|
349
274
|
const layoutClass = divider ? "divide-y divide-gray-100 overflow-hidden" : "gap-4";
|
|
@@ -364,7 +289,10 @@ var ExpansionPanelInner = (props, forwardedRef) => {
|
|
|
364
289
|
}
|
|
365
290
|
);
|
|
366
291
|
};
|
|
367
|
-
var
|
|
292
|
+
var ExpansionPanelBase = react.forwardRef(ExpansionPanelInner);
|
|
293
|
+
var ExpansionPanel = Object.assign(ExpansionPanelBase, {
|
|
294
|
+
Item: ExpansionPanelItem_default
|
|
295
|
+
});
|
|
368
296
|
ExpansionPanel.displayName = "ExpansionPanel";
|
|
369
297
|
var ExpansionPanel_default = ExpansionPanel;
|
|
370
298
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/Containment/ExpansionPanel/context.ts","../src/Containment/ExpansionPanel/ExpansionPanelItem.tsx","../src/Containment/ExpansionPanel/index.tsx"],"names":["isValidElement","cloneElement","useState","useRef","twMerge","jsx","jsxs","forwardRef","roundedClasses","useEffect","useCallback","expandedValues","useMemo"],"mappings":"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","file":"expansion-panel.cjs","sourcesContent":["import { cloneElement, isValidElement } from 'react';\nimport type { ReactElement, ReactNode } from 'react';\n\nimport type { ExpansionPanelContextValue } from './types.expansion-panel';\n\nexport const EXPANSION_PANEL_CONTEXT_PROP = '__expansionPanelContext' as const;\nconst EXPANSION_PANEL_ITEM_MARKER = '__isExpansionPanelItem';\n\ntype MarkerTarget = Record<string | number | symbol, unknown> & {\n type?: unknown;\n};\n\ntype ElementProps = Record<string | number | symbol, unknown> & {\n children?: ReactNode;\n};\n\nconst hasMarker = (type: unknown): boolean => {\n if (!type || (typeof type !== 'function' && typeof type !== 'object')) {\n return false;\n }\n\n if ((type as MarkerTarget)[EXPANSION_PANEL_ITEM_MARKER]) {\n return true;\n }\n\n const innerType = (type as MarkerTarget).type;\n if (innerType && innerType !== type) {\n return hasMarker(innerType);\n }\n\n return false;\n};\n\nconst traverseNode = (\n node: ReactNode,\n value: ExpansionPanelContextValue\n): { node: ReactNode; changed: boolean } => {\n if (Array.isArray(node)) {\n let changed = false;\n const nextArray = node.map(child => {\n const result = traverseNode(child, value);\n if (result.changed) {\n changed = true;\n }\n return result.node;\n });\n return { node: changed ? nextArray : node, changed };\n }\n\n if (\n node === null ||\n node === undefined ||\n typeof node === 'boolean' ||\n typeof node === 'string' ||\n typeof node === 'number'\n ) {\n return { node, changed: false };\n }\n\n if (!isValidElement<ElementProps>(node)) {\n return { node, changed: false };\n }\n\n const element = node as ReactElement<ElementProps>;\n\n const { node: mappedChildren, changed: childrenChanged } = traverseNode(\n element.props.children,\n value\n );\n const shouldInject = hasMarker(element.type);\n\n if (!shouldInject && !childrenChanged) {\n return { node, changed: false };\n }\n\n const injectedProps = shouldInject\n ? ({ [EXPANSION_PANEL_CONTEXT_PROP]: value } as Partial<ElementProps>)\n : undefined;\n const cloned =\n mappedChildren === undefined\n ? cloneElement(element, injectedProps)\n : cloneElement(element, injectedProps, mappedChildren);\n\n return { node: cloned, changed: true };\n};\n\nexport const injectExpansionPanelContext = (\n children: ReactNode,\n value: ExpansionPanelContextValue\n): ReactNode => traverseNode(children, value).node;\n\nexport const markExpansionPanelItem = (component: unknown) => {\n if (typeof component !== 'function' && (typeof component !== 'object' || component === null)) {\n return;\n }\n\n (component as MarkerTarget)[EXPANSION_PANEL_ITEM_MARKER] = true;\n};\n","import { forwardRef, useRef, useState } from 'react';\nimport type { Ref } from 'react';\nimport { twMerge } from 'tailwind-merge';\nimport { markExpansionPanelItem } from './context';\nimport type {\n ExpansionPanelDensity,\n ExpansionPanelItemProps,\n ExpansionPanelValue,\n ExpansionPanelContextValue\n} from './types.expansion-panel';\nimport type { Palette } from '@lindle/linoardo/global.types';\n\nconst densityClasses: Record<ExpansionPanelDensity, string> = {\n comfortable: 'py-5',\n default: 'py-4',\n compact: 'py-3'\n};\n\nconst roundedClasses = {\n none: 'rounded-none',\n sm: 'rounded-sm',\n md: 'rounded-md',\n lg: 'rounded-lg',\n xl: 'rounded-xl'\n};\n\nconst itemVariantClasses = {\n elevated: 'bg-white border border-gray-200 shadow-sm shadow-gray-900/5',\n outlined: 'bg-white border border-gray-200',\n tonal: 'bg-gray-50 border border-gray-100',\n plain: 'bg-transparent border border-transparent'\n};\n\nconst accentClasses: Record<Palette, { text: string; bg: string; border: string }> = {\n primary: { text: 'text-primary', bg: 'bg-primary/5', border: 'border-primary/30' },\n neutral: { text: 'text-gray-900', bg: 'bg-gray-100', border: 'border-gray-200' },\n info: { text: 'text-sky-600', bg: 'bg-sky-50', border: 'border-sky-200' },\n success: { text: 'text-emerald-600', bg: 'bg-emerald-50', border: 'border-emerald-200' },\n warning: { text: 'text-amber-600', bg: 'bg-amber-50', border: 'border-amber-200' },\n danger: { text: 'text-red-600', bg: 'bg-red-50', border: 'border-red-200' },\n surface: { text: 'text-gray-900', bg: 'bg-gray-100', border: 'border-gray-200' },\n bw: { text: 'text-gray-900', bg: 'bg-gray-100', border: 'border-gray-200' }\n};\n\nlet uniqueIdCounter = 0;\nconst generateId = (prefix: string) => `${prefix}-${++uniqueIdCounter}`;\n\ntype ForwardedRef = Ref<HTMLDivElement>;\n\ninterface ExpansionPanelItemInnerProps extends ExpansionPanelItemProps {\n forwardedRef?: ForwardedRef;\n}\n\n/**\n * Single expandable section used inside `ExpansionPanel`, handling its own toggle state when uncontrolled.\n */\nconst ExpansionPanelItemInner = (props: ExpansionPanelItemInnerProps) => {\n const {\n value,\n title,\n subtitle,\n text,\n prepend,\n append,\n expandIcon,\n collapseIcon,\n hideToggleIcon = false,\n headerClassName,\n contentClassName,\n className,\n disabled = false,\n children,\n color: colorOverride,\n forwardedRef,\n __expansionPanelContext,\n ...rest\n } = props;\n\n const [standaloneExpanded, setStandaloneExpanded] = useState(false);\n\n const generatedValueRef = useRef<ExpansionPanelValue | null>(null);\n if (generatedValueRef.current === null) {\n generatedValueRef.current = generateId('expansion-panel-value');\n }\n const generatedValue = generatedValueRef.current as ExpansionPanelValue;\n\n const headerIdRef = useRef<string | null>(null);\n if (!headerIdRef.current) {\n headerIdRef.current = generateId('expansion-panel-header');\n }\n const headerId = headerIdRef.current as string;\n\n const contentIdRef = useRef<string | null>(null);\n if (!contentIdRef.current) {\n contentIdRef.current = generateId('expansion-panel-content');\n }\n const contentId = contentIdRef.current as string;\n\n const context: ExpansionPanelContextValue | null = __expansionPanelContext ?? null;\n const panelValue = value ?? generatedValue;\n const density = context?.density ?? 'default';\n const color = colorOverride ?? context?.color ?? 'primary';\n const divider = context?.divider ?? true;\n const variant = context?.variant ?? 'elevated';\n const rounded = context?.rounded ?? 'lg';\n const accent = accentClasses[color] ?? accentClasses.primary;\n const isExpanded = context ? context.expandedValues.includes(panelValue) : standaloneExpanded;\n\n const rootSurface = divider ? 'bg-transparent border-0 shadow-none' : itemVariantClasses[variant];\n const shapeClass = divider ? undefined : roundedClasses[rounded] ?? roundedClasses.lg;\n const densityPadding = densityClasses[density] ?? densityClasses.default;\n const disabledClass = disabled ? 'cursor-not-allowed opacity-60' : 'cursor-pointer';\n const titleClass = isExpanded ? accent.text : undefined;\n const activeBorderClass = twMerge(\n 'border-l-2 border-transparent',\n isExpanded ? accent.border : undefined\n );\n const defaultToggleIcon = (\n <i\n className='mdi mdi-chevron-down text-lg leading-none transition-transform duration-200'\n aria-hidden\n />\n );\n\n const hasContent = Boolean(children ?? text);\n const contentAnimationClass = isExpanded ? 'pb-5 opacity-100' : 'pb-0 opacity-0';\n const toggleIconNode = hideToggleIcon\n ? null\n : isExpanded && collapseIcon\n ? collapseIcon\n : expandIcon ?? defaultToggleIcon;\n\n const shouldRotateDefaultIcon = !expandIcon && !collapseIcon && !hideToggleIcon;\n const toggleWrapperClass = twMerge(\n 'ml-3 flex h-6 w-6 items-center justify-center text-gray-500 transition-transform duration-200',\n shouldRotateDefaultIcon && isExpanded ? 'rotate-180' : undefined\n );\n\n const handleToggle = () => {\n if (disabled) {\n return;\n }\n\n if (context) {\n context.toggle(panelValue, disabled);\n return;\n }\n\n setStandaloneExpanded(prev => !prev);\n };\n\n return (\n <div\n {...rest}\n ref={forwardedRef}\n className={twMerge(\n 'expansion-panel-item flex flex-col overflow-hidden transition-colors duration-200',\n rootSurface,\n shapeClass,\n className\n )}\n data-state={isExpanded ? 'open' : 'closed'}\n data-disabled={disabled || undefined}\n >\n <button\n type='button'\n id={headerId}\n onClick={handleToggle}\n disabled={disabled}\n aria-expanded={isExpanded}\n aria-controls={hasContent ? contentId : undefined}\n className={twMerge(\n 'flex w-full items-center gap-4 px-4 text-left focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/40',\n densityPadding,\n disabledClass,\n isExpanded ? accent.bg : undefined,\n headerClassName\n )}\n data-state={isExpanded ? 'open' : 'closed'}\n >\n {prepend && (\n <span className='flex h-10 w-10 items-center justify-center text-gray-500'>\n {prepend}\n </span>\n )}\n <span className='flex min-w-0 flex-1 flex-col gap-0.5 text-left'>\n {title && (\n <span className={twMerge('truncate font-medium text-gray-900', titleClass)}>\n {title}\n </span>\n )}\n {subtitle && <span className='text-sm text-gray-500'>{subtitle}</span>}\n </span>\n {append && (\n <span className='ml-auto flex items-center gap-2 text-sm text-gray-500'>{append}</span>\n )}\n {!hideToggleIcon && <span className={toggleWrapperClass}>{toggleIconNode}</span>}\n </button>\n {hasContent && (\n <div\n className='grid overflow-hidden border-t border-gray-100 transition-all duration-200 ease-in-out'\n style={{ gridTemplateRows: isExpanded ? '1fr' : '0fr' }}\n aria-hidden={isExpanded ? undefined : true}\n data-state={isExpanded ? 'open' : 'closed'}\n >\n <div\n id={contentId}\n role='region'\n aria-labelledby={headerId}\n data-state={isExpanded ? 'open' : 'closed'}\n className={twMerge(\n 'min-h-0 px-4 pt-0 text-sm text-gray-600 transition-all duration-200',\n activeBorderClass,\n contentAnimationClass,\n isExpanded ? 'pointer-events-auto' : 'pointer-events-none',\n contentClassName\n )}\n >\n {children ?? text}\n </div>\n </div>\n )}\n </div>\n );\n};\n\nconst ExpansionPanelItem = forwardRef<HTMLDivElement, ExpansionPanelItemProps>((props, ref) => (\n <ExpansionPanelItemInner {...props} forwardedRef={ref} />\n));\n\nExpansionPanelItem.displayName = 'ExpansionPanelItem';\nmarkExpansionPanelItem(ExpansionPanelItem);\n\nexport default ExpansionPanelItem;\n","'use client';\nimport { forwardRef, useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport type { ForwardedRef } from 'react';\nimport { twMerge } from 'tailwind-merge';\n\nimport { injectExpansionPanelContext } from './context';\nimport type {\n ExpansionPanelProps,\n ExpansionPanelValue,\n ExpansionPanelVariant,\n ExpansionPanelRounded,\n ExpansionPanelMultipleProps,\n ExpansionPanelSingleProps\n} from './types.expansion-panel';\nimport ExpansionPanelItem from './ExpansionPanelItem';\n\nconst variantContainerClasses: Record<ExpansionPanelVariant, string> = {\n elevated: 'bg-white border border-gray-200 shadow-lg shadow-gray-900/10',\n outlined: 'bg-white border border-gray-200',\n tonal: 'bg-gray-50 border border-gray-100',\n plain: 'bg-transparent border border-transparent'\n};\n\nconst roundedClasses: Record<ExpansionPanelRounded, string> = {\n none: 'rounded-none',\n sm: 'rounded-sm',\n md: 'rounded-md',\n lg: 'rounded-lg',\n xl: 'rounded-xl'\n};\n\nconst uniqueValues = (values: ExpansionPanelValue[]) => Array.from(new Set(values));\n\nconst normalizeValues = (\n value: ExpansionPanelValue | ExpansionPanelValue[] | null | undefined,\n allowMultiple: boolean\n): ExpansionPanelValue[] => {\n if (value === undefined || value === null) {\n return [];\n }\n\n const normalized = Array.isArray(value) ? value : [value];\n if (allowMultiple) {\n return uniqueValues(normalized);\n }\n\n return normalized.length ? [normalized[0]] : [];\n};\n\nconst clampValues = (values: ExpansionPanelValue[], allowMultiple: boolean) =>\n allowMultiple ? uniqueValues(values) : values.length ? [values[0]] : [];\n\n/**\n * Accordion-style container that manages single or multiple expanded items with contextual styling.\n */\nconst ExpansionPanelInner = (\n props: ExpansionPanelProps,\n forwardedRef: ForwardedRef<HTMLDivElement>\n) => {\n const {\n variant = 'elevated',\n rounded = 'lg',\n density = 'default',\n color = 'primary',\n divider = true,\n multiple = false,\n className,\n children,\n value,\n defaultValue,\n onChange,\n ...rest\n } = props;\n\n const allowMultiple = multiple ?? false;\n const isControlled = value !== undefined;\n\n const [internalValues, setInternalValues] = useState<ExpansionPanelValue[]>(() =>\n normalizeValues(defaultValue, allowMultiple)\n );\n\n const prevAllowMultipleRef = useRef(allowMultiple);\n const prevIsControlledRef = useRef(isControlled);\n\n useEffect(() => {\n const prevAllowMultiple = prevAllowMultipleRef.current;\n const wasControlled = prevIsControlledRef.current;\n\n if (!isControlled && (allowMultiple !== prevAllowMultiple || wasControlled !== isControlled)) {\n setInternalValues(prev => clampValues(prev, allowMultiple));\n }\n\n prevAllowMultipleRef.current = allowMultiple;\n prevIsControlledRef.current = isControlled;\n }, [allowMultiple, isControlled]);\n\n const handleValueChange = useCallback(\n (next: ExpansionPanelValue[]) => {\n if (!isControlled) {\n setInternalValues(next);\n }\n\n if (onChange) {\n if (allowMultiple) {\n (onChange as NonNullable<ExpansionPanelMultipleProps['onChange']>)(next);\n } else {\n (onChange as NonNullable<ExpansionPanelSingleProps['onChange']>)(next[0] ?? null);\n }\n }\n },\n [allowMultiple, isControlled, onChange]\n );\n\n const handleToggle = useCallback(\n (panelValue: ExpansionPanelValue, disabled?: boolean) => {\n if (disabled) {\n return;\n }\n\n const expandedValues = isControlled ? normalizeValues(value, allowMultiple) : internalValues;\n const isActive = expandedValues.includes(panelValue);\n const next = allowMultiple\n ? isActive\n ? expandedValues.filter(v => v !== panelValue)\n : [...expandedValues, panelValue]\n : isActive\n ? []\n : [panelValue];\n\n handleValueChange(next);\n },\n [allowMultiple, handleValueChange, internalValues, isControlled, value]\n );\n\n const expandedValues = useMemo(\n () => (isControlled ? normalizeValues(value, allowMultiple) : internalValues),\n [allowMultiple, internalValues, isControlled, value]\n );\n\n const providerValue = useMemo(\n () => ({\n expandedValues,\n toggle: handleToggle,\n density,\n color,\n divider,\n rounded,\n variant\n }),\n [color, density, divider, expandedValues, handleToggle, rounded, variant]\n );\n\n const variantClass = divider\n ? variantContainerClasses[variant]\n : 'bg-transparent border border-transparent shadow-none';\n const shapeClass = roundedClasses[rounded] ?? roundedClasses.lg;\n const layoutClass = divider ? 'divide-y divide-gray-100 overflow-hidden' : 'gap-4';\n\n const enhancedChildren = injectExpansionPanelContext(children, providerValue);\n\n return (\n <div\n {...rest}\n ref={forwardedRef}\n className={twMerge(\n 'expansion-panel flex w-full flex-col text-gray-900',\n variantClass,\n shapeClass,\n layoutClass,\n className\n )}\n >\n {enhancedChildren}\n </div>\n );\n};\n\nconst ExpansionPanel = forwardRef<HTMLDivElement, ExpansionPanelProps>(ExpansionPanelInner);\n\nExpansionPanel.displayName = 'ExpansionPanel';\n\nexport { ExpansionPanelItem };\nexport type {\n ExpansionPanelItemProps,\n ExpansionPanelProps,\n ExpansionPanelValue,\n ExpansionPanelVariant,\n ExpansionPanelDensity,\n ExpansionPanelRounded\n} from './types.expansion-panel';\nexport default ExpansionPanel;\n"]}
|
|
1
|
+
{"version":3,"sources":["../src/Containment/ExpansionPanel/context.ts","../src/Containment/ExpansionPanel/ExpansionPanelItem.tsx","../src/Containment/ExpansionPanel/index.tsx"],"names":["isValidElement","cloneElement","twMerge","jsx","jsxs","forwardRef","roundedClasses"],"mappings":"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","file":"expansion-panel.cjs","sourcesContent":["import { cloneElement, isValidElement } from 'react';\nimport type { ReactElement, ReactNode } from 'react';\n\nimport type { ExpansionPanelContextValue } from './types.expansion-panel';\n\nexport const EXPANSION_PANEL_CONTEXT_PROP = '__expansionPanelContext' as const;\nconst EXPANSION_PANEL_ITEM_MARKER = '__isExpansionPanelItem';\n\ntype MarkerTarget = Record<string | number | symbol, unknown> & {\n type?: unknown;\n};\n\ntype ElementProps = Record<string | number | symbol, unknown> & {\n children?: ReactNode;\n};\n\nconst hasMarker = (type: unknown): boolean => {\n if (!type || (typeof type !== 'function' && typeof type !== 'object')) {\n return false;\n }\n\n if ((type as MarkerTarget)[EXPANSION_PANEL_ITEM_MARKER]) {\n return true;\n }\n\n const innerType = (type as MarkerTarget).type;\n if (innerType && innerType !== type) {\n return hasMarker(innerType);\n }\n\n return false;\n};\n\nconst traverseNode = (\n node: ReactNode,\n value: ExpansionPanelContextValue\n): { node: ReactNode; changed: boolean } => {\n if (Array.isArray(node)) {\n let changed = false;\n const nextArray = node.map(child => {\n const result = traverseNode(child, value);\n if (result.changed) {\n changed = true;\n }\n return result.node;\n });\n return { node: changed ? nextArray : node, changed };\n }\n\n if (\n node === null ||\n node === undefined ||\n typeof node === 'boolean' ||\n typeof node === 'string' ||\n typeof node === 'number'\n ) {\n return { node, changed: false };\n }\n\n if (!isValidElement<ElementProps>(node)) {\n return { node, changed: false };\n }\n\n const element = node as ReactElement<ElementProps>;\n\n const { node: mappedChildren, changed: childrenChanged } = traverseNode(\n element.props.children,\n value\n );\n const shouldInject = hasMarker(element.type);\n\n if (!shouldInject && !childrenChanged) {\n return { node, changed: false };\n }\n\n const injectedProps = shouldInject\n ? ({ [EXPANSION_PANEL_CONTEXT_PROP]: value } as Partial<ElementProps>)\n : undefined;\n const cloned =\n mappedChildren === undefined\n ? cloneElement(element, injectedProps)\n : cloneElement(element, injectedProps, mappedChildren);\n\n return { node: cloned, changed: true };\n};\n\nexport const injectExpansionPanelContext = (\n children: ReactNode,\n value: ExpansionPanelContextValue\n): ReactNode => traverseNode(children, value).node;\n\nexport const markExpansionPanelItem = (component: unknown) => {\n if (typeof component !== 'function' && (typeof component !== 'object' || component === null)) {\n return;\n }\n\n (component as MarkerTarget)[EXPANSION_PANEL_ITEM_MARKER] = true;\n};\n","import { forwardRef } from 'react';\nimport type { Ref } from 'react';\nimport { twMerge } from 'tailwind-merge';\nimport { markExpansionPanelItem } from './context';\nimport type {\n ExpansionPanelDensity,\n ExpansionPanelItemProps,\n ExpansionPanelContextValue\n} from './types.expansion-panel';\nimport type { Palette } from '@lindle/linoardo/global.types';\n\nconst densityClasses: Record<ExpansionPanelDensity, string> = {\n comfortable: 'py-5',\n default: 'py-4',\n compact: 'py-3'\n};\n\nconst roundedClasses = {\n none: 'rounded-none',\n sm: 'rounded-sm',\n md: 'rounded-md',\n lg: 'rounded-lg',\n xl: 'rounded-xl'\n};\n\nconst itemVariantClasses = {\n elevated: 'bg-white border border-gray-200 shadow-sm shadow-gray-900/5',\n outlined: 'bg-white border border-gray-200',\n tonal: 'bg-gray-50 border border-gray-100',\n plain: 'bg-transparent border border-transparent'\n};\n\nconst accentClasses: Record<Palette, { text: string; bg: string; border: string }> = {\n primary: { text: 'text-primary', bg: 'bg-primary/5', border: 'border-primary/30' },\n neutral: { text: 'text-gray-900', bg: 'bg-gray-100', border: 'border-gray-200' },\n info: { text: 'text-sky-600', bg: 'bg-sky-50', border: 'border-sky-200' },\n success: { text: 'text-emerald-600', bg: 'bg-emerald-50', border: 'border-emerald-200' },\n warning: { text: 'text-amber-600', bg: 'bg-amber-50', border: 'border-amber-200' },\n danger: { text: 'text-red-600', bg: 'bg-red-50', border: 'border-red-200' },\n surface: { text: 'text-gray-900', bg: 'bg-gray-100', border: 'border-gray-200' },\n bw: { text: 'text-gray-900', bg: 'bg-gray-100', border: 'border-gray-200' }\n};\n\nlet uniqueIdCounter = 0;\nconst generateId = (prefix: string) => `${prefix}-${++uniqueIdCounter}`;\n\ntype ForwardedRef = Ref<HTMLDivElement>;\n\ninterface ExpansionPanelItemInnerProps extends ExpansionPanelItemProps {\n forwardedRef?: ForwardedRef;\n}\n\n/**\n * Single expandable section used inside `ExpansionPanel`, rendered with a CSS-only toggle.\n */\nconst ExpansionPanelItemInner = (props: ExpansionPanelItemInnerProps) => {\n const {\n value,\n title,\n subtitle,\n text,\n prepend,\n append,\n expandIcon,\n collapseIcon,\n hideToggleIcon = false,\n headerClassName,\n contentClassName,\n className,\n disabled = false,\n children,\n color: colorOverride,\n forwardedRef,\n __expansionPanelContext,\n ...rest\n } = props;\n\n const context: ExpansionPanelContextValue | null = __expansionPanelContext ?? null;\n const safeValue =\n typeof value === 'string' || typeof value === 'number' ? String(value) : null;\n const idBase = safeValue ?? generateId('expansion-panel');\n const inputId = `expansion-panel-toggle-${idBase}`;\n const density = context?.density ?? 'default';\n const color = colorOverride ?? context?.color ?? 'primary';\n const divider = context?.divider ?? true;\n const variant = context?.variant ?? 'elevated';\n const rounded = context?.rounded ?? 'lg';\n const accent = accentClasses[color] ?? accentClasses.primary;\n const isExpanded =\n value !== null && value !== undefined\n ? context?.expandedValues.includes(value) ?? false\n : false;\n\n const rootSurface = divider ? 'bg-transparent border-0 shadow-none' : itemVariantClasses[variant];\n const shapeClass = divider ? undefined : roundedClasses[rounded] ?? roundedClasses.lg;\n const densityPadding = densityClasses[density] ?? densityClasses.default;\n const disabledClass = disabled ? 'cursor-not-allowed opacity-60' : 'cursor-pointer';\n const titleClass = isExpanded ? accent.text : undefined;\n const activeBorderClass = twMerge(\n 'border-l-2 border-transparent',\n isExpanded ? accent.border : undefined\n );\n const defaultToggleIcon = (\n <i\n className='mdi mdi-chevron-down text-lg leading-none transition-transform duration-200'\n aria-hidden\n />\n );\n\n const hasContent = Boolean(children ?? text);\n const toggleIconNode = hideToggleIcon\n ? null\n : isExpanded && collapseIcon\n ? collapseIcon\n : expandIcon ?? defaultToggleIcon;\n\n const shouldRotateDefaultIcon = !expandIcon && !collapseIcon && !hideToggleIcon;\n const toggleWrapperClass = twMerge(\n 'expansion-panel-item__icon ml-3 flex h-6 w-6 items-center justify-center text-gray-500 transition-transform duration-200',\n shouldRotateDefaultIcon && isExpanded ? 'rotate-180' : undefined\n );\n\n return (\n <div\n {...rest}\n ref={forwardedRef}\n className={twMerge(\n 'expansion-panel-item group flex flex-col overflow-hidden transition-colors duration-200',\n rootSurface,\n shapeClass,\n className\n )}\n data-state={isExpanded ? 'open' : 'closed'}\n data-disabled={disabled || undefined}\n >\n <input\n id={inputId}\n type='checkbox'\n className='expansion-panel-item__toggle'\n defaultChecked={isExpanded}\n disabled={disabled}\n />\n <label\n htmlFor={inputId}\n className={twMerge(\n 'expansion-panel-item__header flex w-full list-none items-center gap-4 px-4 text-left',\n densityPadding,\n disabledClass,\n isExpanded ? accent.bg : undefined,\n headerClassName\n )}\n aria-disabled={disabled || undefined}\n data-state={isExpanded ? 'open' : 'closed'}\n >\n {prepend && (\n <span className='flex h-10 w-10 items-center justify-center text-gray-500'>\n {prepend}\n </span>\n )}\n <span className='flex min-w-0 flex-1 flex-col gap-0.5 text-left'>\n {title && (\n <span className={twMerge('truncate font-medium text-gray-900', titleClass)}>\n {title}\n </span>\n )}\n {subtitle && <span className='text-sm text-gray-500'>{subtitle}</span>}\n </span>\n {append && (\n <span className='ml-auto flex items-center gap-2 text-sm text-gray-500'>{append}</span>\n )}\n {!hideToggleIcon && <span className={toggleWrapperClass}>{toggleIconNode}</span>}\n </label>\n {hasContent && (\n <div\n className='expansion-panel-item__content overflow-hidden border-t border-gray-100'\n data-state={isExpanded ? 'open' : 'closed'}\n >\n <div\n className={twMerge(\n 'expansion-panel-item__body min-h-0 px-4 pt-0 text-sm text-gray-600',\n activeBorderClass,\n contentClassName\n )}\n >\n {children ?? text}\n </div>\n </div>\n )}\n </div>\n );\n};\n\nconst ExpansionPanelItem = forwardRef<HTMLDivElement, ExpansionPanelItemProps>((props, ref) => (\n <ExpansionPanelItemInner {...props} forwardedRef={ref} />\n));\n\nExpansionPanelItem.displayName = 'ExpansionPanelItem';\nmarkExpansionPanelItem(ExpansionPanelItem);\n\nexport default ExpansionPanelItem;\n","import { forwardRef } from 'react';\nimport type { ForwardRefExoticComponent, RefAttributes } from 'react';\nimport type { ForwardedRef } from 'react';\nimport { twMerge } from 'tailwind-merge';\n\nimport { injectExpansionPanelContext } from './context';\nimport type {\n ExpansionPanelProps,\n ExpansionPanelValue,\n ExpansionPanelVariant,\n ExpansionPanelRounded\n} from './types.expansion-panel';\nimport ExpansionPanelItem from './ExpansionPanelItem';\n\nconst variantContainerClasses: Record<ExpansionPanelVariant, string> = {\n elevated: 'bg-white border border-gray-200 shadow-lg shadow-gray-900/10',\n outlined: 'bg-white border border-gray-200',\n tonal: 'bg-gray-50 border border-gray-100',\n plain: 'bg-transparent border border-transparent'\n};\n\nconst roundedClasses: Record<ExpansionPanelRounded, string> = {\n none: 'rounded-none',\n sm: 'rounded-sm',\n md: 'rounded-md',\n lg: 'rounded-lg',\n xl: 'rounded-xl'\n};\n\nconst uniqueValues = (values: ExpansionPanelValue[]) => Array.from(new Set(values));\n\nconst normalizeValues = (\n value: ExpansionPanelValue | ExpansionPanelValue[] | null | undefined,\n allowMultiple: boolean\n): ExpansionPanelValue[] => {\n if (value === undefined || value === null) {\n return [];\n }\n\n const normalized = Array.isArray(value) ? value : [value];\n if (allowMultiple) {\n return uniqueValues(normalized);\n }\n\n return normalized.length ? [normalized[0]] : [];\n};\n\n/**\n * Accordion-style container that provides contextual styling and initial expanded state.\n */\nconst ExpansionPanelInner = (\n props: ExpansionPanelProps,\n forwardedRef: ForwardedRef<HTMLDivElement>\n) => {\n const {\n variant = 'elevated',\n rounded = 'lg',\n density = 'default',\n color = 'primary',\n divider = true,\n multiple = false,\n className,\n children,\n value,\n defaultValue,\n onChange,\n ...rest\n } = props;\n\n const allowMultiple = multiple ?? false;\n const resolvedValue = value !== undefined ? value : defaultValue;\n const expandedValues = normalizeValues(resolvedValue, allowMultiple);\n\n const providerValue = {\n expandedValues,\n density,\n color,\n divider,\n rounded,\n variant\n };\n\n const variantClass = divider\n ? variantContainerClasses[variant]\n : 'bg-transparent border border-transparent shadow-none';\n const shapeClass = roundedClasses[rounded] ?? roundedClasses.lg;\n const layoutClass = divider ? 'divide-y divide-gray-100 overflow-hidden' : 'gap-4';\n\n const enhancedChildren = injectExpansionPanelContext(children, providerValue);\n\n return (\n <div\n {...rest}\n ref={forwardedRef}\n className={twMerge(\n 'expansion-panel flex w-full flex-col text-gray-900',\n variantClass,\n shapeClass,\n layoutClass,\n className\n )}\n >\n {enhancedChildren}\n </div>\n );\n};\n\ntype ExpansionPanelComponent = ForwardRefExoticComponent<\n ExpansionPanelProps & RefAttributes<HTMLDivElement>\n> & {\n Item: typeof ExpansionPanelItem;\n};\n\nconst ExpansionPanelBase = forwardRef<HTMLDivElement, ExpansionPanelProps>(ExpansionPanelInner);\n\nconst ExpansionPanel = Object.assign(ExpansionPanelBase, {\n Item: ExpansionPanelItem\n}) as ExpansionPanelComponent;\n\nExpansionPanel.displayName = 'ExpansionPanel';\n\nexport { ExpansionPanelItem };\nexport type {\n ExpansionPanelItemProps,\n ExpansionPanelProps,\n ExpansionPanelValue,\n ExpansionPanelVariant,\n ExpansionPanelDensity,\n ExpansionPanelRounded\n} from './types.expansion-panel';\nexport default ExpansionPanel;\n"]}
|
|
@@ -1,8 +1,11 @@
|
|
|
1
|
-
import
|
|
2
|
-
import { c as ExpansionPanelProps } from './ExpansionPanelItem-
|
|
3
|
-
export { E as ExpansionPanelDensity,
|
|
1
|
+
import { ForwardRefExoticComponent, RefAttributes } from 'react';
|
|
2
|
+
import { c as ExpansionPanelProps, a as ExpansionPanelItem } from './ExpansionPanelItem-B9srsYMI.cjs';
|
|
3
|
+
export { E as ExpansionPanelDensity, b as ExpansionPanelItemProps, d as ExpansionPanelRounded, e as ExpansionPanelValue, f as ExpansionPanelVariant } from './ExpansionPanelItem-B9srsYMI.cjs';
|
|
4
4
|
import './global.types-gx9A7mUe.cjs';
|
|
5
5
|
|
|
6
|
-
|
|
6
|
+
type ExpansionPanelComponent = ForwardRefExoticComponent<ExpansionPanelProps & RefAttributes<HTMLDivElement>> & {
|
|
7
|
+
Item: typeof ExpansionPanelItem;
|
|
8
|
+
};
|
|
9
|
+
declare const ExpansionPanel: ExpansionPanelComponent;
|
|
7
10
|
|
|
8
|
-
export { ExpansionPanelProps, ExpansionPanel as default };
|
|
11
|
+
export { ExpansionPanelItem, ExpansionPanelProps, ExpansionPanel as default };
|
|
@@ -1,8 +1,11 @@
|
|
|
1
|
-
import
|
|
2
|
-
import { c as ExpansionPanelProps } from './ExpansionPanelItem-
|
|
3
|
-
export { E as ExpansionPanelDensity,
|
|
1
|
+
import { ForwardRefExoticComponent, RefAttributes } from 'react';
|
|
2
|
+
import { c as ExpansionPanelProps, a as ExpansionPanelItem } from './ExpansionPanelItem-DYcbxZnv.js';
|
|
3
|
+
export { E as ExpansionPanelDensity, b as ExpansionPanelItemProps, d as ExpansionPanelRounded, e as ExpansionPanelValue, f as ExpansionPanelVariant } from './ExpansionPanelItem-DYcbxZnv.js';
|
|
4
4
|
import './global.types-gx9A7mUe.js';
|
|
5
5
|
|
|
6
|
-
|
|
6
|
+
type ExpansionPanelComponent = ForwardRefExoticComponent<ExpansionPanelProps & RefAttributes<HTMLDivElement>> & {
|
|
7
|
+
Item: typeof ExpansionPanelItem;
|
|
8
|
+
};
|
|
9
|
+
declare const ExpansionPanel: ExpansionPanelComponent;
|
|
7
10
|
|
|
8
|
-
export { ExpansionPanelProps, ExpansionPanel as default };
|
|
11
|
+
export { ExpansionPanelItem, ExpansionPanelProps, ExpansionPanel as default };
|
package/dist/expansion-panel.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export { ExpansionPanel_default as default } from './chunk-
|
|
2
|
-
export { ExpansionPanelItem_default as ExpansionPanelItem } from './chunk-
|
|
1
|
+
export { ExpansionPanel_default as default } from './chunk-FJNKMRYQ.js';
|
|
2
|
+
export { ExpansionPanelItem_default as ExpansionPanelItem } from './chunk-RG5FCFLX.js';
|
|
3
3
|
//# sourceMappingURL=expansion-panel.js.map
|
|
4
4
|
//# sourceMappingURL=expansion-panel.js.map
|
package/dist/index.cjs
CHANGED
|
@@ -1091,31 +1091,17 @@ var ExpansionPanelItemInner = (props) => {
|
|
|
1091
1091
|
__expansionPanelContext,
|
|
1092
1092
|
...rest
|
|
1093
1093
|
} = props;
|
|
1094
|
-
const [standaloneExpanded, setStandaloneExpanded] = React4.useState(false);
|
|
1095
|
-
const generatedValueRef = React4.useRef(null);
|
|
1096
|
-
if (generatedValueRef.current === null) {
|
|
1097
|
-
generatedValueRef.current = generateId("expansion-panel-value");
|
|
1098
|
-
}
|
|
1099
|
-
const generatedValue = generatedValueRef.current;
|
|
1100
|
-
const headerIdRef = React4.useRef(null);
|
|
1101
|
-
if (!headerIdRef.current) {
|
|
1102
|
-
headerIdRef.current = generateId("expansion-panel-header");
|
|
1103
|
-
}
|
|
1104
|
-
const headerId = headerIdRef.current;
|
|
1105
|
-
const contentIdRef = React4.useRef(null);
|
|
1106
|
-
if (!contentIdRef.current) {
|
|
1107
|
-
contentIdRef.current = generateId("expansion-panel-content");
|
|
1108
|
-
}
|
|
1109
|
-
const contentId = contentIdRef.current;
|
|
1110
1094
|
const context = __expansionPanelContext ?? null;
|
|
1111
|
-
const
|
|
1095
|
+
const safeValue = typeof value === "string" || typeof value === "number" ? String(value) : null;
|
|
1096
|
+
const idBase = safeValue ?? generateId("expansion-panel");
|
|
1097
|
+
const inputId = `expansion-panel-toggle-${idBase}`;
|
|
1112
1098
|
const density = context?.density ?? "default";
|
|
1113
1099
|
const color = colorOverride ?? context?.color ?? "primary";
|
|
1114
1100
|
const divider = context?.divider ?? true;
|
|
1115
1101
|
const variant = context?.variant ?? "elevated";
|
|
1116
1102
|
const rounded = context?.rounded ?? "lg";
|
|
1117
1103
|
const accent = accentClasses2[color] ?? accentClasses2.primary;
|
|
1118
|
-
const isExpanded =
|
|
1104
|
+
const isExpanded = value !== null && value !== void 0 ? context?.expandedValues.includes(value) ?? false : false;
|
|
1119
1105
|
const rootSurface = divider ? "bg-transparent border-0 shadow-none" : itemVariantClasses[variant];
|
|
1120
1106
|
const shapeClass = divider ? void 0 : roundedClasses[rounded] ?? roundedClasses.lg;
|
|
1121
1107
|
const densityPadding = densityClasses2[density] ?? densityClasses2.default;
|
|
@@ -1133,30 +1119,19 @@ var ExpansionPanelItemInner = (props) => {
|
|
|
1133
1119
|
}
|
|
1134
1120
|
);
|
|
1135
1121
|
const hasContent = Boolean(children ?? text);
|
|
1136
|
-
const contentAnimationClass = isExpanded ? "pb-5 opacity-100" : "pb-0 opacity-0";
|
|
1137
1122
|
const toggleIconNode = hideToggleIcon ? null : isExpanded && collapseIcon ? collapseIcon : expandIcon ?? defaultToggleIcon;
|
|
1138
1123
|
const shouldRotateDefaultIcon = !expandIcon && !collapseIcon && !hideToggleIcon;
|
|
1139
1124
|
const toggleWrapperClass = tailwindMerge.twMerge(
|
|
1140
|
-
"ml-3 flex h-6 w-6 items-center justify-center text-gray-500 transition-transform duration-200",
|
|
1125
|
+
"expansion-panel-item__icon ml-3 flex h-6 w-6 items-center justify-center text-gray-500 transition-transform duration-200",
|
|
1141
1126
|
shouldRotateDefaultIcon && isExpanded ? "rotate-180" : void 0
|
|
1142
1127
|
);
|
|
1143
|
-
const handleToggle = () => {
|
|
1144
|
-
if (disabled) {
|
|
1145
|
-
return;
|
|
1146
|
-
}
|
|
1147
|
-
if (context) {
|
|
1148
|
-
context.toggle(panelValue, disabled);
|
|
1149
|
-
return;
|
|
1150
|
-
}
|
|
1151
|
-
setStandaloneExpanded((prev) => !prev);
|
|
1152
|
-
};
|
|
1153
1128
|
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
1154
1129
|
"div",
|
|
1155
1130
|
{
|
|
1156
1131
|
...rest,
|
|
1157
1132
|
ref: forwardedRef,
|
|
1158
1133
|
className: tailwindMerge.twMerge(
|
|
1159
|
-
"expansion-panel-item flex flex-col overflow-hidden transition-colors duration-200",
|
|
1134
|
+
"expansion-panel-item group flex flex-col overflow-hidden transition-colors duration-200",
|
|
1160
1135
|
rootSurface,
|
|
1161
1136
|
shapeClass,
|
|
1162
1137
|
className
|
|
@@ -1164,22 +1139,28 @@ var ExpansionPanelItemInner = (props) => {
|
|
|
1164
1139
|
"data-state": isExpanded ? "open" : "closed",
|
|
1165
1140
|
"data-disabled": disabled || void 0,
|
|
1166
1141
|
children: [
|
|
1142
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
1143
|
+
"input",
|
|
1144
|
+
{
|
|
1145
|
+
id: inputId,
|
|
1146
|
+
type: "checkbox",
|
|
1147
|
+
className: "expansion-panel-item__toggle",
|
|
1148
|
+
defaultChecked: isExpanded,
|
|
1149
|
+
disabled
|
|
1150
|
+
}
|
|
1151
|
+
),
|
|
1167
1152
|
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
1168
|
-
"
|
|
1153
|
+
"label",
|
|
1169
1154
|
{
|
|
1170
|
-
|
|
1171
|
-
id: headerId,
|
|
1172
|
-
onClick: handleToggle,
|
|
1173
|
-
disabled,
|
|
1174
|
-
"aria-expanded": isExpanded,
|
|
1175
|
-
"aria-controls": hasContent ? contentId : void 0,
|
|
1155
|
+
htmlFor: inputId,
|
|
1176
1156
|
className: tailwindMerge.twMerge(
|
|
1177
|
-
"flex w-full items-center gap-4 px-4 text-left
|
|
1157
|
+
"expansion-panel-item__header flex w-full list-none items-center gap-4 px-4 text-left",
|
|
1178
1158
|
densityPadding,
|
|
1179
1159
|
disabledClass,
|
|
1180
1160
|
isExpanded ? accent.bg : void 0,
|
|
1181
1161
|
headerClassName
|
|
1182
1162
|
),
|
|
1163
|
+
"aria-disabled": disabled || void 0,
|
|
1183
1164
|
"data-state": isExpanded ? "open" : "closed",
|
|
1184
1165
|
children: [
|
|
1185
1166
|
prepend && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex h-10 w-10 items-center justify-center text-gray-500", children: prepend }),
|
|
@@ -1195,22 +1176,14 @@ var ExpansionPanelItemInner = (props) => {
|
|
|
1195
1176
|
hasContent && /* @__PURE__ */ jsxRuntime.jsx(
|
|
1196
1177
|
"div",
|
|
1197
1178
|
{
|
|
1198
|
-
className: "
|
|
1199
|
-
style: { gridTemplateRows: isExpanded ? "1fr" : "0fr" },
|
|
1200
|
-
"aria-hidden": isExpanded ? void 0 : true,
|
|
1179
|
+
className: "expansion-panel-item__content overflow-hidden border-t border-gray-100",
|
|
1201
1180
|
"data-state": isExpanded ? "open" : "closed",
|
|
1202
1181
|
children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
1203
1182
|
"div",
|
|
1204
1183
|
{
|
|
1205
|
-
id: contentId,
|
|
1206
|
-
role: "region",
|
|
1207
|
-
"aria-labelledby": headerId,
|
|
1208
|
-
"data-state": isExpanded ? "open" : "closed",
|
|
1209
1184
|
className: tailwindMerge.twMerge(
|
|
1210
|
-
"min-h-0 px-4 pt-0 text-sm text-gray-600
|
|
1185
|
+
"expansion-panel-item__body min-h-0 px-4 pt-0 text-sm text-gray-600",
|
|
1211
1186
|
activeBorderClass,
|
|
1212
|
-
contentAnimationClass,
|
|
1213
|
-
isExpanded ? "pointer-events-auto" : "pointer-events-none",
|
|
1214
1187
|
contentClassName
|
|
1215
1188
|
),
|
|
1216
1189
|
children: children ?? text
|
|
@@ -1250,7 +1223,6 @@ var normalizeValues = (value, allowMultiple) => {
|
|
|
1250
1223
|
}
|
|
1251
1224
|
return normalized.length ? [normalized[0]] : [];
|
|
1252
1225
|
};
|
|
1253
|
-
var clampValues = (values, allowMultiple) => allowMultiple ? uniqueValues(values) : values.length ? [values[0]] : [];
|
|
1254
1226
|
var ExpansionPanelInner = (props, forwardedRef) => {
|
|
1255
1227
|
const {
|
|
1256
1228
|
variant = "elevated",
|
|
@@ -1267,64 +1239,16 @@ var ExpansionPanelInner = (props, forwardedRef) => {
|
|
|
1267
1239
|
...rest
|
|
1268
1240
|
} = props;
|
|
1269
1241
|
const allowMultiple = multiple ?? false;
|
|
1270
|
-
const
|
|
1271
|
-
const
|
|
1272
|
-
|
|
1273
|
-
|
|
1274
|
-
|
|
1275
|
-
|
|
1276
|
-
|
|
1277
|
-
|
|
1278
|
-
|
|
1279
|
-
|
|
1280
|
-
setInternalValues((prev) => clampValues(prev, allowMultiple));
|
|
1281
|
-
}
|
|
1282
|
-
prevAllowMultipleRef.current = allowMultiple;
|
|
1283
|
-
prevIsControlledRef.current = isControlled;
|
|
1284
|
-
}, [allowMultiple, isControlled]);
|
|
1285
|
-
const handleValueChange = React4.useCallback(
|
|
1286
|
-
(next) => {
|
|
1287
|
-
if (!isControlled) {
|
|
1288
|
-
setInternalValues(next);
|
|
1289
|
-
}
|
|
1290
|
-
if (onChange) {
|
|
1291
|
-
if (allowMultiple) {
|
|
1292
|
-
onChange(next);
|
|
1293
|
-
} else {
|
|
1294
|
-
onChange(next[0] ?? null);
|
|
1295
|
-
}
|
|
1296
|
-
}
|
|
1297
|
-
},
|
|
1298
|
-
[allowMultiple, isControlled, onChange]
|
|
1299
|
-
);
|
|
1300
|
-
const handleToggle = React4.useCallback(
|
|
1301
|
-
(panelValue, disabled) => {
|
|
1302
|
-
if (disabled) {
|
|
1303
|
-
return;
|
|
1304
|
-
}
|
|
1305
|
-
const expandedValues2 = isControlled ? normalizeValues(value, allowMultiple) : internalValues;
|
|
1306
|
-
const isActive = expandedValues2.includes(panelValue);
|
|
1307
|
-
const next = allowMultiple ? isActive ? expandedValues2.filter((v) => v !== panelValue) : [...expandedValues2, panelValue] : isActive ? [] : [panelValue];
|
|
1308
|
-
handleValueChange(next);
|
|
1309
|
-
},
|
|
1310
|
-
[allowMultiple, handleValueChange, internalValues, isControlled, value]
|
|
1311
|
-
);
|
|
1312
|
-
const expandedValues = React4.useMemo(
|
|
1313
|
-
() => isControlled ? normalizeValues(value, allowMultiple) : internalValues,
|
|
1314
|
-
[allowMultiple, internalValues, isControlled, value]
|
|
1315
|
-
);
|
|
1316
|
-
const providerValue = React4.useMemo(
|
|
1317
|
-
() => ({
|
|
1318
|
-
expandedValues,
|
|
1319
|
-
toggle: handleToggle,
|
|
1320
|
-
density,
|
|
1321
|
-
color,
|
|
1322
|
-
divider,
|
|
1323
|
-
rounded,
|
|
1324
|
-
variant
|
|
1325
|
-
}),
|
|
1326
|
-
[color, density, divider, expandedValues, handleToggle, rounded, variant]
|
|
1327
|
-
);
|
|
1242
|
+
const resolvedValue = value !== void 0 ? value : defaultValue;
|
|
1243
|
+
const expandedValues = normalizeValues(resolvedValue, allowMultiple);
|
|
1244
|
+
const providerValue = {
|
|
1245
|
+
expandedValues,
|
|
1246
|
+
density,
|
|
1247
|
+
color,
|
|
1248
|
+
divider,
|
|
1249
|
+
rounded,
|
|
1250
|
+
variant
|
|
1251
|
+
};
|
|
1328
1252
|
const variantClass = divider ? variantContainerClasses[variant] : "bg-transparent border border-transparent shadow-none";
|
|
1329
1253
|
const shapeClass = roundedClasses2[rounded] ?? roundedClasses2.lg;
|
|
1330
1254
|
const layoutClass = divider ? "divide-y divide-gray-100 overflow-hidden" : "gap-4";
|
|
@@ -1345,7 +1269,10 @@ var ExpansionPanelInner = (props, forwardedRef) => {
|
|
|
1345
1269
|
}
|
|
1346
1270
|
);
|
|
1347
1271
|
};
|
|
1348
|
-
var
|
|
1272
|
+
var ExpansionPanelBase = React4.forwardRef(ExpansionPanelInner);
|
|
1273
|
+
var ExpansionPanel = Object.assign(ExpansionPanelBase, {
|
|
1274
|
+
Item: ExpansionPanelItem_default
|
|
1275
|
+
});
|
|
1349
1276
|
ExpansionPanel.displayName = "ExpansionPanel";
|
|
1350
1277
|
var ExpansionPanel_default = ExpansionPanel;
|
|
1351
1278
|
var containerBaseClasses = "fixed inset-0 z-[70] flex items-center justify-center p-4 sm:p-8 data-[state=closed]:pointer-events-none";
|
|
@@ -3108,6 +3035,7 @@ var TextArea = ({
|
|
|
3108
3035
|
const editor = react.useEditor({
|
|
3109
3036
|
extensions: [StarterKit__default.default],
|
|
3110
3037
|
content: renderMarkdown(contentValue),
|
|
3038
|
+
immediatelyRender: false,
|
|
3111
3039
|
editable: editorEditable,
|
|
3112
3040
|
editorProps: {
|
|
3113
3041
|
attributes: {
|