@gridui/data-cell 1.1.0 → 1.1.1

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.
@@ -4,5 +4,6 @@
4
4
  * @namespace DataValue
5
5
  * @description Style
6
6
  */
7
- export declare const dataValueStyles: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
8
- export declare const dataMonoStyles: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
7
+ export declare const dataValueStyles: (props?: ({
8
+ mono?: boolean | null | undefined;
9
+ } & import("class-variance-authority/types").ClassProp) | undefined) => string;
package/dist/index.js CHANGED
@@ -87,11 +87,15 @@ import { cva as cva3 } from "class-variance-authority";
87
87
  var dataValueStyles = cva3(cn5(
88
88
  "gridui-data-value",
89
89
  "gridui-u-data-cell--[&>small]:text-muted gridui-u-data-cell--[&>small]:type-supporting"
90
- ));
91
- var dataMonoStyles = cva3(cn5(
92
- "gridui-data-mono",
93
- "gridui-u-data-cell--type-code gridui-u-data-cell--whitespace-nowrap"
94
- ));
90
+ ), {
91
+ variants: {
92
+ mono: {
93
+ false: null,
94
+ true: "gridui-data-mono gridui-u-data-cell--type-code gridui-u-data-cell--whitespace-nowrap"
95
+ }
96
+ },
97
+ defaultVariants: { mono: false }
98
+ });
95
99
 
96
100
  // src/data-value/data-value.tsx
97
101
  import { cn as cn6 } from "@gridui/style-utils";
