@gridui/input 1.1.6 → 2.0.0
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/index.js +8 -8
- package/dist/index.js.map +2 -2
- package/dist/input/input.d.ts +2 -4
- package/dist/shared/text-control-options.d.ts +10 -0
- package/dist/styles.css +28 -28
- package/dist/textarea/textarea.d.ts +2 -3
- package/docs/catalog.json +1 -1
- package/package.json +3 -3
package/dist/index.js
CHANGED
|
@@ -3,17 +3,17 @@ import { cn } from "@gridui/style-utils";
|
|
|
3
3
|
import { cva } from "class-variance-authority";
|
|
4
4
|
var controlStyles = cva(cn(
|
|
5
5
|
"gridui-control",
|
|
6
|
-
"gridui-u-min-w-0 gridui-u-w-full gridui-u-box-border gridui-u-border gridui-u-border-solid gridui-u-border-border gridui-u-rounded-control gridui-u-text-foreground gridui-u-bg-background gridui-u-type-input",
|
|
7
|
-
"gridui-u-disabled:opacity-50 gridui-u-disabled:cursor-not-allowed",
|
|
8
|
-
"gridui-u-aria-invalid:border-danger-foreground"
|
|
6
|
+
"gridui-u-input--min-w-0 gridui-u-input--w-full gridui-u-input--box-border gridui-u-input--border gridui-u-input--border-solid gridui-u-input--border-border gridui-u-input--rounded-control gridui-u-input--text-foreground gridui-u-input--bg-background gridui-u-input--type-input",
|
|
7
|
+
"gridui-u-input--disabled:opacity-50 gridui-u-input--disabled:cursor-not-allowed",
|
|
8
|
+
"gridui-u-input--aria-invalid:border-danger-foreground"
|
|
9
9
|
));
|
|
10
10
|
var controlStandardStyles = cva(cn(
|
|
11
11
|
"gridui-control-standard",
|
|
12
|
-
"gridui-u-p-gridui-8 gridui-u-min-h-gridui-control"
|
|
12
|
+
"gridui-u-input--p-gridui-8 gridui-u-input--min-h-gridui-control"
|
|
13
13
|
));
|
|
14
14
|
var controlSmallStyles = cva(cn(
|
|
15
15
|
"gridui-control-small",
|
|
16
|
-
"gridui-u-py-gridui-4 gridui-u-px-gridui-8 gridui-u-min-h-gridui-control-small"
|
|
16
|
+
"gridui-u-input--py-gridui-4 gridui-u-input--px-gridui-8 gridui-u-input--min-h-gridui-control-small"
|
|
17
17
|
));
|
|
18
18
|
var controlVariants = cva(controlStyles(), {
|
|
19
19
|
variants: {
|
|
@@ -56,9 +56,9 @@ import { cn as cn3 } from "@gridui/style-utils";
|
|
|
56
56
|
import { cva as cva2 } from "class-variance-authority";
|
|
57
57
|
var labelStyles = cva2(cn3(
|
|
58
58
|
"gridui-label",
|
|
59
|
-
"gridui-u-inline-flex gridui-u-items-center gridui-u-gap-gridui-4 gridui-u-type-ui"
|
|
59
|
+
"gridui-u-input--inline-flex gridui-u-input--items-center gridui-u-input--gap-gridui-4 gridui-u-input--type-ui"
|
|
60
60
|
));
|
|
61
|
-
var labelIconStyles = cva2("gridui-u-inline-flex gridui-u-shrink-0 gridui-u-text-foreground gridui-u-[&>svg]:size-gridui-16");
|
|
61
|
+
var labelIconStyles = cva2("gridui-u-input--inline-flex gridui-u-input--shrink-0 gridui-u-input--text-foreground gridui-u-input--[&>svg]:size-gridui-16");
|
|
62
62
|
|
|
63
63
|
// src/label/label.tsx
|
|
64
64
|
import { cn as cn4 } from "@gridui/style-utils";
|
|
@@ -204,7 +204,7 @@ var Textarea = (props) => {
|
|
|
204
204
|
onChange?.(event);
|
|
205
205
|
onValueChange?.(event.currentTarget.value);
|
|
206
206
|
},
|
|
207
|
-
className: cn5(controlVariants({ size: controlSize }), "gridui-u-overflow-auto", autoSize ? "gridui-u-resize-none" : "gridui-u-resize-y", className)
|
|
207
|
+
className: cn5(controlVariants({ size: controlSize }), "gridui-u-input--overflow-auto", autoSize ? "gridui-u-input--resize-none" : "gridui-u-input--resize-y", className)
|
|
208
208
|
}
|
|
209
209
|
);
|
|
210
210
|
};
|
package/dist/index.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../src/shared/style.ts", "../src/input/input.tsx", "../src/label/style.ts", "../src/label/label.tsx", "../src/textarea/use-textarea-autosize.ts", "../src/textarea/textarea.tsx"],
|
|
4
|
-
"sourcesContent": ["/**\n * @author WMXPY\n * @package Input\n * @namespace Shared\n * @description Style\n */\n\nimport { cn } from \"@gridui/style-utils\";\nimport { cva } from \"class-variance-authority\";\n\nexport const controlStyles = cva(cn(\n \"gridui-control\",\n \"gridui-u-min-w-0 gridui-u-w-full gridui-u-box-border gridui-u-border gridui-u-border-solid gridui-u-border-border gridui-u-rounded-control gridui-u-text-foreground gridui-u-bg-background gridui-u-type-input\",\n \"gridui-u-disabled:opacity-50 gridui-u-disabled:cursor-not-allowed\",\n \"gridui-u-aria-invalid:border-danger-foreground\",\n));\n\nexport const controlStandardStyles = cva(cn(\n \"gridui-control-standard\",\n \"gridui-u-p-gridui-8 gridui-u-min-h-gridui-control\",\n));\n\nexport const controlSmallStyles = cva(cn(\n \"gridui-control-small\",\n \"gridui-u-py-gridui-4 gridui-u-px-gridui-8 gridui-u-min-h-gridui-control-small\",\n));\n\nexport const controlVariants = cva(controlStyles(), {\n variants: {\n size: {\n standard: controlStandardStyles(),\n small: controlSmallStyles(),\n },\n },\n defaultVariants: { size: \"standard\" },\n});\n", "/**\n * @author WMXPY\n * @package Input\n * @namespace Input\n * @description Input\n */\n\nimport { controlVariants } from \"../shared/style\";\nimport { cn } from \"@gridui/style-utils\";\nimport type { ComponentPropsWithRef, FC } from \"react\";\n\nexport type InputProps = ComponentPropsWithRef<\"input\"> &
|
|
5
|
-
"mappings": ";AAOA,SAAS,UAAU;AACnB,SAAS,WAAW;AAEb,IAAM,gBAAgB,IAAI;AAAA,EAC7B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACJ,CAAC;AAEM,IAAM,wBAAwB,IAAI;AAAA,EACrC;AAAA,EACA;AACJ,CAAC;AAEM,IAAM,qBAAqB,IAAI;AAAA,EAClC;AAAA,EACA;AACJ,CAAC;AAEM,IAAM,kBAAkB,IAAI,cAAc,GAAG;AAAA,EAChD,UAAU;AAAA,IACN,MAAM;AAAA,MACF,UAAU,sBAAsB;AAAA,MAChC,OAAO,mBAAmB;AAAA,IAC9B;AAAA,EACJ;AAAA,EACA,iBAAiB,EAAE,MAAM,WAAW;AACxC,CAAC;;;
|
|
4
|
+
"sourcesContent": ["/**\n * @author WMXPY\n * @package Input\n * @namespace Shared\n * @description Style\n */\n\nimport { cn } from \"@gridui/style-utils\";\nimport { cva } from \"class-variance-authority\";\n\nexport const controlStyles = cva(cn(\n \"gridui-control\",\n \"gridui-u-input--min-w-0 gridui-u-input--w-full gridui-u-input--box-border gridui-u-input--border gridui-u-input--border-solid gridui-u-input--border-border gridui-u-input--rounded-control gridui-u-input--text-foreground gridui-u-input--bg-background gridui-u-input--type-input\",\n \"gridui-u-input--disabled:opacity-50 gridui-u-input--disabled:cursor-not-allowed\",\n \"gridui-u-input--aria-invalid:border-danger-foreground\",\n));\n\nexport const controlStandardStyles = cva(cn(\n \"gridui-control-standard\",\n \"gridui-u-input--p-gridui-8 gridui-u-input--min-h-gridui-control\",\n));\n\nexport const controlSmallStyles = cva(cn(\n \"gridui-control-small\",\n \"gridui-u-input--py-gridui-4 gridui-u-input--px-gridui-8 gridui-u-input--min-h-gridui-control-small\",\n));\n\nexport const controlVariants = cva(controlStyles(), {\n variants: {\n size: {\n standard: controlStandardStyles(),\n small: controlSmallStyles(),\n },\n },\n defaultVariants: { size: \"standard\" },\n});\n", "/**\n * @author WMXPY\n * @package Input\n * @namespace Input\n * @description Input\n */\n\nimport { controlVariants } from \"../shared/style\";\nimport type { TextControlOptions } from \"../shared/text-control-options\";\nimport { cn } from \"@gridui/style-utils\";\nimport type { ComponentPropsWithRef, FC } from \"react\";\n\nexport type InputProps = ComponentPropsWithRef<\"input\"> & TextControlOptions;\n\nexport const Input: FC<InputProps> = (props: InputProps) => {\n const {\n size,\n controlSize = \"standard\",\n className,\n onChange,\n onValueChange,\n ...restProps\n } = props;\n return (<input\n {...restProps}\n size={size}\n onChange={(event) => {\n onChange?.(event);\n onValueChange?.(event.currentTarget.value);\n }}\n className={cn(controlVariants({ size: controlSize }), className)}\n />);\n};\n", "/**\n * @author WMXPY\n * @package Input\n * @namespace Label\n * @description Style\n */\n\nimport { cn } from \"@gridui/style-utils\";\nimport { cva } from \"class-variance-authority\";\n\nexport const labelStyles = cva(cn(\n \"gridui-label\",\n \"gridui-u-input--inline-flex gridui-u-input--items-center gridui-u-input--gap-gridui-4 gridui-u-input--type-ui\",\n));\n\nexport const labelIconStyles = cva(\"gridui-u-input--inline-flex gridui-u-input--shrink-0 gridui-u-input--text-foreground gridui-u-input--[&>svg]:size-gridui-16\");\n", "/**\n * @author WMXPY\n * @package Input\n * @namespace Label\n * @description Label\n */\n\nimport { labelIconStyles, labelStyles } from \"./style\";\nimport { cn } from \"@gridui/style-utils\";\nimport type { ComponentPropsWithRef, FC, ReactNode } from \"react\";\n\nexport type LabelProps = ComponentPropsWithRef<\"label\"> & {\n readonly icon?: ReactNode;\n};\n\nexport const Label: FC<LabelProps> = (props: LabelProps) => {\n const { icon, children, className, ...restProps } = props;\n return (<label\n {...restProps}\n className={cn(labelStyles(), className)}\n >\n {icon && (<span\n aria-hidden=\"true\"\n className={labelIconStyles()}\n >\n {icon}\n </span>)}\n {children}\n </label>);\n};\n", "/**\n * @author WMXPY\n * @package Input\n * @namespace Textarea\n * @description Use Textarea Autosize\n */\n\nimport { type RefObject, useCallback, useEffect, useLayoutEffect } from \"react\";\n\nexport const useTextareaAutosize = (ref: RefObject<HTMLTextAreaElement | null>, enabled: boolean, maxHeight?: number) => {\n if (maxHeight !== undefined && (!Number.isFinite(maxHeight) || maxHeight <= 0)) {\n throw new Error(\"Textarea maxHeight must be finite and positive.\");\n }\n const resize = useCallback(() => {\n const element = ref.current;\n if (!enabled || !element || element.clientWidth === 0) {\n return;\n }\n const style = getComputedStyle(element);\n const borders = parseFloat(style.borderTopWidth) + parseFloat(style.borderBottomWidth);\n const padding = parseFloat(style.paddingTop) + parseFloat(style.paddingBottom);\n element.style.height = \"auto\";\n const contentHeight = element.scrollHeight;\n const height = style.boxSizing === \"border-box\" ? contentHeight + borders : contentHeight - padding;\n const boundedHeight = Math.min(height, maxHeight ?? Number.POSITIVE_INFINITY);\n element.style.height = `${boundedHeight}px`;\n element.style.overflowY = height > boundedHeight ? \"auto\" : \"hidden\";\n }, [\n ref,\n enabled,\n maxHeight,\n ]);\n useLayoutEffect(() => {\n const element = ref.current;\n if (!enabled || !element) {\n return;\n }\n const originalHeight = element.style.height;\n const originalOverflow = element.style.overflowY;\n return () => {\n element.style.height = originalHeight;\n element.style.overflowY = originalOverflow;\n };\n }, [\n ref,\n enabled,\n ]);\n useLayoutEffect(() => {\n resize();\n });\n useEffect(() => {\n const element = ref.current;\n if (!enabled || !element) {\n return;\n }\n let frame = 0;\n let width = element.clientWidth;\n const schedule = () => {\n cancelAnimationFrame(frame);\n frame = requestAnimationFrame(resize);\n };\n const observer = typeof ResizeObserver === \"undefined\" ? undefined : new ResizeObserver(() => {\n if (element.clientWidth !== width) {\n width = element.clientWidth;\n schedule();\n }\n });\n observer?.observe(element);\n // A capture listener follows the live form owner, including DOM reassociation.\n const reset = (event: Event): void => {\n if (event.target === element.form) {\n schedule();\n }\n };\n const document = element.ownerDocument;\n document.addEventListener(\"reset\", reset, true);\n return () => {\n cancelAnimationFrame(frame);\n observer?.disconnect();\n document.removeEventListener(\"reset\", reset, true);\n };\n }, [\n ref,\n enabled,\n resize,\n ]);\n return resize;\n};\n", "/**\n * @author WMXPY\n * @package Input\n * @namespace Textarea\n * @description Textarea\n */\n\nimport { controlVariants } from \"../shared/style\";\nimport type { TextControlOptions } from \"../shared/text-control-options\";\nimport { useTextareaAutosize } from \"./use-textarea-autosize\";\nimport { useScrollbars } from \"@gridui/overlay\";\nimport { cn } from \"@gridui/style-utils\";\nimport { type ComponentPropsWithRef, type FC, useImperativeHandle, useRef } from \"react\";\n\nexport type TextareaProps = ComponentPropsWithRef<\"textarea\"> & TextControlOptions & {\n readonly autoSize?: boolean;\n readonly maxHeight?: number;\n};\n\nexport const Textarea: FC<TextareaProps> = (props: TextareaProps) => {\n const {\n controlSize = \"standard\",\n className,\n onChange,\n onInput,\n onValueChange,\n ref,\n autoSize = false,\n maxHeight,\n style,\n ...restProps\n } = props;\n const element = useRef<HTMLTextAreaElement>(null);\n // React attaches the native element before assigning imperative handles.\n useImperativeHandle(ref, () => {\n return element.current!;\n });\n const scrollRef = useScrollbars({ ref: element });\n const resize = useTextareaAutosize(element, autoSize, maxHeight);\n return (<textarea\n {...restProps}\n ref={scrollRef}\n style={style}\n onInput={(event) => {\n resize();\n onInput?.(event);\n }}\n onChange={(event) => {\n onChange?.(event);\n onValueChange?.(event.currentTarget.value);\n }}\n className={cn(controlVariants({ size: controlSize }), \"gridui-u-input--overflow-auto\", autoSize ? \"gridui-u-input--resize-none\" : \"gridui-u-input--resize-y\", className)}\n />);\n};\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["cn", "cn", "cva", "cn", "jsx", "cn", "jsx"]
|
|
7
7
|
}
|
package/dist/input/input.d.ts
CHANGED
|
@@ -4,9 +4,7 @@
|
|
|
4
4
|
* @namespace Input
|
|
5
5
|
* @description Input
|
|
6
6
|
*/
|
|
7
|
+
import type { TextControlOptions } from "../shared/text-control-options";
|
|
7
8
|
import type { ComponentPropsWithRef, FC } from "react";
|
|
8
|
-
export type InputProps = ComponentPropsWithRef<"input"> &
|
|
9
|
-
readonly controlSize?: "standard" | "small";
|
|
10
|
-
readonly onValueChange?: (value: string) => void;
|
|
11
|
-
};
|
|
9
|
+
export type InputProps = ComponentPropsWithRef<"input"> & TextControlOptions;
|
|
12
10
|
export declare const Input: FC<InputProps>;
|
package/dist/styles.css
CHANGED
|
@@ -1,90 +1,90 @@
|
|
|
1
|
-
/*! tailwindcss v4.3.
|
|
1
|
+
/*! tailwindcss v4.3.5 | MIT License | https://tailwindcss.com */
|
|
2
2
|
@layer properties;
|
|
3
3
|
@layer theme, base, components, utilities;
|
|
4
4
|
@layer utilities {
|
|
5
|
-
.gridui-u-box-border {
|
|
5
|
+
.gridui-u-input--box-border {
|
|
6
6
|
box-sizing: border-box;
|
|
7
7
|
}
|
|
8
|
-
.gridui-u-inline-flex {
|
|
8
|
+
.gridui-u-input--inline-flex {
|
|
9
9
|
display: inline-flex;
|
|
10
10
|
}
|
|
11
|
-
.gridui-u-min-h-gridui-control {
|
|
11
|
+
.gridui-u-input--min-h-gridui-control {
|
|
12
12
|
min-height: var(--gridui-control-min-height);
|
|
13
13
|
}
|
|
14
|
-
.gridui-u-min-h-gridui-control-small {
|
|
14
|
+
.gridui-u-input--min-h-gridui-control-small {
|
|
15
15
|
min-height: var(--gridui-control-min-height-small);
|
|
16
16
|
}
|
|
17
|
-
.gridui-u-w-full {
|
|
17
|
+
.gridui-u-input--w-full {
|
|
18
18
|
width: 100%;
|
|
19
19
|
}
|
|
20
|
-
.gridui-u-min-w-0 {
|
|
20
|
+
.gridui-u-input--min-w-0 {
|
|
21
21
|
min-width: 0px;
|
|
22
22
|
}
|
|
23
|
-
.gridui-u-shrink-0 {
|
|
23
|
+
.gridui-u-input--shrink-0 {
|
|
24
24
|
flex-shrink: 0;
|
|
25
25
|
}
|
|
26
|
-
.gridui-u-resize-none {
|
|
26
|
+
.gridui-u-input--resize-none {
|
|
27
27
|
resize: none;
|
|
28
28
|
}
|
|
29
|
-
.gridui-u-resize-y {
|
|
29
|
+
.gridui-u-input--resize-y {
|
|
30
30
|
resize: vertical;
|
|
31
31
|
}
|
|
32
|
-
.gridui-u-items-center {
|
|
32
|
+
.gridui-u-input--items-center {
|
|
33
33
|
align-items: center;
|
|
34
34
|
}
|
|
35
|
-
.gridui-u-gap-gridui-4 {
|
|
35
|
+
.gridui-u-input--gap-gridui-4 {
|
|
36
36
|
gap: var(--gridui-space-4);
|
|
37
37
|
}
|
|
38
|
-
.gridui-u-overflow-auto {
|
|
38
|
+
.gridui-u-input--overflow-auto {
|
|
39
39
|
overflow: auto;
|
|
40
40
|
}
|
|
41
|
-
.gridui-u-rounded-control {
|
|
41
|
+
.gridui-u-input--rounded-control {
|
|
42
42
|
border-radius: var(--gridui-control-radius);
|
|
43
43
|
}
|
|
44
|
-
.gridui-u-border {
|
|
44
|
+
.gridui-u-input--border {
|
|
45
45
|
border-style: var(--tw-border-style);
|
|
46
46
|
border-width: 1px;
|
|
47
47
|
}
|
|
48
|
-
.gridui-u-border-solid {
|
|
48
|
+
.gridui-u-input--border-solid {
|
|
49
49
|
--tw-border-style: solid;
|
|
50
50
|
border-style: solid;
|
|
51
51
|
}
|
|
52
|
-
.gridui-u-border-border {
|
|
52
|
+
.gridui-u-input--border-border {
|
|
53
53
|
border-color: var(--gridui-border);
|
|
54
54
|
}
|
|
55
|
-
.gridui-u-bg-background {
|
|
55
|
+
.gridui-u-input--bg-background {
|
|
56
56
|
background-color: var(--gridui-background);
|
|
57
57
|
}
|
|
58
|
-
.gridui-u-p-gridui-8 {
|
|
58
|
+
.gridui-u-input--p-gridui-8 {
|
|
59
59
|
padding: var(--gridui-space-8);
|
|
60
60
|
}
|
|
61
|
-
.gridui-u-px-gridui-8 {
|
|
61
|
+
.gridui-u-input--px-gridui-8 {
|
|
62
62
|
padding-inline: var(--gridui-space-8);
|
|
63
63
|
}
|
|
64
|
-
.gridui-u-py-gridui-4 {
|
|
64
|
+
.gridui-u-input--py-gridui-4 {
|
|
65
65
|
padding-block: var(--gridui-space-4);
|
|
66
66
|
}
|
|
67
|
-
.gridui-u-type-input {
|
|
67
|
+
.gridui-u-input--type-input {
|
|
68
68
|
font: var(--gridui-type-input);
|
|
69
69
|
letter-spacing: normal;
|
|
70
70
|
}
|
|
71
|
-
.gridui-u-type-ui {
|
|
71
|
+
.gridui-u-input--type-ui {
|
|
72
72
|
font: var(--gridui-type-ui);
|
|
73
73
|
letter-spacing: normal;
|
|
74
74
|
}
|
|
75
|
-
.gridui-u-text-foreground {
|
|
75
|
+
.gridui-u-input--text-foreground {
|
|
76
76
|
color: var(--gridui-foreground);
|
|
77
77
|
}
|
|
78
|
-
.gridui-u-disabled\:cursor-not-allowed:disabled {
|
|
78
|
+
.gridui-u-input--disabled\:cursor-not-allowed:disabled {
|
|
79
79
|
cursor: not-allowed;
|
|
80
80
|
}
|
|
81
|
-
.gridui-u-disabled\:opacity-50:disabled {
|
|
81
|
+
.gridui-u-input--disabled\:opacity-50:disabled {
|
|
82
82
|
opacity: 50%;
|
|
83
83
|
}
|
|
84
|
-
.gridui-u-aria-invalid\:border-danger-foreground[aria-invalid="true"] {
|
|
84
|
+
.gridui-u-input--aria-invalid\:border-danger-foreground[aria-invalid="true"] {
|
|
85
85
|
border-color: var(--gridui-danger-foreground);
|
|
86
86
|
}
|
|
87
|
-
.gridui-u
|
|
87
|
+
.gridui-u-input--\[\&\>svg\]\:size-gridui-16 > svg {
|
|
88
88
|
width: var(--gridui-space-16);
|
|
89
89
|
height: var(--gridui-space-16);
|
|
90
90
|
}
|
|
@@ -4,11 +4,10 @@
|
|
|
4
4
|
* @namespace Textarea
|
|
5
5
|
* @description Textarea
|
|
6
6
|
*/
|
|
7
|
+
import type { TextControlOptions } from "../shared/text-control-options";
|
|
7
8
|
import { type ComponentPropsWithRef, type FC } from "react";
|
|
8
|
-
export type TextareaProps = ComponentPropsWithRef<"textarea"> & {
|
|
9
|
+
export type TextareaProps = ComponentPropsWithRef<"textarea"> & TextControlOptions & {
|
|
9
10
|
readonly autoSize?: boolean;
|
|
10
11
|
readonly maxHeight?: number;
|
|
11
|
-
readonly controlSize?: "standard" | "small";
|
|
12
|
-
readonly onValueChange?: (value: string) => void;
|
|
13
12
|
};
|
|
14
13
|
export declare const Textarea: FC<TextareaProps>;
|
package/docs/catalog.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"schemaVersion": 1,
|
|
3
3
|
"name": "@gridui/input",
|
|
4
|
-
"version": "
|
|
4
|
+
"version": "2.0.0",
|
|
5
5
|
"category": "core",
|
|
6
6
|
"description": "GridUI React input",
|
|
7
7
|
"usage": "`Label` owns inline label alignment and an optional decorative `icon` slot. Icons use the standard 16px token size without an ancestor layout styling labels.",
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@gridui/input",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "2.0.0",
|
|
4
4
|
"description": "GridUI React input",
|
|
5
5
|
"license": "UNLICENSED",
|
|
6
6
|
"type": "module",
|
|
@@ -27,8 +27,8 @@
|
|
|
27
27
|
"react-dom": "^19.2.0"
|
|
28
28
|
},
|
|
29
29
|
"dependencies": {
|
|
30
|
-
"@gridui/overlay": "^
|
|
31
|
-
"@gridui/style-utils": "^
|
|
30
|
+
"@gridui/overlay": "^2.0.0",
|
|
31
|
+
"@gridui/style-utils": "^3.0.0",
|
|
32
32
|
"@gridui/theme": "^2.5.3",
|
|
33
33
|
"class-variance-authority": "0.7.1"
|
|
34
34
|
},
|