@lindle/linoardo 1.0.17 → 1.0.19
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/button.cjs +10 -2
- package/dist/button.cjs.map +1 -1
- package/dist/button.d.cts +1 -0
- package/dist/button.d.ts +1 -0
- package/dist/button.js +1 -1
- package/dist/card.cjs +87 -0
- package/dist/card.cjs.map +1 -0
- package/dist/card.d.cts +34 -0
- package/dist/card.d.ts +34 -0
- package/dist/card.js +3 -0
- package/dist/card.js.map +1 -0
- package/dist/chunk-AOHXZ7OM.js +126 -0
- package/dist/chunk-AOHXZ7OM.js.map +1 -0
- package/dist/chunk-N65GNKRG.js +143 -0
- package/dist/chunk-N65GNKRG.js.map +1 -0
- package/dist/{chunk-TTDFAKOL.js → chunk-PYG5SDNO.js} +2 -2
- package/dist/{chunk-TTDFAKOL.js.map → chunk-PYG5SDNO.js.map} +1 -1
- package/dist/{chunk-3EGIRBQ3.js → chunk-QGQ66FJD.js} +69 -14
- package/dist/chunk-QGQ66FJD.js.map +1 -0
- package/dist/{chunk-7LLAWEDF.js → chunk-SZU6OYLS.js} +12 -4
- package/dist/chunk-SZU6OYLS.js.map +1 -0
- package/dist/chunk-V4BVJOSC.js +85 -0
- package/dist/chunk-V4BVJOSC.js.map +1 -0
- package/dist/index.cjs +409 -16
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +3 -0
- package/dist/index.d.ts +3 -0
- package/dist/index.js +6 -3
- package/dist/input.cjs.map +1 -1
- package/dist/input.js +1 -1
- package/dist/menu.cjs +67 -12
- package/dist/menu.cjs.map +1 -1
- package/dist/menu.js +1 -1
- package/dist/slider.cjs +128 -0
- package/dist/slider.cjs.map +1 -0
- package/dist/slider.d.cts +42 -0
- package/dist/slider.d.ts +42 -0
- package/dist/slider.js +3 -0
- package/dist/slider.js.map +1 -0
- package/dist/styles.css +349 -38
- package/dist/switch.cjs +145 -0
- package/dist/switch.cjs.map +1 -0
- package/dist/switch.d.cts +16 -0
- package/dist/switch.d.ts +16 -0
- package/dist/switch.js +3 -0
- package/dist/switch.js.map +1 -0
- package/package.json +17 -4
- package/dist/chunk-3EGIRBQ3.js.map +0 -1
- package/dist/chunk-7LLAWEDF.js.map +0 -1
package/dist/index.d.cts
CHANGED
|
@@ -5,7 +5,10 @@ export { default as Menu, MenuPlacement, MenuProps } from './menu.cjs';
|
|
|
5
5
|
export { default as ExpansionPanel } from './expansion-panel.cjs';
|
|
6
6
|
export { default as Dialog, DialogProps } from './dialog.cjs';
|
|
7
7
|
export { default as ToolTip, ToolTipPlacement, ToolTipProps } from './tooltip.cjs';
|
|
8
|
+
export { default as Card, CardMediaProps, CardProps, CardSectionProps, CardTextProps } from './card.cjs';
|
|
8
9
|
export { default as Input } from './input.cjs';
|
|
10
|
+
export { default as Slider } from './slider.cjs';
|
|
11
|
+
export { default as Switch } from './switch.cjs';
|
|
9
12
|
export { e as ExpansionPanelDensity, E as ExpansionPanelItem, a as ExpansionPanelItemProps, b as ExpansionPanelProps, f as ExpansionPanelRounded, c as ExpansionPanelValue, d as ExpansionPanelVariant } from './ExpansionPanelItem-Bd6ZWGkR.cjs';
|
|
10
13
|
export { c as ListDensity, L as ListItem, a as ListItemProps, d as ListLines, e as ListRounded, b as ListVariant } from './index-Md3BuoGM.cjs';
|
|
11
14
|
import './global.types-E2uVLemv.cjs';
|
package/dist/index.d.ts
CHANGED
|
@@ -5,7 +5,10 @@ export { default as Menu, MenuPlacement, MenuProps } from './menu.js';
|
|
|
5
5
|
export { default as ExpansionPanel } from './expansion-panel.js';
|
|
6
6
|
export { default as Dialog, DialogProps } from './dialog.js';
|
|
7
7
|
export { default as ToolTip, ToolTipPlacement, ToolTipProps } from './tooltip.js';
|
|
8
|
+
export { default as Card, CardMediaProps, CardProps, CardSectionProps, CardTextProps } from './card.js';
|
|
8
9
|
export { default as Input } from './input.js';
|
|
10
|
+
export { default as Slider } from './slider.js';
|
|
11
|
+
export { default as Switch } from './switch.js';
|
|
9
12
|
export { e as ExpansionPanelDensity, E as ExpansionPanelItem, a as ExpansionPanelItemProps, b as ExpansionPanelProps, f as ExpansionPanelRounded, c as ExpansionPanelValue, d as ExpansionPanelVariant } from './ExpansionPanelItem-DOjgDeB6.js';
|
|
10
13
|
export { c as ListDensity, L as ListItem, a as ListItemProps, d as ListLines, e as ListRounded, b as ListVariant } from './index-d_JuI06O.js';
|
|
11
14
|
import './global.types-E2uVLemv.js';
|
package/dist/index.js
CHANGED
|
@@ -1,12 +1,15 @@
|
|
|
1
1
|
export { Dialog_default as Dialog } from './chunk-U6NAIIDI.js';
|
|
2
2
|
export { ToolTip_default as ToolTip } from './chunk-32KFNI6K.js';
|
|
3
|
-
export {
|
|
4
|
-
export {
|
|
3
|
+
export { Card_default as Card } from './chunk-V4BVJOSC.js';
|
|
4
|
+
export { Input_default as Input } from './chunk-PYG5SDNO.js';
|
|
5
|
+
export { Slider_default as Slider } from './chunk-AOHXZ7OM.js';
|
|
6
|
+
export { Switch_default as Switch } from './chunk-N65GNKRG.js';
|
|
7
|
+
export { Button_default as Button } from './chunk-SZU6OYLS.js';
|
|
5
8
|
export { Chip_default as Chip } from './chunk-PWK6MLZT.js';
|
|
6
9
|
import './chunk-IEILIKS2.js';
|
|
7
10
|
export { List_default as List } from './chunk-5GY2JCBO.js';
|
|
8
11
|
export { Item_default as ListItem } from './chunk-XFPBICJG.js';
|
|
9
|
-
export { Menu_default as Menu } from './chunk-
|
|
12
|
+
export { Menu_default as Menu } from './chunk-QGQ66FJD.js';
|
|
10
13
|
export { ExpansionPanel_default as ExpansionPanel } from './chunk-E32P5AHO.js';
|
|
11
14
|
export { ExpansionPanelItem_default as ExpansionPanelItem } from './chunk-GA6HSRN6.js';
|
|
12
15
|
//# sourceMappingURL=index.js.map
|
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":"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
|
|
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":"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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","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"]}
|
package/dist/input.js
CHANGED
package/dist/menu.cjs
CHANGED
|
@@ -56,20 +56,39 @@ var Menu = React__namespace.forwardRef((props, ref) => {
|
|
|
56
56
|
className,
|
|
57
57
|
...rest
|
|
58
58
|
} = props;
|
|
59
|
+
const { onMouseEnter, onMouseLeave, onFocus, onBlur, ...restProps } = rest;
|
|
59
60
|
const hasContent = children !== void 0 && children !== null;
|
|
60
|
-
const
|
|
61
|
-
const
|
|
62
|
-
const
|
|
61
|
+
const isControlled = typeof open === "boolean";
|
|
62
|
+
const [uncontrolledOpen, setUncontrolledOpen] = React__namespace.useState(false);
|
|
63
|
+
const closeTimer = React__namespace.useRef(null);
|
|
64
|
+
const visible = isControlled ? Boolean(open) : uncontrolledOpen;
|
|
65
|
+
const shouldRenderContent = hasContent && (keepMounted || visible || !isControlled && (openOnHover || openOnFocus));
|
|
63
66
|
const verticalPlacement = placement.startsWith("top") ? "top" : "bottom";
|
|
64
|
-
const
|
|
65
|
-
if (
|
|
66
|
-
|
|
67
|
+
const clearCloseTimer = () => {
|
|
68
|
+
if (closeTimer.current !== null) {
|
|
69
|
+
window.clearTimeout(closeTimer.current);
|
|
70
|
+
closeTimer.current = null;
|
|
67
71
|
}
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
72
|
+
};
|
|
73
|
+
const openMenu = () => {
|
|
74
|
+
clearCloseTimer();
|
|
75
|
+
if (!isControlled) {
|
|
76
|
+
setUncontrolledOpen(true);
|
|
77
|
+
}
|
|
78
|
+
};
|
|
79
|
+
const scheduleClose = () => {
|
|
80
|
+
clearCloseTimer();
|
|
81
|
+
if (!isControlled) {
|
|
82
|
+
closeTimer.current = window.setTimeout(() => {
|
|
83
|
+
setUncontrolledOpen(false);
|
|
84
|
+
closeTimer.current = null;
|
|
85
|
+
}, 120);
|
|
86
|
+
}
|
|
87
|
+
};
|
|
88
|
+
React__namespace.useEffect(() => {
|
|
89
|
+
return () => clearCloseTimer();
|
|
90
|
+
}, []);
|
|
91
|
+
const visibilityClasses = visible ? "pointer-events-auto opacity-100 scale-100" : "pointer-events-none opacity-0 scale-95";
|
|
73
92
|
const {
|
|
74
93
|
className: contentExtraClassName,
|
|
75
94
|
style: contentStyle,
|
|
@@ -83,10 +102,34 @@ var Menu = React__namespace.forwardRef((props, ref) => {
|
|
|
83
102
|
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
84
103
|
"div",
|
|
85
104
|
{
|
|
86
|
-
...
|
|
105
|
+
...restProps,
|
|
87
106
|
ref,
|
|
88
107
|
className: tailwindMerge.twMerge("relative inline-flex min-w-0 group/menu", className),
|
|
89
108
|
"data-open": visible || void 0,
|
|
109
|
+
onMouseEnter: (event) => {
|
|
110
|
+
if (openOnHover) {
|
|
111
|
+
openMenu();
|
|
112
|
+
}
|
|
113
|
+
onMouseEnter?.(event);
|
|
114
|
+
},
|
|
115
|
+
onMouseLeave: (event) => {
|
|
116
|
+
if (openOnHover) {
|
|
117
|
+
scheduleClose();
|
|
118
|
+
}
|
|
119
|
+
onMouseLeave?.(event);
|
|
120
|
+
},
|
|
121
|
+
onFocus: (event) => {
|
|
122
|
+
if (openOnFocus) {
|
|
123
|
+
openMenu();
|
|
124
|
+
}
|
|
125
|
+
onFocus?.(event);
|
|
126
|
+
},
|
|
127
|
+
onBlur: (event) => {
|
|
128
|
+
if (openOnFocus) {
|
|
129
|
+
scheduleClose();
|
|
130
|
+
}
|
|
131
|
+
onBlur?.(event);
|
|
132
|
+
},
|
|
90
133
|
children: [
|
|
91
134
|
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "inline-flex w-full min-w-0", children: activator }),
|
|
92
135
|
shouldRenderContent ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -106,6 +149,18 @@ var Menu = React__namespace.forwardRef((props, ref) => {
|
|
|
106
149
|
role: contentRole ?? "menu",
|
|
107
150
|
tabIndex: contentTabIndex ?? -1,
|
|
108
151
|
style: contentStyle,
|
|
152
|
+
onMouseEnter: (event) => {
|
|
153
|
+
if (openOnHover) {
|
|
154
|
+
openMenu();
|
|
155
|
+
}
|
|
156
|
+
restContentProps?.onMouseEnter?.(event);
|
|
157
|
+
},
|
|
158
|
+
onMouseLeave: (event) => {
|
|
159
|
+
if (openOnHover) {
|
|
160
|
+
scheduleClose();
|
|
161
|
+
}
|
|
162
|
+
restContentProps?.onMouseLeave?.(event);
|
|
163
|
+
},
|
|
109
164
|
children
|
|
110
165
|
}
|
|
111
166
|
) : null
|
package/dist/menu.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/Containment/Menu/index.tsx"],"names":["React","jsx","twMerge","jsxs","Fragment"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAoBA,IAAM,gBAAA,GAAkD;AAAA,EACtD,cAAA,EAAgB,iCAAA;AAAA,EAChB,MAAA,EAAQ,+CAAA;AAAA,EACR,YAAA,EAAc,mCAAA;AAAA,EACd,WAAA,EAAa,uCAAA;AAAA,EACb,GAAA,EAAK,qDAAA;AAAA,EACL,SAAA,EAAW;AACb,CAAA;AAEA,IAAM,aAAA,GAAkD;AAAA,EACtD,GAAA,EAAK,MAAA;AAAA,EACL,MAAA,EAAQ;AACV,CAAA;AAEA,IAAM,eAAA,GACJ,gTAAA;AAEF,IAAM,kBAAA,GAAqB,uDAAA;AAE3B,IAAM,IAAA,GAAaA,gBAAA,CAAA,UAAA,CAAsC,CAAC,KAAA,EAAO,GAAA,KAAQ;AACvE,EAAA,MAAM;AAAA,IACJ,SAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA,GAAY,cAAA;AAAA,IACZ,IAAA;AAAA,IACA,WAAA,GAAc,IAAA;AAAA,IACd,WAAA,GAAc,IAAA;AAAA,IACd,mBAAA,GAAsB,KAAA;AAAA,IACtB,WAAA,GAAc,KAAA;AAAA,IACd,KAAA,GAAQ,KAAA;AAAA,IACR,gBAAA;AAAA,IACA,YAAA;AAAA,IACA,gBAAA;AAAA,IACA,SAAA;AAAA,IACA,GAAG;AAAA,GACL,GAAI,KAAA;AAEJ,EAAA,MAAM,UAAA,GAAa,QAAA,KAAa,MAAA,IAAa,QAAA,KAAa,IAAA;AAC1D,EAAA,MAAM,
|
|
1
|
+
{"version":3,"sources":["../src/Containment/Menu/index.tsx"],"names":["React","jsx","twMerge","jsxs","Fragment"],"mappings":"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","file":"menu.cjs","sourcesContent":["import * as React from 'react';\nimport { twMerge } from 'tailwind-merge';\n\nexport type MenuPlacement = 'bottom-start' | 'bottom' | 'bottom-end' | 'top-start' | 'top' | 'top-end';\n\nexport interface MenuProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> {\n activator: React.ReactNode;\n children: React.ReactNode;\n placement?: MenuPlacement;\n open?: boolean;\n openOnHover?: boolean;\n openOnFocus?: boolean;\n matchActivatorWidth?: boolean;\n keepMounted?: boolean;\n scrim?: boolean;\n contentClassName?: string;\n contentProps?: React.HTMLAttributes<HTMLDivElement>;\n overlayClassName?: string;\n}\n\nconst placementClasses: Record<MenuPlacement, string> = {\n 'bottom-start': 'left-0 top-full origin-top-left',\n bottom: 'left-1/2 top-full -translate-x-1/2 origin-top',\n 'bottom-end': 'right-0 top-full origin-top-right',\n 'top-start': 'left-0 bottom-full origin-bottom-left',\n top: 'left-1/2 bottom-full -translate-x-1/2 origin-bottom',\n 'top-end': 'right-0 bottom-full origin-bottom-right'\n};\n\nconst offsetClasses: Record<'top' | 'bottom', string> = {\n top: 'mb-2',\n bottom: 'mt-2'\n};\n\nconst menuBaseClasses =\n 'absolute z-50 min-w-[10rem] rounded-xl border border-gray-200/80 bg-white/95 p-2 text-sm text-gray-700 shadow-lg shadow-gray-900/10 ring-1 ring-black/5 backdrop-blur-md transition-all duration-150 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/40 focus-visible:ring-offset-2';\n\nconst overlayBaseClasses = 'fixed inset-0 z-40 bg-gray-900/30 backdrop-blur-[1px]';\n\nconst Menu = React.forwardRef<HTMLDivElement, MenuProps>((props, ref) => {\n const {\n activator,\n children,\n placement = 'bottom-start',\n open,\n openOnHover = true,\n openOnFocus = true,\n matchActivatorWidth = false,\n keepMounted = false,\n scrim = false,\n contentClassName,\n contentProps,\n overlayClassName,\n className,\n ...rest\n } = props;\n\n const { onMouseEnter, onMouseLeave, onFocus, onBlur, ...restProps } = rest;\n\n const hasContent = children !== undefined && children !== null;\n const isControlled = typeof open === 'boolean';\n const [uncontrolledOpen, setUncontrolledOpen] = React.useState(false);\n const closeTimer = React.useRef<number | null>(null);\n const visible = isControlled ? Boolean(open) : uncontrolledOpen;\n const shouldRenderContent = hasContent && (keepMounted || visible || (!isControlled && (openOnHover || openOnFocus)));\n const verticalPlacement = placement.startsWith('top') ? 'top' : 'bottom';\n\n const clearCloseTimer = () => {\n if (closeTimer.current !== null) {\n window.clearTimeout(closeTimer.current);\n closeTimer.current = null;\n }\n };\n\n const openMenu = () => {\n clearCloseTimer();\n if (!isControlled) {\n setUncontrolledOpen(true);\n }\n };\n\n const scheduleClose = () => {\n clearCloseTimer();\n if (!isControlled) {\n closeTimer.current = window.setTimeout(() => {\n setUncontrolledOpen(false);\n closeTimer.current = null;\n }, 120);\n }\n };\n\n React.useEffect(() => {\n return () => clearCloseTimer();\n }, []);\n\n const visibilityClasses = visible ? 'pointer-events-auto opacity-100 scale-100' : 'pointer-events-none opacity-0 scale-95';\n\n const {\n className: contentExtraClassName,\n style: contentStyle,\n role: contentRole,\n tabIndex: contentTabIndex,\n ...restContentProps\n } = contentProps ?? {};\n\n const overlayNode = scrim && visible ? <div className={twMerge(overlayBaseClasses, overlayClassName)} aria-hidden /> : null;\n\n return (\n <>\n {overlayNode}\n <div\n {...restProps}\n ref={ref}\n className={twMerge('relative inline-flex min-w-0 group/menu', className)}\n data-open={visible || undefined}\n onMouseEnter={event => {\n if (openOnHover) {\n openMenu();\n }\n onMouseEnter?.(event);\n }}\n onMouseLeave={event => {\n if (openOnHover) {\n scheduleClose();\n }\n onMouseLeave?.(event);\n }}\n onFocus={event => {\n if (openOnFocus) {\n openMenu();\n }\n onFocus?.(event);\n }}\n onBlur={event => {\n if (openOnFocus) {\n scheduleClose();\n }\n onBlur?.(event);\n }}\n >\n <div className='inline-flex w-full min-w-0'>{activator}</div>\n {shouldRenderContent ? (\n <div\n {...restContentProps}\n className={twMerge(\n menuBaseClasses,\n placementClasses[placement],\n offsetClasses[verticalPlacement],\n matchActivatorWidth ? 'min-w-full' : undefined,\n visibilityClasses,\n contentClassName,\n contentExtraClassName\n )}\n data-state={visible ? 'open' : 'closed'}\n role={contentRole ?? 'menu'}\n tabIndex={contentTabIndex ?? -1}\n style={contentStyle}\n onMouseEnter={event => {\n if (openOnHover) {\n openMenu();\n }\n restContentProps?.onMouseEnter?.(event);\n }}\n onMouseLeave={event => {\n if (openOnHover) {\n scheduleClose();\n }\n restContentProps?.onMouseLeave?.(event);\n }}\n >\n {children}\n </div>\n ) : null}\n </div>\n </>\n );\n});\n\nMenu.displayName = 'Menu';\n\nexport default Menu;\n"]}
|
package/dist/menu.js
CHANGED
package/dist/slider.cjs
ADDED
|
@@ -0,0 +1,128 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var react = require('react');
|
|
4
|
+
var tailwindMerge = require('tailwind-merge');
|
|
5
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
6
|
+
|
|
7
|
+
// src/Form/Slider/index.tsx
|
|
8
|
+
var paletteValues = {
|
|
9
|
+
primary: { fill: "var(--color-primary, #6366f1)", ring: "rgba(99, 102, 241, 0.28)", thumbBorder: "#6366f1" },
|
|
10
|
+
neutral: { fill: "#4b5563", ring: "rgba(75, 85, 99, 0.28)", thumbBorder: "#4b5563" },
|
|
11
|
+
info: { fill: "#0284c7", ring: "rgba(2, 132, 199, 0.28)", thumbBorder: "#0284c7" },
|
|
12
|
+
success: { fill: "#059669", ring: "rgba(5, 150, 105, 0.24)", thumbBorder: "#059669" },
|
|
13
|
+
warning: { fill: "#d97706", ring: "rgba(217, 119, 6, 0.24)", thumbBorder: "#d97706" },
|
|
14
|
+
danger: { fill: "#dc2626", ring: "rgba(220, 38, 38, 0.24)", thumbBorder: "#dc2626" },
|
|
15
|
+
surface: { fill: "#0f172a", ring: "rgba(15, 23, 42, 0.22)", thumbBorder: "#0f172a" },
|
|
16
|
+
bw: { fill: "#000000", ring: "rgba(0, 0, 0, 0.26)", thumbBorder: "#000000" }
|
|
17
|
+
};
|
|
18
|
+
var sizeTokens = {
|
|
19
|
+
small: { trackHeight: "0.375rem", thumbSize: "1.1rem", trackClass: "h-1.5", valueClass: "text-xs" },
|
|
20
|
+
medium: { trackHeight: "0.5rem", thumbSize: "1.25rem", trackClass: "h-2", valueClass: "text-sm" },
|
|
21
|
+
large: { trackHeight: "0.6rem", thumbSize: "1.4rem", trackClass: "h-[0.65rem]", valueClass: "text-base" }
|
|
22
|
+
};
|
|
23
|
+
var clamp = (value, min, max) => Math.min(Math.max(value, min), max);
|
|
24
|
+
var toNumber = (value, fallback) => {
|
|
25
|
+
if (typeof value === "number" && Number.isFinite(value)) {
|
|
26
|
+
return value;
|
|
27
|
+
}
|
|
28
|
+
const parsed = Number(value);
|
|
29
|
+
return Number.isFinite(parsed) ? parsed : fallback;
|
|
30
|
+
};
|
|
31
|
+
var Slider = ({
|
|
32
|
+
color = "primary",
|
|
33
|
+
size = "medium",
|
|
34
|
+
label,
|
|
35
|
+
hint,
|
|
36
|
+
showValue = true,
|
|
37
|
+
valueLabel,
|
|
38
|
+
wrapperClassName,
|
|
39
|
+
className,
|
|
40
|
+
trackColor,
|
|
41
|
+
onChange,
|
|
42
|
+
disabled,
|
|
43
|
+
min = 0,
|
|
44
|
+
max = 100,
|
|
45
|
+
step = 1,
|
|
46
|
+
...rest
|
|
47
|
+
}) => {
|
|
48
|
+
const palette = paletteValues[color] ?? paletteValues.primary;
|
|
49
|
+
const sizeToken = sizeTokens[size] ?? sizeTokens.medium;
|
|
50
|
+
const { value, defaultValue, ...inputProps } = rest;
|
|
51
|
+
const resolvedMin = toNumber(min, 0);
|
|
52
|
+
const resolvedMax = toNumber(max, resolvedMin < 100 ? 100 : resolvedMin);
|
|
53
|
+
const resolvedStep = toNumber(step, 1);
|
|
54
|
+
const isControlled = typeof value === "number";
|
|
55
|
+
const [internalValue, setInternalValue] = react.useState(
|
|
56
|
+
clamp(
|
|
57
|
+
typeof value === "number" ? value : typeof defaultValue === "number" ? defaultValue : resolvedMin,
|
|
58
|
+
resolvedMin,
|
|
59
|
+
resolvedMax
|
|
60
|
+
)
|
|
61
|
+
);
|
|
62
|
+
react.useEffect(() => {
|
|
63
|
+
if (isControlled && typeof value === "number") {
|
|
64
|
+
setInternalValue(clamp(value, resolvedMin, resolvedMax));
|
|
65
|
+
}
|
|
66
|
+
}, [isControlled, value, resolvedMin, resolvedMax]);
|
|
67
|
+
react.useEffect(() => {
|
|
68
|
+
if (!isControlled) {
|
|
69
|
+
setInternalValue((prev) => clamp(prev, resolvedMin, resolvedMax));
|
|
70
|
+
}
|
|
71
|
+
}, [isControlled, resolvedMin, resolvedMax]);
|
|
72
|
+
const currentValue = isControlled && typeof value === "number" ? clamp(value, resolvedMin, resolvedMax) : internalValue;
|
|
73
|
+
const percentage = resolvedMax === resolvedMin ? 0 : (currentValue - resolvedMin) / (resolvedMax - resolvedMin) * 100;
|
|
74
|
+
const cssVars = {
|
|
75
|
+
"--slider-color": palette.fill,
|
|
76
|
+
"--slider-ring-color": palette.ring,
|
|
77
|
+
"--slider-thumb-border": palette.thumbBorder,
|
|
78
|
+
"--slider-track-color": trackColor ?? "#e5e7eb",
|
|
79
|
+
"--slider-track-height": sizeToken.trackHeight,
|
|
80
|
+
"--slider-thumb-size": sizeToken.thumbSize,
|
|
81
|
+
"--slider-percentage": `${percentage}%`
|
|
82
|
+
};
|
|
83
|
+
if (disabled) {
|
|
84
|
+
cssVars["--slider-disabled-fill"] = "#d1d5db";
|
|
85
|
+
cssVars["--slider-thumb-border"] = "#d1d5db";
|
|
86
|
+
cssVars["--slider-track-color-disabled"] = "#e5e7eb";
|
|
87
|
+
}
|
|
88
|
+
const handleChange = (event) => {
|
|
89
|
+
const nextValue = Number(event.target.value);
|
|
90
|
+
if (!isControlled) {
|
|
91
|
+
setInternalValue(nextValue);
|
|
92
|
+
}
|
|
93
|
+
onChange?.(nextValue, event);
|
|
94
|
+
};
|
|
95
|
+
const displayValue = valueLabel ? valueLabel(currentValue) : currentValue;
|
|
96
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: tailwindMerge.twMerge("flex flex-col gap-2", wrapperClassName), children: [
|
|
97
|
+
(label || showValue) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between", children: [
|
|
98
|
+
label && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-medium text-gray-900", children: label }),
|
|
99
|
+
showValue && /* @__PURE__ */ jsxRuntime.jsx("span", { className: tailwindMerge.twMerge("tabular-nums text-gray-900", sizeToken.valueClass), children: displayValue })
|
|
100
|
+
] }),
|
|
101
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
102
|
+
"input",
|
|
103
|
+
{
|
|
104
|
+
...inputProps,
|
|
105
|
+
type: "range",
|
|
106
|
+
min: resolvedMin,
|
|
107
|
+
max: resolvedMax,
|
|
108
|
+
step: resolvedStep,
|
|
109
|
+
value: currentValue,
|
|
110
|
+
onChange: handleChange,
|
|
111
|
+
disabled,
|
|
112
|
+
className: tailwindMerge.twMerge(
|
|
113
|
+
"slider-control focus-visible:outline-none rounded-full",
|
|
114
|
+
sizeToken.trackClass,
|
|
115
|
+
disabled ? "cursor-not-allowed opacity-70" : "cursor-pointer",
|
|
116
|
+
className
|
|
117
|
+
),
|
|
118
|
+
style: cssVars
|
|
119
|
+
}
|
|
120
|
+
),
|
|
121
|
+
hint && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-gray-600", children: hint })
|
|
122
|
+
] });
|
|
123
|
+
};
|
|
124
|
+
var Slider_default = Slider;
|
|
125
|
+
|
|
126
|
+
module.exports = Slider_default;
|
|
127
|
+
//# sourceMappingURL=slider.cjs.map
|
|
128
|
+
//# sourceMappingURL=slider.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/Form/Slider/index.tsx"],"names":["useState","useEffect","twMerge","jsxs","jsx"],"mappings":"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","file":"slider.cjs","sourcesContent":["import { type ChangeEvent, type CSSProperties, useEffect, useState } from 'react';\nimport type { Palette } from '@lindle/linoardo/global.types';\nimport { twMerge } from 'tailwind-merge';\nimport type { SliderProps, SliderSize } from './types.slider';\n\nconst paletteValues: Record<Palette, { fill: string; ring: string; thumbBorder: string }> = {\n primary: { fill: 'var(--color-primary, #6366f1)', ring: 'rgba(99, 102, 241, 0.28)', thumbBorder: '#6366f1' },\n neutral: { fill: '#4b5563', ring: 'rgba(75, 85, 99, 0.28)', thumbBorder: '#4b5563' },\n info: { fill: '#0284c7', ring: 'rgba(2, 132, 199, 0.28)', thumbBorder: '#0284c7' },\n success: { fill: '#059669', ring: 'rgba(5, 150, 105, 0.24)', thumbBorder: '#059669' },\n warning: { fill: '#d97706', ring: 'rgba(217, 119, 6, 0.24)', thumbBorder: '#d97706' },\n danger: { fill: '#dc2626', ring: 'rgba(220, 38, 38, 0.24)', thumbBorder: '#dc2626' },\n surface: { fill: '#0f172a', ring: 'rgba(15, 23, 42, 0.22)', thumbBorder: '#0f172a' },\n bw: { fill: '#000000', ring: 'rgba(0, 0, 0, 0.26)', thumbBorder: '#000000' }\n};\n\nconst sizeTokens: Record<\n SliderSize,\n { trackHeight: string; thumbSize: string; trackClass: string; valueClass: string }\n> = {\n small: { trackHeight: '0.375rem', thumbSize: '1.1rem', trackClass: 'h-1.5', valueClass: 'text-xs' },\n medium: { trackHeight: '0.5rem', thumbSize: '1.25rem', trackClass: 'h-2', valueClass: 'text-sm' },\n large: { trackHeight: '0.6rem', thumbSize: '1.4rem', trackClass: 'h-[0.65rem]', valueClass: 'text-base' }\n};\n\nconst clamp = (value: number, min: number, max: number) => Math.min(Math.max(value, min), max);\n\nconst toNumber = (value: number | string | undefined, fallback: number) => {\n if (typeof value === 'number' && Number.isFinite(value)) {\n return value;\n }\n\n const parsed = Number(value);\n return Number.isFinite(parsed) ? parsed : fallback;\n};\n\ntype SliderCssVariables = CSSProperties & Record<string, string>;\n\nconst Slider: React.FC<SliderProps> = ({\n color = 'primary',\n size = 'medium',\n label,\n hint,\n showValue = true,\n valueLabel,\n wrapperClassName,\n className,\n trackColor,\n onChange,\n disabled,\n min = 0,\n max = 100,\n step = 1,\n ...rest\n}) => {\n const palette = paletteValues[color] ?? paletteValues.primary;\n const sizeToken = sizeTokens[size] ?? sizeTokens.medium;\n const { value, defaultValue, ...inputProps } = rest;\n const resolvedMin = toNumber(min, 0);\n const resolvedMax = toNumber(max, resolvedMin < 100 ? 100 : resolvedMin);\n const resolvedStep = toNumber(step, 1);\n const isControlled = typeof value === 'number';\n const [internalValue, setInternalValue] = useState<number>(\n clamp(\n typeof value === 'number'\n ? value\n : typeof defaultValue === 'number'\n ? defaultValue\n : resolvedMin,\n resolvedMin,\n resolvedMax\n )\n );\n\n useEffect(() => {\n if (isControlled && typeof value === 'number') {\n setInternalValue(clamp(value, resolvedMin, resolvedMax));\n }\n }, [isControlled, value, resolvedMin, resolvedMax]);\n\n useEffect(() => {\n if (!isControlled) {\n setInternalValue(prev => clamp(prev, resolvedMin, resolvedMax));\n }\n }, [isControlled, resolvedMin, resolvedMax]);\n\n const currentValue =\n isControlled && typeof value === 'number' ? clamp(value, resolvedMin, resolvedMax) : internalValue;\n const percentage = resolvedMax === resolvedMin ? 0 : ((currentValue - resolvedMin) / (resolvedMax - resolvedMin)) * 100;\n const cssVars: SliderCssVariables = {\n '--slider-color': palette.fill,\n '--slider-ring-color': palette.ring,\n '--slider-thumb-border': palette.thumbBorder,\n '--slider-track-color': trackColor ?? '#e5e7eb',\n '--slider-track-height': sizeToken.trackHeight,\n '--slider-thumb-size': sizeToken.thumbSize,\n '--slider-percentage': `${percentage}%`\n };\n\n if (disabled) {\n cssVars['--slider-disabled-fill'] = '#d1d5db';\n cssVars['--slider-thumb-border'] = '#d1d5db';\n cssVars['--slider-track-color-disabled'] = '#e5e7eb';\n }\n\n const handleChange = (event: ChangeEvent<HTMLInputElement>) => {\n const nextValue = Number(event.target.value);\n if (!isControlled) {\n setInternalValue(nextValue);\n }\n onChange?.(nextValue, event);\n };\n\n const displayValue = valueLabel ? valueLabel(currentValue) : currentValue;\n\n return (\n <div className={twMerge('flex flex-col gap-2', wrapperClassName)}>\n {(label || showValue) && (\n <div className='flex items-center justify-between'>\n {label && <span className='text-sm font-medium text-gray-900'>{label}</span>}\n {showValue && <span className={twMerge('tabular-nums text-gray-900', sizeToken.valueClass)}>{displayValue}</span>}\n </div>\n )}\n\n <input\n {...inputProps}\n type='range'\n min={resolvedMin}\n max={resolvedMax}\n step={resolvedStep}\n value={currentValue}\n onChange={handleChange}\n disabled={disabled}\n className={twMerge(\n 'slider-control focus-visible:outline-none rounded-full',\n sizeToken.trackClass,\n disabled ? 'cursor-not-allowed opacity-70' : 'cursor-pointer',\n className\n )}\n style={cssVars}\n />\n\n {hint && <p className='text-xs text-gray-600'>{hint}</p>}\n </div>\n );\n};\n\nexport default Slider;\n"]}
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
import { P as Palette } from './global.types-E2uVLemv.cjs';
|
|
2
|
+
|
|
3
|
+
type SliderSize = 'small' | 'medium' | 'large';
|
|
4
|
+
type SliderProps = Omit<React.InputHTMLAttributes<HTMLInputElement>, 'type' | 'size' | 'onChange' | 'value' | 'defaultValue'> & {
|
|
5
|
+
value?: number;
|
|
6
|
+
defaultValue?: number;
|
|
7
|
+
color?: Palette;
|
|
8
|
+
size?: SliderSize;
|
|
9
|
+
/**
|
|
10
|
+
* Label shown above the slider, similar to Vuetify's `label`.
|
|
11
|
+
*/
|
|
12
|
+
label?: React.ReactNode;
|
|
13
|
+
/**
|
|
14
|
+
* Optional hint text below the slider.
|
|
15
|
+
*/
|
|
16
|
+
hint?: React.ReactNode;
|
|
17
|
+
/**
|
|
18
|
+
* When true (default), renders the current value on the right side.
|
|
19
|
+
*/
|
|
20
|
+
showValue?: boolean;
|
|
21
|
+
/**
|
|
22
|
+
* Custom formatter used when `showValue` is enabled.
|
|
23
|
+
*/
|
|
24
|
+
valueLabel?: (value: number) => React.ReactNode;
|
|
25
|
+
/**
|
|
26
|
+
* Additional class applied to the wrapper element.
|
|
27
|
+
*/
|
|
28
|
+
wrapperClassName?: string;
|
|
29
|
+
/**
|
|
30
|
+
* Class applied directly to the range input element.
|
|
31
|
+
*/
|
|
32
|
+
className?: string;
|
|
33
|
+
/**
|
|
34
|
+
* Override the unfilled track color.
|
|
35
|
+
*/
|
|
36
|
+
trackColor?: string;
|
|
37
|
+
onChange?: (value: number, event: React.ChangeEvent<HTMLInputElement>) => void;
|
|
38
|
+
};
|
|
39
|
+
|
|
40
|
+
declare const Slider: React.FC<SliderProps>;
|
|
41
|
+
|
|
42
|
+
export { Slider as default };
|
package/dist/slider.d.ts
ADDED
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
import { P as Palette } from './global.types-E2uVLemv.js';
|
|
2
|
+
|
|
3
|
+
type SliderSize = 'small' | 'medium' | 'large';
|
|
4
|
+
type SliderProps = Omit<React.InputHTMLAttributes<HTMLInputElement>, 'type' | 'size' | 'onChange' | 'value' | 'defaultValue'> & {
|
|
5
|
+
value?: number;
|
|
6
|
+
defaultValue?: number;
|
|
7
|
+
color?: Palette;
|
|
8
|
+
size?: SliderSize;
|
|
9
|
+
/**
|
|
10
|
+
* Label shown above the slider, similar to Vuetify's `label`.
|
|
11
|
+
*/
|
|
12
|
+
label?: React.ReactNode;
|
|
13
|
+
/**
|
|
14
|
+
* Optional hint text below the slider.
|
|
15
|
+
*/
|
|
16
|
+
hint?: React.ReactNode;
|
|
17
|
+
/**
|
|
18
|
+
* When true (default), renders the current value on the right side.
|
|
19
|
+
*/
|
|
20
|
+
showValue?: boolean;
|
|
21
|
+
/**
|
|
22
|
+
* Custom formatter used when `showValue` is enabled.
|
|
23
|
+
*/
|
|
24
|
+
valueLabel?: (value: number) => React.ReactNode;
|
|
25
|
+
/**
|
|
26
|
+
* Additional class applied to the wrapper element.
|
|
27
|
+
*/
|
|
28
|
+
wrapperClassName?: string;
|
|
29
|
+
/**
|
|
30
|
+
* Class applied directly to the range input element.
|
|
31
|
+
*/
|
|
32
|
+
className?: string;
|
|
33
|
+
/**
|
|
34
|
+
* Override the unfilled track color.
|
|
35
|
+
*/
|
|
36
|
+
trackColor?: string;
|
|
37
|
+
onChange?: (value: number, event: React.ChangeEvent<HTMLInputElement>) => void;
|
|
38
|
+
};
|
|
39
|
+
|
|
40
|
+
declare const Slider: React.FC<SliderProps>;
|
|
41
|
+
|
|
42
|
+
export { Slider as default };
|
package/dist/slider.js
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":[],"names":[],"mappings":"","file":"slider.js"}
|