@@ -114,7 +118,7 @@ var DataValue = (props) => {
114
118
  "data-direction": direction,
115
119
  "data-align": align,
116
120
  "data-tabular": tabular || void 0,
117
- className: cn6(dataValueStyles(), mono && dataMonoStyles(), className),
121
+ className: cn6(dataValueStyles({ mono }), className),
118
122
  children: [
119
123
  /* @__PURE__ */ jsx3("span", { children }),
120
124
  detail !== void 0 && /* @__PURE__ */ jsx3("small", { children: detail })
package/dist/index.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../src/data-badge/style.ts", "../src/data-badge/data-badge.tsx", "../src/data-bar/style.ts", "../src/data-bar/data-bar.tsx", "../src/data-value/style.ts", "../src/data-value/data-value.tsx"],
4
- "sourcesContent": ["/**\n * @author WMXPY\n * @package Data Cell\n * @namespace DataBadge\n * @description Style\n */\n\nimport { cn } from \"@gridui/style-utils\";\nimport { cva } from \"class-variance-authority\";\n\nexport const dataBadgeStyles = cva(cn(\n \"gridui-data-badge\",\n \"gridui-u-data-cell--inline-block gridui-u-data-cell--py-gridui-4 gridui-u-data-cell--px-gridui-8 gridui-u-data-cell--text-foreground gridui-u-data-cell--bg-surface gridui-u-data-cell--type-caption gridui-u-data-cell--whitespace-nowrap\",\n \"gridui-u-data-cell--data-[tone='accent']:text-foreground gridui-u-data-cell--data-[tone='accent']:bg-brand-tint\",\n));\n", "/**\n * @author WMXPY\n * @package Data Cell\n * @namespace DataBadge\n * @description Data Badge\n */\n\nimport { dataBadgeStyles } from \"./style\";\nimport { cn } from \"@gridui/style-utils\";\nimport type { ComponentPropsWithRef, FC } from \"react\";\n\nexport type DataBadgeProps = ComponentPropsWithRef<\"span\"> & {\n readonly tone?: \"neutral\" | \"accent\";\n};\n\nexport const DataBadge: FC<DataBadgeProps> = (props: DataBadgeProps) => {\n const {\n children,\n tone = \"neutral\",\n className,\n ...restProps\n } = props;\n return (<span\n {...restProps}\n className={cn(dataBadgeStyles(), className)}\n data-tone={tone}\n >\n {children}\n </span>);\n};\n", "/**\n * @author WMXPY\n * @package Data Cell\n * @namespace DataBar\n * @description Style\n */\n\nimport { cn } from \"@gridui/style-utils\";\nimport { cva } from \"class-variance-authority\";\n\nexport const dataBarStyles = cva(cn(\n \"gridui-data-bar\",\n \"gridui-u-data-cell--grid gridui-u-data-cell--min-w-gridui-64 gridui-u-data-cell--gap-gridui-8 gridui-u-data-cell--tabular-nums\",\n \"gridui-u-data-cell--[&[data-partial='true']_.gridui-data-bar-track>span]:bg-transparent\",\n));\n\nexport const dataBarTrackStyles = cva(cn(\n \"gridui-data-bar-track\",\n \"gridui-u-data-cell--h-(--gridui-space-4) gridui-u-data-cell--bg-brand-tint\",\n \"gridui-u-data-cell--[&_>_span]:block gridui-u-data-cell--[&_>_span]:h-full gridui-u-data-cell--[&_>_span]:bg-accent-background\",\n));\n", "/**\n * @author WMXPY\n * @package Data Cell\n * @namespace DataBar\n * @description Data Bar\n */\n\nimport { dataBarStyles, dataBarTrackStyles } from \"./style\";\nimport { cn } from \"@gridui/style-utils\";\nimport type { ComponentPropsWithRef, FC } from \"react\";\n\nexport type DataBarProps = ComponentPropsWithRef<\"span\"> & {\n readonly value: number;\n readonly maximum: number;\n readonly partial?: boolean;\n};\n\nexport const DataBar: FC<DataBarProps> = (props: DataBarProps) => {\n const {\n value,\n maximum,\n partial = false,\n children,\n className,\n ...restProps\n } = props;\n const ratio = Number.isFinite(value) && Number.isFinite(maximum) && maximum > 0\n ? Math.max(0, Math.min(1, value / maximum))\n : 0;\n return (<span\n {...restProps}\n className={cn(dataBarStyles(), className)}\n data-partial={partial}\n >\n <span>\n {children}\n </span>\n <span\n className={cn(dataBarTrackStyles())}\n aria-hidden=\"true\"\n >\n <span\n style={{ width: `${ratio * 100}%` }}\n />\n </span>\n </span>);\n};\n", "/**\n * @author WMXPY\n * @package Data Cell\n * @namespace DataValue\n * @description Style\n */\n\nimport { cn } from \"@gridui/style-utils\";\nimport { cva } from \"class-variance-authority\";\n\nexport const dataValueStyles = cva(cn(\n \"gridui-data-value\",\n \"gridui-u-data-cell--[&>small]:text-muted gridui-u-data-cell--[&>small]:type-supporting\",\n));\n\nexport const dataMonoStyles = cva(cn(\n \"gridui-data-mono\",\n \"gridui-u-data-cell--type-code gridui-u-data-cell--whitespace-nowrap\",\n));\n", "/**\n * @author WMXPY\n * @package Data Cell\n * @namespace DataValue\n * @description Data Value\n */\n\nimport { dataMonoStyles, dataValueStyles } from \"./style\";\nimport { cn } from \"@gridui/style-utils\";\nimport type { ComponentPropsWithRef, FC, ReactNode } from \"react\";\n\nexport type DataValueProps = ComponentPropsWithRef<\"span\"> & {\n readonly detail?: ReactNode;\n readonly mono?: boolean;\n readonly tabular?: boolean;\n readonly direction?: \"column\" | \"row\";\n readonly align?: \"start\" | \"center\" | \"end\";\n};\n\nexport const DataValue: FC<DataValueProps> = (props: DataValueProps) => {\n const {\n children,\n detail,\n mono = false,\n tabular = false,\n direction = \"column\",\n align = \"start\",\n className,\n ...restProps\n } = props;\n return (<span\n {...restProps}\n data-direction={direction}\n data-align={align}\n data-tabular={tabular || undefined}\n className={cn(dataValueStyles(), mono && dataMonoStyles(), className)}\n >\n <span>\n {children}\n </span>\n {detail !== undefined && (<small>\n {detail}\n </small>)}\n </span>);\n};\n"],
5
- "mappings": ";AAOA,SAAS,UAAU;AACnB,SAAS,WAAW;AAEb,IAAM,kBAAkB,IAAI;AAAA,EAC/B;AAAA,EACA;AAAA,EACA;AACJ,CAAC;;;ACND,SAAS,MAAAA,WAAU;AAcP;AAPL,IAAM,YAAgC,CAAC,UAA0B;AACpE,QAAM;AAAA,IACF;AAAA,IACA,OAAO;AAAA,IACP;AAAA,IACA,GAAG;AAAA,EACP,IAAI;AACJ,SAAQ;AAAA,IAAC;AAAA;AAAA,MACJ,GAAG;AAAA,MACJ,WAAWA,IAAG,gBAAgB,GAAG,SAAS;AAAA,MAC1C,aAAW;AAAA,MAEV;AAAA;AAAA,EACL;AACJ;;;ACtBA,SAAS,MAAAC,WAAU;AACnB,SAAS,OAAAC,YAAW;AAEb,IAAM,gBAAgBA,KAAID;AAAA,EAC7B;AAAA,EACA;AAAA,EACA;AACJ,CAAC;AAEM,IAAM,qBAAqBC,KAAID;AAAA,EAClC;AAAA,EACA;AAAA,EACA;AACJ,CAAC;;;ACZD,SAAS,MAAAE,WAAU;AAqBP,SAKJ,OAAAC,MALI;AAZL,IAAM,UAA4B,CAAC,UAAwB;AAC9D,QAAM;AAAA,IACF;AAAA,IACA;AAAA,IACA,UAAU;AAAA,IACV;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACP,IAAI;AACJ,QAAM,QAAQ,OAAO,SAAS,KAAK,KAAK,OAAO,SAAS,OAAO,KAAK,UAAU,IACxE,KAAK,IAAI,GAAG,KAAK,IAAI,GAAG,QAAQ,OAAO,CAAC,IACxC;AACN,SAAQ;AAAA,IAAC;AAAA;AAAA,MACJ,GAAG;AAAA,MACJ,WAAWD,IAAG,cAAc,GAAG,SAAS;AAAA,MACxC,gBAAc;AAAA,MAEd;AAAA,wBAAAC,KAAC,UACI,UACL;AAAA,QACA,gBAAAA;AAAA,UAAC;AAAA;AAAA,YACG,WAAWD,IAAG,mBAAmB,CAAC;AAAA,YAClC,eAAY;AAAA,YAEZ,0BAAAC;AAAA,cAAC;AAAA;AAAA,gBACG,OAAO,EAAE,OAAO,GAAG,QAAQ,GAAG,IAAI;AAAA;AAAA,YACtC;AAAA;AAAA,QACJ;AAAA;AAAA;AAAA,EACJ;AACJ;;;ACvCA,SAAS,MAAAC,WAAU;AACnB,SAAS,OAAAC,YAAW;AAEb,IAAM,kBAAkBA,KAAID;AAAA,EAC/B;AAAA,EACA;AACJ,CAAC;AAEM,IAAM,iBAAiBC,KAAID;AAAA,EAC9B;AAAA,EACA;AACJ,CAAC;;;ACVD,SAAS,MAAAE,WAAU;AAsBP,SAOJ,OAAAC,MAPI,QAAAC,aAAA;AAXL,IAAM,YAAgC,CAAC,UAA0B;AACpE,QAAM;AAAA,IACF;AAAA,IACA;AAAA,IACA,OAAO;AAAA,IACP,UAAU;AAAA,IACV,YAAY;AAAA,IACZ,QAAQ;AAAA,IACR;AAAA,IACA,GAAG;AAAA,EACP,IAAI;AACJ,SAAQ,gBAAAA;AAAA,IAAC;AAAA;AAAA,MACJ,GAAG;AAAA,MACJ,kBAAgB;AAAA,MAChB,cAAY;AAAA,MACZ,gBAAc,WAAW;AAAA,MACzB,WAAWF,IAAG,gBAAgB,GAAG,QAAQ,eAAe,GAAG,SAAS;AAAA,MAEpE;AAAA,wBAAAC,KAAC,UACI,UACL;AAAA,QACC,WAAW,UAAc,gBAAAA,KAAC,WACtB,kBACL;AAAA;AAAA;AAAA,EACJ;AACJ;",
4
+ "sourcesContent": ["/**\n * @author WMXPY\n * @package Data Cell\n * @namespace DataBadge\n * @description Style\n */\n\nimport { cn } from \"@gridui/style-utils\";\nimport { cva } from \"class-variance-authority\";\n\nexport const dataBadgeStyles = cva(cn(\n \"gridui-data-badge\",\n \"gridui-u-data-cell--inline-block gridui-u-data-cell--py-gridui-4 gridui-u-data-cell--px-gridui-8 gridui-u-data-cell--text-foreground gridui-u-data-cell--bg-surface gridui-u-data-cell--type-caption gridui-u-data-cell--whitespace-nowrap\",\n \"gridui-u-data-cell--data-[tone='accent']:text-foreground gridui-u-data-cell--data-[tone='accent']:bg-brand-tint\",\n));\n", "/**\n * @author WMXPY\n * @package Data Cell\n * @namespace DataBadge\n * @description Data Badge\n */\n\nimport { dataBadgeStyles } from \"./style\";\nimport { cn } from \"@gridui/style-utils\";\nimport type { ComponentPropsWithRef, FC } from \"react\";\n\nexport type DataBadgeProps = ComponentPropsWithRef<\"span\"> & {\n readonly tone?: \"neutral\" | \"accent\";\n};\n\nexport const DataBadge: FC<DataBadgeProps> = (props: DataBadgeProps) => {\n const {\n children,\n tone = \"neutral\",\n className,\n ...restProps\n } = props;\n return (<span\n {...restProps}\n className={cn(dataBadgeStyles(), className)}\n data-tone={tone}\n >\n {children}\n </span>);\n};\n", "/**\n * @author WMXPY\n * @package Data Cell\n * @namespace DataBar\n * @description Style\n */\n\nimport { cn } from \"@gridui/style-utils\";\nimport { cva } from \"class-variance-authority\";\n\nexport const dataBarStyles = cva(cn(\n \"gridui-data-bar\",\n \"gridui-u-data-cell--grid gridui-u-data-cell--min-w-gridui-64 gridui-u-data-cell--gap-gridui-8 gridui-u-data-cell--tabular-nums\",\n \"gridui-u-data-cell--[&[data-partial='true']_.gridui-data-bar-track>span]:bg-transparent\",\n));\n\nexport const dataBarTrackStyles = cva(cn(\n \"gridui-data-bar-track\",\n \"gridui-u-data-cell--h-(--gridui-space-4) gridui-u-data-cell--bg-brand-tint\",\n \"gridui-u-data-cell--[&_>_span]:block gridui-u-data-cell--[&_>_span]:h-full gridui-u-data-cell--[&_>_span]:bg-accent-background\",\n));\n", "/**\n * @author WMXPY\n * @package Data Cell\n * @namespace DataBar\n * @description Data Bar\n */\n\nimport { dataBarStyles, dataBarTrackStyles } from \"./style\";\nimport { cn } from \"@gridui/style-utils\";\nimport type { ComponentPropsWithRef, FC } from \"react\";\n\nexport type DataBarProps = ComponentPropsWithRef<\"span\"> & {\n readonly value: number;\n readonly maximum: number;\n readonly partial?: boolean;\n};\n\nexport const DataBar: FC<DataBarProps> = (props: DataBarProps) => {\n const {\n value,\n maximum,\n partial = false,\n children,\n className,\n ...restProps\n } = props;\n const ratio = Number.isFinite(value) && Number.isFinite(maximum) && maximum > 0\n ? Math.max(0, Math.min(1, value / maximum))\n : 0;\n return (<span\n {...restProps}\n className={cn(dataBarStyles(), className)}\n data-partial={partial}\n >\n <span>\n {children}\n </span>\n <span\n className={cn(dataBarTrackStyles())}\n aria-hidden=\"true\"\n >\n <span\n style={{ width: `${ratio * 100}%` }}\n />\n </span>\n </span>);\n};\n", "/**\n * @author WMXPY\n * @package Data Cell\n * @namespace DataValue\n * @description Style\n */\n\nimport { cn } from \"@gridui/style-utils\";\nimport { cva } from \"class-variance-authority\";\n\nexport const dataValueStyles = cva(cn(\n \"gridui-data-value\",\n \"gridui-u-data-cell--[&>small]:text-muted gridui-u-data-cell--[&>small]:type-supporting\",\n), {\n variants: {\n mono: {\n false: null,\n true: \"gridui-data-mono gridui-u-data-cell--type-code gridui-u-data-cell--whitespace-nowrap\",\n },\n },\n defaultVariants: { mono: false },\n});\n", "/**\n * @author WMXPY\n * @package Data Cell\n * @namespace DataValue\n * @description Data Value\n */\n\nimport { dataValueStyles } from \"./style\";\nimport { cn } from \"@gridui/style-utils\";\nimport type { ComponentPropsWithRef, FC, ReactNode } from \"react\";\n\nexport type DataValueProps = ComponentPropsWithRef<\"span\"> & {\n readonly detail?: ReactNode;\n readonly mono?: boolean;\n readonly tabular?: boolean;\n readonly direction?: \"column\" | \"row\";\n readonly align?: \"start\" | \"center\" | \"end\";\n};\n\nexport const DataValue: FC<DataValueProps> = (props: DataValueProps) => {\n const {\n children,\n detail,\n mono = false,\n tabular = false,\n direction = \"column\",\n align = \"start\",\n className,\n ...restProps\n } = props;\n return (<span\n {...restProps}\n data-direction={direction}\n data-align={align}\n data-tabular={tabular || undefined}\n className={cn(dataValueStyles({ mono }), className)}\n >\n <span>\n {children}\n </span>\n {detail !== undefined && (<small>\n {detail}\n </small>)}\n </span>);\n};\n"],
5
+ "mappings": ";AAOA,SAAS,UAAU;AACnB,SAAS,WAAW;AAEb,IAAM,kBAAkB,IAAI;AAAA,EAC/B;AAAA,EACA;AAAA,EACA;AACJ,CAAC;;;ACND,SAAS,MAAAA,WAAU;AAcP;AAPL,IAAM,YAAgC,CAAC,UAA0B;AACpE,QAAM;AAAA,IACF;AAAA,IACA,OAAO;AAAA,IACP;AAAA,IACA,GAAG;AAAA,EACP,IAAI;AACJ,SAAQ;AAAA,IAAC;AAAA;AAAA,MACJ,GAAG;AAAA,MACJ,WAAWA,IAAG,gBAAgB,GAAG,SAAS;AAAA,MAC1C,aAAW;AAAA,MAEV;AAAA;AAAA,EACL;AACJ;;;ACtBA,SAAS,MAAAC,WAAU;AACnB,SAAS,OAAAC,YAAW;AAEb,IAAM,gBAAgBA,KAAID;AAAA,EAC7B;AAAA,EACA;AAAA,EACA;AACJ,CAAC;AAEM,IAAM,qBAAqBC,KAAID;AAAA,EAClC;AAAA,EACA;AAAA,EACA;AACJ,CAAC;;;ACZD,SAAS,MAAAE,WAAU;AAqBP,SAKJ,OAAAC,MALI;AAZL,IAAM,UAA4B,CAAC,UAAwB;AAC9D,QAAM;AAAA,IACF;AAAA,IACA;AAAA,IACA,UAAU;AAAA,IACV;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACP,IAAI;AACJ,QAAM,QAAQ,OAAO,SAAS,KAAK,KAAK,OAAO,SAAS,OAAO,KAAK,UAAU,IACxE,KAAK,IAAI,GAAG,KAAK,IAAI,GAAG,QAAQ,OAAO,CAAC,IACxC;AACN,SAAQ;AAAA,IAAC;AAAA;AAAA,MACJ,GAAG;AAAA,MACJ,WAAWD,IAAG,cAAc,GAAG,SAAS;AAAA,MACxC,gBAAc;AAAA,MAEd;AAAA,wBAAAC,KAAC,UACI,UACL;AAAA,QACA,gBAAAA;AAAA,UAAC;AAAA;AAAA,YACG,WAAWD,IAAG,mBAAmB,CAAC;AAAA,YAClC,eAAY;AAAA,YAEZ,0BAAAC;AAAA,cAAC;AAAA;AAAA,gBACG,OAAO,EAAE,OAAO,GAAG,QAAQ,GAAG,IAAI;AAAA;AAAA,YACtC;AAAA;AAAA,QACJ;AAAA;AAAA;AAAA,EACJ;AACJ;;;ACvCA,SAAS,MAAAC,WAAU;AACnB,SAAS,OAAAC,YAAW;AAEb,IAAM,kBAAkBA,KAAID;AAAA,EAC/B;AAAA,EACA;AACJ,GAAG;AAAA,EACC,UAAU;AAAA,IACN,MAAM;AAAA,MACF,OAAO;AAAA,MACP,MAAM;AAAA,IACV;AAAA,EACJ;AAAA,EACA,iBAAiB,EAAE,MAAM,MAAM;AACnC,CAAC;;;ACbD,SAAS,MAAAE,WAAU;AAsBP,SAOJ,OAAAC,MAPI,QAAAC,aAAA;AAXL,IAAM,YAAgC,CAAC,UAA0B;AACpE,QAAM;AAAA,IACF;AAAA,IACA;AAAA,IACA,OAAO;AAAA,IACP,UAAU;AAAA,IACV,YAAY;AAAA,IACZ,QAAQ;AAAA,IACR;AAAA,IACA,GAAG;AAAA,EACP,IAAI;AACJ,SAAQ,gBAAAA;AAAA,IAAC;AAAA;AAAA,MACJ,GAAG;AAAA,MACJ,kBAAgB;AAAA,MAChB,cAAY;AAAA,MACZ,gBAAc,WAAW;AAAA,MACzB,WAAWF,IAAG,gBAAgB,EAAE,KAAK,CAAC,GAAG,SAAS;AAAA,MAElD;AAAA,wBAAAC,KAAC,UACI,UACL;AAAA,QACC,WAAW,UAAc,gBAAAA,KAAC,WACtB,kBACL;AAAA;AAAA;AAAA,EACJ;AACJ;",
6
6
  "names": ["cn", "cn", "cva", "cn", "jsx", "cn", "cva", "cn", "jsx", "jsxs"]
7
7
  }
package/docs/catalog.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "schemaVersion": 1,
3
3
  "name": "@gridui/data-cell",
4
- "version": "1.1.0",
4
+ "version": "1.1.1",
5
5
  "category": "data",
6
6
  "description": "GridUI React data cell",
7
7
  "usage": "Component reference contains focused API pages for each public component.",
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@gridui/data-cell",
3
- "version": "1.1.0",
3
+ "version": "1.1.1",
4
4
  "description": "GridUI React data cell",
5
5
  "license": "UNLICENSED",
6
6
  "type": "module",
@@ -28,13 +28,14 @@
28
28
  },
29
29
  "dependencies": {
30
30
  "@gridui/style-utils": "^4.0.0",
31
- "@gridui/theme": "^2.5.4",
31
+ "@gridui/theme": "^2.6.0",
32
32
  "class-variance-authority": "0.7.1"
33
33
  },
34
34
  "devDependencies": {
35
35
  "@gridui-internal/configuration": "0.0.0-internal",
36
+ "@gridui/grid": "3.0.1",
36
37
  "@jest/globals": "30.5.2",
37
- "@storybook/react-vite": "10.6.6",
38
+ "@storybook/react-vite": "10.6.7",
38
39
  "@types/jest": "30.0.0",
39
40
  "@types/node": "26.6.6",
40
41
  "@types/react": "19.3.0",