@hitachivantara/uikit-react-core 5.44.8 → 5.46.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/cjs/Table/hooks/useFilters.cjs +4 -5
- package/dist/cjs/Table/hooks/useFilters.cjs.map +1 -1
- package/dist/cjs/Table/hooks/useGlobalFilter.cjs +4 -5
- package/dist/cjs/Table/hooks/useGlobalFilter.cjs.map +1 -1
- package/dist/cjs/Table/renderers/renderers.cjs +3 -2
- package/dist/cjs/Table/renderers/renderers.cjs.map +1 -1
- package/dist/cjs/index.cjs +4 -11
- package/dist/cjs/index.cjs.map +1 -1
- package/dist/cjs/utils/theme.cjs +2 -16
- package/dist/cjs/utils/theme.cjs.map +1 -1
- package/dist/esm/Table/hooks/useFilters.js +4 -3
- package/dist/esm/Table/hooks/useFilters.js.map +1 -1
- package/dist/esm/Table/hooks/useGlobalFilter.js +4 -3
- package/dist/esm/Table/hooks/useGlobalFilter.js.map +1 -1
- package/dist/esm/Table/renderers/renderers.js +3 -2
- package/dist/esm/Table/renderers/renderers.js.map +1 -1
- package/dist/esm/index.js +4 -5
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/utils/theme.js +3 -17
- package/dist/esm/utils/theme.js.map +1 -1
- package/dist/types/index.d.ts +1 -1
- package/package.json +5 -5
|
@@ -1,9 +1,8 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
|
|
3
3
|
const reactTable = require("react-table");
|
|
4
|
-
reactTable.useFilters.
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
});
|
|
4
|
+
const useHvFilters = reactTable.useFilters.bind({});
|
|
5
|
+
useHvFilters.pluginName = "useHvFilters";
|
|
6
|
+
const useHvFilters$1 = useHvFilters;
|
|
7
|
+
exports.default = useHvFilters$1;
|
|
9
8
|
//# sourceMappingURL=useFilters.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useFilters.cjs","sources":["../../../../src/Table/hooks/useFilters.ts"],"sourcesContent":["import { useFilters
|
|
1
|
+
{"version":3,"file":"useFilters.cjs","sources":["../../../../src/Table/hooks/useFilters.ts"],"sourcesContent":["import { useFilters, Hooks } from \"react-table\";\n\nexport type UseFiltersProps = (<D extends object = Record<string, unknown>>(\n hooks: Hooks<D>\n) => void) & { pluginName: string };\n\n// #endregion ##### TYPES #####\n\nconst useHvFilters = useFilters.bind({});\n(useHvFilters.pluginName as string) = \"useHvFilters\";\n\nexport default useHvFilters as UseFiltersProps;\n"],"names":["useFilters"],"mappings":";;;AAQA,MAAM,eAAeA,WAAA,WAAW,KAAK,CAAA,CAAE;AACtC,aAAa,aAAwB;AAEtC,MAAA,iBAAe;;"}
|
|
@@ -1,9 +1,8 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
|
|
3
3
|
const reactTable = require("react-table");
|
|
4
|
-
reactTable.useGlobalFilter.
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
});
|
|
4
|
+
const useHvGlobalFilter = reactTable.useGlobalFilter.bind({});
|
|
5
|
+
useHvGlobalFilter.pluginName = "useHvGlobalFilter";
|
|
6
|
+
const useHvGlobalFilter$1 = useHvGlobalFilter;
|
|
7
|
+
exports.default = useHvGlobalFilter$1;
|
|
9
8
|
//# sourceMappingURL=useGlobalFilter.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useGlobalFilter.cjs","sources":["../../../../src/Table/hooks/useGlobalFilter.ts"],"sourcesContent":["import { useGlobalFilter
|
|
1
|
+
{"version":3,"file":"useGlobalFilter.cjs","sources":["../../../../src/Table/hooks/useGlobalFilter.ts"],"sourcesContent":["import { useGlobalFilter, Hooks } from \"react-table\";\n\nexport type UseGlobalFilterProps = (<\n D extends object = Record<string, unknown>\n>(\n hooks: Hooks<D>\n) => void) & { pluginName: string };\n\n// #endregion ##### TYPES #####\n\nconst useHvGlobalFilter = useGlobalFilter.bind({});\n(useHvGlobalFilter.pluginName as string) = \"useHvGlobalFilter\";\n\nexport default useHvGlobalFilter as UseGlobalFilterProps;\n"],"names":["useGlobalFilter"],"mappings":";;;AAUA,MAAM,oBAAoBA,WAAA,gBAAgB,KAAK,CAAA,CAAE;AAChD,kBAAkB,aAAwB;AAE3C,MAAA,sBAAe;;"}
|
|
@@ -131,7 +131,7 @@ function hvSwitchColumn(col, switchLabel, falseLabel, trueLabel, switchProps) {
|
|
|
131
131
|
...col
|
|
132
132
|
};
|
|
133
133
|
}
|
|
134
|
-
function hvDropdownColumn(col, id, placeholder, disabledPlaceholder, onChange) {
|
|
134
|
+
function hvDropdownColumn(col, id, placeholder, disabledPlaceholder, onChange, dropdownProps) {
|
|
135
135
|
return {
|
|
136
136
|
Cell: (cellProps) => {
|
|
137
137
|
const { value, row, column } = cellProps;
|
|
@@ -144,8 +144,9 @@ function hvDropdownColumn(col, id, placeholder, disabledPlaceholder, onChange) {
|
|
|
144
144
|
onChange: (val) => onChange?.(row.id, val),
|
|
145
145
|
disabled,
|
|
146
146
|
dropdownProps: {
|
|
147
|
-
"aria-labelledby": setId.setId(id, column.id) || column.id || id
|
|
147
|
+
"aria-labelledby": setId.setId(id, column.id) || column.id || id,
|
|
148
148
|
// TODO - to be reviewed because it doesn't make much sense
|
|
149
|
+
...dropdownProps
|
|
149
150
|
}
|
|
150
151
|
}
|
|
151
152
|
);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"renderers.cjs","sources":["../../../../src/Table/renderers/renderers.tsx"],"sourcesContent":["import { ClassNames } from \"@emotion/react\";\n\nimport { DropDownXS, DropUpXS } from \"@hitachivantara/uikit-react-icons\";\n\nimport { setId } from \"../../utils/setId\";\nimport { HvTag, HvTagProps } from \"../../Tag\";\nimport { HvButton } from \"../../Button\";\nimport { HvTypography } from \"../../Typography\";\nimport {\n HvOverflowTooltip,\n HvOverflowTooltipProps,\n} from \"../../OverflowTooltip\";\nimport { HvBaseSwitchProps } from \"../../BaseSwitch\";\nimport { HvListValue } from \"../../List\";\n\nimport {\n HvTableHeaderRenderer,\n HvCellProps,\n HvTableColumnConfig,\n HvRowInstance,\n} from \"../hooks/useTable\";\nimport { HvDateColumnCell } from \"./DateColumnCell\";\nimport { HvSwitchColumnCell } from \"./SwitchColumnCell\";\nimport { HvProgressColumnCell } from \"./ProgressColumnCell\";\nimport { HvDropdownColumnCell } from \"./DropdownColumnCell\";\nimport { hvStringFallback, hvNumberFallback } from \"../utils\";\n\nexport function hvTextColumn<\n D extends object = Record<string, unknown>,\n H extends HvTableHeaderRenderer | undefined = HvTableHeaderRenderer\n>(\n col: HvTableColumnConfig<D, H>,\n overflowTooltipProps: Omit<HvOverflowTooltipProps, \"data\"> = {}\n): HvTableColumnConfig<D, H> {\n return {\n Cell: ({ value }: HvCellProps<D, H>) => (\n <HvOverflowTooltip\n data={hvStringFallback(value)}\n {...overflowTooltipProps}\n />\n ),\n sortType: \"alphanumeric\",\n ...col,\n };\n}\n\nexport function hvNumberColumn<\n D extends object = Record<string, unknown>,\n H extends HvTableHeaderRenderer | undefined = HvTableHeaderRenderer\n>(col: HvTableColumnConfig<D, H>): HvTableColumnConfig<D, H> {\n return {\n Cell: ({ value }: HvCellProps<D, H>) => <>{hvNumberFallback(value)}</>,\n align: \"right\",\n sortType: \"number\",\n ...col,\n };\n}\n\nexport function hvDateColumn<\n D extends object = Record<string, unknown>,\n H extends HvTableHeaderRenderer | undefined = HvTableHeaderRenderer\n>(\n col: HvTableColumnConfig<D, H>,\n dateFormat?: string\n): HvTableColumnConfig<D, H> {\n return {\n Cell: ({ value }: HvCellProps<D, H>) => (\n <HvDateColumnCell date={value} dateFormat={dateFormat} />\n ),\n sortType: \"alphanumeric\",\n sortDescFirst: true,\n ...col,\n };\n}\n\nexport function hvExpandColumn<\n D extends object = Record<string, unknown>,\n H extends HvTableHeaderRenderer | undefined = HvTableHeaderRenderer\n>(\n col: HvTableColumnConfig<D, H>,\n expandRowButtonAriaLabel: string,\n collapseRowButtonAriaLabel: string,\n getCanRowExpand?: (row: HvRowInstance<D, H>) => boolean,\n ExpandedIcon: React.ReactNode = <DropUpXS />,\n CollapsedIcon: React.ReactNode = <DropDownXS />\n): HvTableColumnConfig<D, H> {\n return {\n Cell: (cellProps: HvCellProps<D, H>) => {\n const { value, row } = cellProps;\n const expandedProps = row.getToggleRowExpandedProps?.();\n\n const hasContent = getCanRowExpand?.(row) ?? true;\n\n return (\n <ClassNames>\n {({ css }) => (\n <>\n {hasContent && (\n <HvButton\n icon\n aria-label={\n row.isExpanded\n ? collapseRowButtonAriaLabel\n : expandRowButtonAriaLabel\n }\n aria-expanded={row.isExpanded}\n onClick={expandedProps?.onClick}\n classes={{\n root: css({\n position: \"absolute\",\n left: 0,\n top: \"50%\",\n transform: \"translateY(-50%)\",\n }),\n }}\n >\n {row.isExpanded ? ExpandedIcon : CollapsedIcon}\n </HvButton>\n )}\n\n <HvOverflowTooltip data={hvStringFallback(value)} />\n </>\n )}\n </ClassNames>\n );\n },\n sortType: \"alphanumeric\",\n cellStyle: {\n position: \"relative\",\n },\n ...col,\n };\n}\n\nexport function hvTagColumn<\n D extends object = Record<string, unknown>,\n H extends HvTableHeaderRenderer | undefined = HvTableHeaderRenderer,\n A extends object = Record<string, unknown>\n>(\n col: HvTableColumnConfig<D, H>,\n valueDataKey: keyof A,\n colorDataKey: keyof A,\n textColorDataKey: keyof A,\n fromRowData: boolean = false,\n tagProps?: HvTagProps\n): HvTableColumnConfig<D, H> {\n return {\n Cell: (cellProps: HvCellProps<D, H>) => {\n const { value, row } = cellProps;\n if (!value) {\n return <>—</>;\n }\n\n const {\n [valueDataKey]: name,\n [colorDataKey]: color,\n [textColorDataKey]: textColor,\n } = fromRowData ? row.original : value;\n\n return (\n <HvTag\n label={<HvTypography variant=\"body\">{name}</HvTypography>}\n type=\"semantic\"\n color={color}\n style={textColor != null ? { color: textColor } : {}}\n tabIndex={-1}\n {...tagProps}\n />\n );\n },\n cellStyle: {\n paddingTop: 0,\n paddingBottom: 0,\n },\n ...col,\n };\n}\n\n// TODO - Review accessibility on the next renderers because they all differ\n\nexport function hvSwitchColumn<\n D extends object = Record<string, unknown>,\n H extends HvTableHeaderRenderer | undefined = HvTableHeaderRenderer\n>(\n col: HvTableColumnConfig<D, H>,\n switchLabel: string,\n falseLabel?: string,\n trueLabel?: string,\n switchProps?: HvBaseSwitchProps\n): HvTableColumnConfig<D, H> {\n return {\n Cell: (cellProps: HvCellProps<D, H>) => {\n const { value, row } = cellProps;\n return (\n <HvSwitchColumnCell\n checked={value}\n value={row.id}\n switchLabel={switchLabel}\n falseLabel={falseLabel}\n trueLabel={trueLabel}\n switchProps={switchProps}\n />\n );\n },\n cellStyle: {\n paddingTop: 0,\n paddingBottom: 0,\n },\n ...col,\n };\n}\n\nexport function hvDropdownColumn<\n D extends object = Record<string, unknown>,\n H extends HvTableHeaderRenderer | undefined = HvTableHeaderRenderer\n>(\n col: HvTableColumnConfig<D, H>,\n id: string | undefined,\n placeholder: string,\n disabledPlaceholder: string,\n onChange?: (identifier: string, value: HvListValue) => void\n): HvTableColumnConfig<D, H> {\n return {\n Cell: (cellProps: HvCellProps<D, H>) => {\n const { value, row, column } = cellProps;\n const disabled =\n !Array.isArray(value) || (Array.isArray(value) && value.length < 1);\n return (\n <HvDropdownColumnCell\n values={value}\n placeholder={disabled ? disabledPlaceholder : placeholder}\n onChange={(val) => onChange?.(row.id, val)}\n disabled={disabled}\n dropdownProps={{\n \"aria-labelledby\": setId(id, column.id) || column.id || id, // TODO - to be reviewed because it doesn't make much sense\n }}\n />\n );\n },\n cellStyle: {\n paddingTop: 0,\n paddingBottom: 0,\n },\n ...col,\n };\n}\n\nexport function hvProgressColumn<\n D extends object = Record<string, unknown>,\n H extends HvTableHeaderRenderer | undefined = HvTableHeaderRenderer\n>(\n col: HvTableColumnConfig<D, H>,\n getPartial?: (row: HvRowInstance<D, H>) => number,\n getTotal?: (row: HvRowInstance<D, H>) => number,\n color?: \"primary\" | \"secondary\"\n): HvTableColumnConfig<D, H> {\n return {\n Cell: (cellProps: HvCellProps<D, H>) => {\n const { row, column } = cellProps;\n const partial = getPartial?.(row) || 0;\n const total = getTotal?.(row);\n\n if (total) {\n return (\n <HvProgressColumnCell\n partial={partial}\n total={total}\n color={color}\n aria-labelledby={column.id}\n />\n );\n }\n\n return <>—</>;\n },\n\n cellStyle: {\n paddingTop: 0,\n paddingBottom: 0,\n },\n ...col,\n };\n}\n"],"names":["jsx","HvOverflowTooltip","hvStringFallback","Fragment","hvNumberFallback","HvDateColumnCell","DropUpXS","DropDownXS","ClassNames","jsxs","HvButton","HvTag","HvTypography","HvSwitchColumnCell","HvDropdownColumnCell","setId","HvProgressColumnCell"],"mappings":";;;;;;;;;;;;;;;AA2BO,SAAS,aAId,KACA,uBAA6D,IAClC;AACpB,SAAA;AAAA,IACL,MAAM,CAAC,EAAE,MAAA,MACPA,2BAAA;AAAA,MAACC,gBAAA;AAAA,MAAA;AAAA,QACC,MAAMC,2BAAiB,KAAK;AAAA,QAC3B,GAAG;AAAA,MAAA;AAAA,IACN;AAAA,IAEF,UAAU;AAAA,IACV,GAAG;AAAA,EAAA;AAEP;AAEO,SAAS,eAGd,KAA2D;AACpD,SAAA;AAAA,IACL,MAAM,CAAC,EAAE,MAAA,MAAkCF,2BAAA,IAAAG,qBAAA,EAAA,UAAAC,UAAAA,iBAAiB,KAAK,GAAE;AAAA,IACnE,OAAO;AAAA,IACP,UAAU;AAAA,IACV,GAAG;AAAA,EAAA;AAEP;AAEgB,SAAA,aAId,KACA,YAC2B;AACpB,SAAA;AAAA,IACL,MAAM,CAAC,EAAE,MAAA,MACNJ,2BAAA,IAAAK,eAAA,kBAAA,EAAiB,MAAM,OAAO,YAAwB;AAAA,IAEzD,UAAU;AAAA,IACV,eAAe;AAAA,IACf,GAAG;AAAA,EAAA;AAEP;AAEO,SAAS,eAId,KACA,0BACA,4BACA,iBACA,eAAiCL,2BAAAA,IAAAM,gBAAAA,UAAA,CAAA,CAAS,GAC1C,gBAAkCN,2BAAA,IAAAO,gBAAA,YAAA,CAAW,CAAA,GAClB;AACpB,SAAA;AAAA,IACL,MAAM,CAAC,cAAiC;AAChC,YAAA,EAAE,OAAO,IAAQ,IAAA;AACjB,YAAA,gBAAgB,IAAI;AAEpB,YAAA,aAAa,kBAAkB,GAAG,KAAK;AAE7C,4CACGC,kBACE,EAAA,UAAA,CAAC,EAAE,IAAA,MAECC,2BAAA,KAAAN,qBAAA,EAAA,UAAA;AAAA,QACC,cAAAH,2BAAA;AAAA,UAACU,OAAA;AAAA,UAAA;AAAA,YACC,MAAI;AAAA,YACJ,cACE,IAAI,aACA,6BACA;AAAA,YAEN,iBAAe,IAAI;AAAA,YACnB,SAAS,eAAe;AAAA,YACxB,SAAS;AAAA,cACP,MAAM,IAAI;AAAA,gBACR,UAAU;AAAA,gBACV,MAAM;AAAA,gBACN,KAAK;AAAA,gBACL,WAAW;AAAA,cAAA,CACZ;AAAA,YACH;AAAA,YAEC,UAAA,IAAI,aAAa,eAAe;AAAA,UAAA;AAAA,QACnC;AAAA,QAGDV,2BAAA,IAAAC,gBAAA,mBAAA,EAAkB,MAAMC,UAAAA,iBAAiB,KAAK,EAAG,CAAA;AAAA,MAAA,EACpD,CAAA,EAEJ,CAAA;AAAA,IAEJ;AAAA,IACA,UAAU;AAAA,IACV,WAAW;AAAA,MACT,UAAU;AAAA,IACZ;AAAA,IACA,GAAG;AAAA,EAAA;AAEP;AAEO,SAAS,YAKd,KACA,cACA,cACA,kBACA,cAAuB,OACvB,UAC2B;AACpB,SAAA;AAAA,IACL,MAAM,CAAC,cAAiC;AAChC,YAAA,EAAE,OAAO,IAAQ,IAAA;AACvB,UAAI,CAAC,OAAO;AACV,qEAAS,UAAC,IAAA,CAAA;AAAA,MACZ;AAEM,YAAA;AAAA,QACJ,CAAC,YAAY,GAAG;AAAA,QAChB,CAAC,YAAY,GAAG;AAAA,QAChB,CAAC,gBAAgB,GAAG;AAAA,MACtB,IAAI,cAAc,IAAI,WAAW;AAG/B,aAAAF,2BAAA;AAAA,QAACW,IAAA;AAAA,QAAA;AAAA,UACC,OAAOX,2BAAA,IAACY,yBAAa,EAAA,SAAQ,QAAQ,UAAK,MAAA;AAAA,UAC1C,MAAK;AAAA,UACL;AAAA,UACA,OAAO,aAAa,OAAO,EAAE,OAAO,cAAc,CAAC;AAAA,UACnD,UAAU;AAAA,UACT,GAAG;AAAA,QAAA;AAAA,MAAA;AAAA,IAGV;AAAA,IACA,WAAW;AAAA,MACT,YAAY;AAAA,MACZ,eAAe;AAAA,IACjB;AAAA,IACA,GAAG;AAAA,EAAA;AAEP;AAIO,SAAS,eAId,KACA,aACA,YACA,WACA,aAC2B;AACpB,SAAA;AAAA,IACL,MAAM,CAAC,cAAiC;AAChC,YAAA,EAAE,OAAO,IAAQ,IAAA;AAErB,aAAAZ,2BAAA;AAAA,QAACa,iBAAA;AAAA,QAAA;AAAA,UACC,SAAS;AAAA,UACT,OAAO,IAAI;AAAA,UACX;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QAAA;AAAA,MAAA;AAAA,IAGN;AAAA,IACA,WAAW;AAAA,MACT,YAAY;AAAA,MACZ,eAAe;AAAA,IACjB;AAAA,IACA,GAAG;AAAA,EAAA;AAEP;AAEO,SAAS,iBAId,KACA,IACA,aACA,qBACA,UAC2B;AACpB,SAAA;AAAA,IACL,MAAM,CAAC,cAAiC;AACtC,YAAM,EAAE,OAAO,KAAK,OAAA,IAAW;AACzB,YAAA,WACJ,CAAC,MAAM,QAAQ,KAAK,KAAM,MAAM,QAAQ,KAAK,KAAK,MAAM,SAAS;AAEjE,aAAAb,2BAAA;AAAA,QAACc,mBAAA;AAAA,QAAA;AAAA,UACC,QAAQ;AAAA,UACR,aAAa,WAAW,sBAAsB;AAAA,UAC9C,UAAU,CAAC,QAAQ,WAAW,IAAI,IAAI,GAAG;AAAA,UACzC;AAAA,UACA,eAAe;AAAA,YACb,mBAAmBC,MAAM,MAAA,IAAI,OAAO,EAAE,KAAK,OAAO,MAAM;AAAA;AAAA,UAC1D;AAAA,QAAA;AAAA,MAAA;AAAA,IAGN;AAAA,IACA,WAAW;AAAA,MACT,YAAY;AAAA,MACZ,eAAe;AAAA,IACjB;AAAA,IACA,GAAG;AAAA,EAAA;AAEP;AAEO,SAAS,iBAId,KACA,YACA,UACA,OAC2B;AACpB,SAAA;AAAA,IACL,MAAM,CAAC,cAAiC;AAChC,YAAA,EAAE,KAAK,OAAW,IAAA;AAClB,YAAA,UAAU,aAAa,GAAG,KAAK;AAC/B,YAAA,QAAQ,WAAW,GAAG;AAE5B,UAAI,OAAO;AAEP,eAAAf,2BAAA;AAAA,UAACgB,mBAAA;AAAA,UAAA;AAAA,YACC;AAAA,YACA;AAAA,YACA;AAAA,YACA,mBAAiB,OAAO;AAAA,UAAA;AAAA,QAAA;AAAA,MAG9B;AAEA,mEAAS,UAAC,IAAA,CAAA;AAAA,IACZ;AAAA,IAEA,WAAW;AAAA,MACT,YAAY;AAAA,MACZ,eAAe;AAAA,IACjB;AAAA,IACA,GAAG;AAAA,EAAA;AAEP;;;;;;;;;"}
|
|
1
|
+
{"version":3,"file":"renderers.cjs","sources":["../../../../src/Table/renderers/renderers.tsx"],"sourcesContent":["import { ClassNames } from \"@emotion/react\";\n\nimport { DropDownXS, DropUpXS } from \"@hitachivantara/uikit-react-icons\";\n\nimport { setId } from \"../../utils/setId\";\nimport { HvTag, HvTagProps } from \"../../Tag\";\nimport { HvButton } from \"../../Button\";\nimport { HvTypography } from \"../../Typography\";\nimport {\n HvOverflowTooltip,\n HvOverflowTooltipProps,\n} from \"../../OverflowTooltip\";\nimport { HvBaseSwitchProps } from \"../../BaseSwitch\";\nimport { HvListValue } from \"../../List\";\n\nimport {\n HvTableHeaderRenderer,\n HvCellProps,\n HvTableColumnConfig,\n HvRowInstance,\n} from \"../hooks/useTable\";\nimport { HvDateColumnCell } from \"./DateColumnCell\";\nimport { HvSwitchColumnCell } from \"./SwitchColumnCell\";\nimport { HvProgressColumnCell } from \"./ProgressColumnCell\";\nimport { HvDropdownColumnCell } from \"./DropdownColumnCell\";\nimport { hvStringFallback, hvNumberFallback } from \"../utils\";\nimport { HvDropdownProps } from \"../../Dropdown\";\n\nexport function hvTextColumn<\n D extends object = Record<string, unknown>,\n H extends HvTableHeaderRenderer | undefined = HvTableHeaderRenderer\n>(\n col: HvTableColumnConfig<D, H>,\n overflowTooltipProps: Omit<HvOverflowTooltipProps, \"data\"> = {}\n): HvTableColumnConfig<D, H> {\n return {\n Cell: ({ value }: HvCellProps<D, H>) => (\n <HvOverflowTooltip\n data={hvStringFallback(value)}\n {...overflowTooltipProps}\n />\n ),\n sortType: \"alphanumeric\",\n ...col,\n };\n}\n\nexport function hvNumberColumn<\n D extends object = Record<string, unknown>,\n H extends HvTableHeaderRenderer | undefined = HvTableHeaderRenderer\n>(col: HvTableColumnConfig<D, H>): HvTableColumnConfig<D, H> {\n return {\n Cell: ({ value }: HvCellProps<D, H>) => <>{hvNumberFallback(value)}</>,\n align: \"right\",\n sortType: \"number\",\n ...col,\n };\n}\n\nexport function hvDateColumn<\n D extends object = Record<string, unknown>,\n H extends HvTableHeaderRenderer | undefined = HvTableHeaderRenderer\n>(\n col: HvTableColumnConfig<D, H>,\n dateFormat?: string\n): HvTableColumnConfig<D, H> {\n return {\n Cell: ({ value }: HvCellProps<D, H>) => (\n <HvDateColumnCell date={value} dateFormat={dateFormat} />\n ),\n sortType: \"alphanumeric\",\n sortDescFirst: true,\n ...col,\n };\n}\n\nexport function hvExpandColumn<\n D extends object = Record<string, unknown>,\n H extends HvTableHeaderRenderer | undefined = HvTableHeaderRenderer\n>(\n col: HvTableColumnConfig<D, H>,\n expandRowButtonAriaLabel: string,\n collapseRowButtonAriaLabel: string,\n getCanRowExpand?: (row: HvRowInstance<D, H>) => boolean,\n ExpandedIcon: React.ReactNode = <DropUpXS />,\n CollapsedIcon: React.ReactNode = <DropDownXS />\n): HvTableColumnConfig<D, H> {\n return {\n Cell: (cellProps: HvCellProps<D, H>) => {\n const { value, row } = cellProps;\n const expandedProps = row.getToggleRowExpandedProps?.();\n\n const hasContent = getCanRowExpand?.(row) ?? true;\n\n return (\n <ClassNames>\n {({ css }) => (\n <>\n {hasContent && (\n <HvButton\n icon\n aria-label={\n row.isExpanded\n ? collapseRowButtonAriaLabel\n : expandRowButtonAriaLabel\n }\n aria-expanded={row.isExpanded}\n onClick={expandedProps?.onClick}\n classes={{\n root: css({\n position: \"absolute\",\n left: 0,\n top: \"50%\",\n transform: \"translateY(-50%)\",\n }),\n }}\n >\n {row.isExpanded ? ExpandedIcon : CollapsedIcon}\n </HvButton>\n )}\n\n <HvOverflowTooltip data={hvStringFallback(value)} />\n </>\n )}\n </ClassNames>\n );\n },\n sortType: \"alphanumeric\",\n cellStyle: {\n position: \"relative\",\n },\n ...col,\n };\n}\n\nexport function hvTagColumn<\n D extends object = Record<string, unknown>,\n H extends HvTableHeaderRenderer | undefined = HvTableHeaderRenderer,\n A extends object = Record<string, unknown>\n>(\n col: HvTableColumnConfig<D, H>,\n valueDataKey: keyof A,\n colorDataKey: keyof A,\n textColorDataKey: keyof A,\n fromRowData: boolean = false,\n tagProps?: HvTagProps\n): HvTableColumnConfig<D, H> {\n return {\n Cell: (cellProps: HvCellProps<D, H>) => {\n const { value, row } = cellProps;\n if (!value) {\n return <>—</>;\n }\n\n const {\n [valueDataKey]: name,\n [colorDataKey]: color,\n [textColorDataKey]: textColor,\n } = fromRowData ? row.original : value;\n\n return (\n <HvTag\n label={<HvTypography variant=\"body\">{name}</HvTypography>}\n type=\"semantic\"\n color={color}\n style={textColor != null ? { color: textColor } : {}}\n tabIndex={-1}\n {...tagProps}\n />\n );\n },\n cellStyle: {\n paddingTop: 0,\n paddingBottom: 0,\n },\n ...col,\n };\n}\n\n// TODO - Review accessibility on the next renderers because they all differ\n\nexport function hvSwitchColumn<\n D extends object = Record<string, unknown>,\n H extends HvTableHeaderRenderer | undefined = HvTableHeaderRenderer\n>(\n col: HvTableColumnConfig<D, H>,\n switchLabel: string,\n falseLabel?: string,\n trueLabel?: string,\n switchProps?: HvBaseSwitchProps\n): HvTableColumnConfig<D, H> {\n return {\n Cell: (cellProps: HvCellProps<D, H>) => {\n const { value, row } = cellProps;\n return (\n <HvSwitchColumnCell\n checked={value}\n value={row.id}\n switchLabel={switchLabel}\n falseLabel={falseLabel}\n trueLabel={trueLabel}\n switchProps={switchProps}\n />\n );\n },\n cellStyle: {\n paddingTop: 0,\n paddingBottom: 0,\n },\n ...col,\n };\n}\n\nexport function hvDropdownColumn<\n D extends object = Record<string, unknown>,\n H extends HvTableHeaderRenderer | undefined = HvTableHeaderRenderer\n>(\n col: HvTableColumnConfig<D, H>,\n id: string | undefined,\n placeholder: string,\n disabledPlaceholder: string,\n onChange?: (identifier: string, value: HvListValue) => void,\n dropdownProps?: HvDropdownProps\n): HvTableColumnConfig<D, H> {\n return {\n Cell: (cellProps: HvCellProps<D, H>) => {\n const { value, row, column } = cellProps;\n const disabled =\n !Array.isArray(value) || (Array.isArray(value) && value.length < 1);\n return (\n <HvDropdownColumnCell\n values={value}\n placeholder={disabled ? disabledPlaceholder : placeholder}\n onChange={(val) => onChange?.(row.id, val)}\n disabled={disabled}\n dropdownProps={{\n \"aria-labelledby\": setId(id, column.id) || column.id || id, // TODO - to be reviewed because it doesn't make much sense\n ...dropdownProps,\n }}\n />\n );\n },\n cellStyle: {\n paddingTop: 0,\n paddingBottom: 0,\n },\n ...col,\n };\n}\n\nexport function hvProgressColumn<\n D extends object = Record<string, unknown>,\n H extends HvTableHeaderRenderer | undefined = HvTableHeaderRenderer\n>(\n col: HvTableColumnConfig<D, H>,\n getPartial?: (row: HvRowInstance<D, H>) => number,\n getTotal?: (row: HvRowInstance<D, H>) => number,\n color?: \"primary\" | \"secondary\"\n): HvTableColumnConfig<D, H> {\n return {\n Cell: (cellProps: HvCellProps<D, H>) => {\n const { row, column } = cellProps;\n const partial = getPartial?.(row) || 0;\n const total = getTotal?.(row);\n\n if (total) {\n return (\n <HvProgressColumnCell\n partial={partial}\n total={total}\n color={color}\n aria-labelledby={column.id}\n />\n );\n }\n\n return <>—</>;\n },\n\n cellStyle: {\n paddingTop: 0,\n paddingBottom: 0,\n },\n ...col,\n };\n}\n"],"names":["jsx","HvOverflowTooltip","hvStringFallback","Fragment","hvNumberFallback","HvDateColumnCell","DropUpXS","DropDownXS","ClassNames","jsxs","HvButton","HvTag","HvTypography","HvSwitchColumnCell","HvDropdownColumnCell","setId","HvProgressColumnCell"],"mappings":"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"}
|
package/dist/cjs/index.cjs
CHANGED
|
@@ -34,8 +34,6 @@ const theme = require("./utils/theme.cjs");
|
|
|
34
34
|
const useSavedState = require("./utils/useSavedState.cjs");
|
|
35
35
|
const wrapperTooltip = require("./utils/wrapperTooltip.cjs");
|
|
36
36
|
const useTable = require("./Table/hooks/useTable.cjs");
|
|
37
|
-
require("./Table/hooks/useGlobalFilter.cjs");
|
|
38
|
-
require("./Table/hooks/useFilters.cjs");
|
|
39
37
|
const utils = require("./Typography/utils.cjs");
|
|
40
38
|
const Typography_styles = require("./Typography/Typography.styles.cjs");
|
|
41
39
|
const Typography = require("./Typography/Typography.cjs");
|
|
@@ -258,7 +256,8 @@ const useBulkActions = require("./Table/hooks/useBulkActions.cjs");
|
|
|
258
256
|
const useRowExpand = require("./Table/hooks/useRowExpand.cjs");
|
|
259
257
|
const useHeaderGroups = require("./Table/hooks/useHeaderGroups.cjs");
|
|
260
258
|
const useResizeColumns = require("./Table/hooks/useResizeColumns.cjs");
|
|
261
|
-
const
|
|
259
|
+
const useGlobalFilter = require("./Table/hooks/useGlobalFilter.cjs");
|
|
260
|
+
const useFilters = require("./Table/hooks/useFilters.cjs");
|
|
262
261
|
const renderers = require("./Table/renderers/renderers.cjs");
|
|
263
262
|
const DateColumnCell = require("./Table/renderers/DateColumnCell/DateColumnCell.cjs");
|
|
264
263
|
const DropdownColumnCell = require("./Table/renderers/DropdownColumnCell/DropdownColumnCell.cjs");
|
|
@@ -618,14 +617,8 @@ exports.CellWithExpandButton = useRowExpand.CellWithExpandButton;
|
|
|
618
617
|
exports.useHvRowExpand = useRowExpand.default;
|
|
619
618
|
exports.useHvHeaderGroups = useHeaderGroups.default;
|
|
620
619
|
exports.useHvResizeColumns = useResizeColumns.default;
|
|
621
|
-
|
|
622
|
-
|
|
623
|
-
get: () => reactTable.useFilters
|
|
624
|
-
});
|
|
625
|
-
Object.defineProperty(exports, "useHvGlobalFilter", {
|
|
626
|
-
enumerable: true,
|
|
627
|
-
get: () => reactTable.useGlobalFilter
|
|
628
|
-
});
|
|
620
|
+
exports.useHvGlobalFilter = useGlobalFilter.default;
|
|
621
|
+
exports.useHvFilters = useFilters.default;
|
|
629
622
|
exports.hvDateColumn = renderers.hvDateColumn;
|
|
630
623
|
exports.hvDropdownColumn = renderers.hvDropdownColumn;
|
|
631
624
|
exports.hvExpandColumn = renderers.hvExpandColumn;
|
package/dist/cjs/index.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
package/dist/cjs/utils/theme.cjs
CHANGED
|
@@ -2,27 +2,13 @@
|
|
|
2
2
|
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
3
|
const uikitStyles = require("@hitachivantara/uikit-styles");
|
|
4
4
|
const document$1 = require("./document.cjs");
|
|
5
|
-
const setElementStyle = (element, style) => {
|
|
6
|
-
Object.entries(style).forEach(([property, value]) => {
|
|
7
|
-
element.style[property] = value;
|
|
8
|
-
});
|
|
9
|
-
};
|
|
10
5
|
const setElementAttrs = (themeName, modeName, colorScheme, themeRootId) => {
|
|
11
6
|
const element = themeRootId ? document.getElementById(themeRootId) : document.body;
|
|
12
7
|
if (element) {
|
|
13
8
|
element.setAttribute(`data-theme`, themeName);
|
|
14
9
|
element.setAttribute(`data-color-mode`, modeName);
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
backgroundColor: uikitStyles.theme.colors.backgroundColor,
|
|
18
|
-
accentColor: uikitStyles.theme.colors.secondary,
|
|
19
|
-
color: uikitStyles.theme.colors.secondary,
|
|
20
|
-
fontSize: uikitStyles.theme.typography.body.fontSize,
|
|
21
|
-
fontWeight: uikitStyles.theme.typography.body.fontWeight,
|
|
22
|
-
lineHeight: uikitStyles.theme.typography.body.lineHeight,
|
|
23
|
-
letterSpacing: uikitStyles.theme.typography.body.letterSpacing,
|
|
24
|
-
fontFamily: uikitStyles.theme.fontFamily.body
|
|
25
|
-
});
|
|
10
|
+
element.classList.add(`uikit-root-element`);
|
|
11
|
+
element.style.colorScheme = colorScheme;
|
|
26
12
|
}
|
|
27
13
|
};
|
|
28
14
|
const applyThemeCustomizations = (obj, customizations) => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"theme.cjs","sources":["../../../src/utils/theme.ts"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"file":"theme.cjs","sources":["../../../src/utils/theme.ts"],"sourcesContent":["import {\n themes,\n HvThemeColorModeStructure,\n HvThemeStructure,\n} from \"@hitachivantara/uikit-styles\";\n\nimport { HvTheme, HvCreateThemeProps } from \"../types/theme\";\n\nimport { getElementById } from \"./document\";\n\n/**\n * Sets the element attributes and style for a theme and color mode.\n */\nexport const setElementAttrs = (\n themeName: string,\n modeName: string,\n colorScheme: string,\n themeRootId?: string\n) => {\n const element = themeRootId\n ? document.getElementById(themeRootId)\n : document.body;\n\n if (element) {\n element.setAttribute(`data-theme`, themeName);\n element.setAttribute(`data-color-mode`, modeName);\n\n // set default styles for child components to inherit\n element.classList.add(`uikit-root-element`);\n element.style.colorScheme = colorScheme;\n }\n};\n\n/**\n * Applies customizations to a theme.\n */\nconst applyThemeCustomizations = (obj: any, customizations: any) => {\n const isObject = (val: any) =>\n val && typeof val === \"object\" && !Array.isArray(val);\n\n // Customized theme\n const customizedTheme = { ...obj };\n\n // Add new values to the theme or replace values\n Object.keys(customizations).forEach((key) => {\n if (customizedTheme[key]) {\n if (isObject(customizedTheme[key]) && isObject(customizations[key])) {\n customizedTheme[key] = applyThemeCustomizations(\n customizedTheme[key],\n customizations[key]\n );\n } else if (typeof customizedTheme[key] === typeof customizations[key]) {\n customizedTheme[key] = customizations[key];\n }\n } else {\n customizedTheme[key] = customizations[key];\n }\n });\n\n return customizedTheme;\n};\n\n/**\n * Creates a customized theme based on the base theme and customizations given.\n * For the color modes, the colors that are not defined will be replaced by the values from the dawn mode of the base theme.\n */\nexport const createTheme = (\n props: HvCreateThemeProps\n): HvTheme | HvThemeStructure => {\n const {\n name,\n base = \"ds5\",\n inheritColorModes = true,\n ...customizations\n } = props;\n\n // Apply customizations to the base theme\n const customizedTheme: HvTheme | HvThemeStructure = customizations\n ? (applyThemeCustomizations(themes[base], customizations) as HvTheme)\n : { ...themes[base] };\n\n // Set theme name\n customizedTheme.name = name.trim();\n // Set theme base\n customizedTheme.base = base;\n\n // Fill new color modes with missing colors\n if (customizations) {\n Object.keys(customizedTheme.colors.modes).forEach((mode) => {\n if (!themes[base].colors.modes[mode]) {\n customizedTheme.colors.modes[mode] = {\n ...themes[base].colors.modes.dawn,\n ...(customizedTheme.colors.modes[mode] as Partial<\n HvThemeColorModeStructure & { [key: string]: string }\n >),\n };\n }\n });\n }\n\n // If the flag `inheritColorModes` is false and customizations were given for the color modes,\n // we're removing any color modes that might have been inherited\n if (!inheritColorModes && customizations.colors?.modes) {\n Object.keys(customizedTheme.colors.modes).forEach((mode) => {\n if (!Object.keys(customizations.colors?.modes || {}).includes(mode)) {\n delete customizedTheme.colors.modes[mode];\n }\n });\n }\n\n // Created theme\n return customizedTheme;\n};\n\n/**\n * Process the themes provided to the HvProvider:\n * - Cleans themes with the same name\n * - Returns the default if the list is empty (ds5)\n */\nexport const processThemes = (\n themesList?: (HvTheme | HvThemeStructure)[]\n): (HvTheme | HvThemeStructure)[] => {\n if (themesList && Array.isArray(themesList) && themesList.length > 0) {\n const list: (HvTheme | HvThemeStructure)[] = [];\n\n themesList.forEach((thm) => {\n const i: number = list.findIndex(\n (t) => t.name.trim() === thm.name.trim()\n );\n\n if (i !== -1) {\n list.splice(i, 1);\n list.push(thm);\n } else {\n list.push(thm);\n }\n });\n\n // Cleaned themes\n return list;\n }\n // DS5\n return [themes.ds5];\n};\n\nexport const getVarValue = (cssVar: string, rootElementId?: string) => {\n const root = getElementById(rootElementId || \"hv-root\");\n if (!root) return undefined;\n\n return getComputedStyle(root)\n .getPropertyValue(cssVar.replace(\"var(\", \"\").replace(\")\", \"\"))\n .trim();\n};\n"],"names":["themes","getElementById"],"mappings":"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"}
|
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import { useFilters } from "react-table";
|
|
2
|
-
|
|
3
|
-
|
|
2
|
+
const useHvFilters = useFilters.bind({});
|
|
3
|
+
useHvFilters.pluginName = "useHvFilters";
|
|
4
|
+
const useHvFilters$1 = useHvFilters;
|
|
4
5
|
export {
|
|
5
|
-
|
|
6
|
+
useHvFilters$1 as default
|
|
6
7
|
};
|
|
7
8
|
//# sourceMappingURL=useFilters.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useFilters.js","sources":["../../../../src/Table/hooks/useFilters.ts"],"sourcesContent":["import { useFilters
|
|
1
|
+
{"version":3,"file":"useFilters.js","sources":["../../../../src/Table/hooks/useFilters.ts"],"sourcesContent":["import { useFilters, Hooks } from \"react-table\";\n\nexport type UseFiltersProps = (<D extends object = Record<string, unknown>>(\n hooks: Hooks<D>\n) => void) & { pluginName: string };\n\n// #endregion ##### TYPES #####\n\nconst useHvFilters = useFilters.bind({});\n(useHvFilters.pluginName as string) = \"useHvFilters\";\n\nexport default useHvFilters as UseFiltersProps;\n"],"names":[],"mappings":";AAQA,MAAM,eAAe,WAAW,KAAK,CAAA,CAAE;AACtC,aAAa,aAAwB;AAEtC,MAAA,iBAAe;"}
|
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import { useGlobalFilter } from "react-table";
|
|
2
|
-
|
|
3
|
-
|
|
2
|
+
const useHvGlobalFilter = useGlobalFilter.bind({});
|
|
3
|
+
useHvGlobalFilter.pluginName = "useHvGlobalFilter";
|
|
4
|
+
const useHvGlobalFilter$1 = useHvGlobalFilter;
|
|
4
5
|
export {
|
|
5
|
-
|
|
6
|
+
useHvGlobalFilter$1 as default
|
|
6
7
|
};
|
|
7
8
|
//# sourceMappingURL=useGlobalFilter.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useGlobalFilter.js","sources":["../../../../src/Table/hooks/useGlobalFilter.ts"],"sourcesContent":["import { useGlobalFilter
|
|
1
|
+
{"version":3,"file":"useGlobalFilter.js","sources":["../../../../src/Table/hooks/useGlobalFilter.ts"],"sourcesContent":["import { useGlobalFilter, Hooks } from \"react-table\";\n\nexport type UseGlobalFilterProps = (<\n D extends object = Record<string, unknown>\n>(\n hooks: Hooks<D>\n) => void) & { pluginName: string };\n\n// #endregion ##### TYPES #####\n\nconst useHvGlobalFilter = useGlobalFilter.bind({});\n(useHvGlobalFilter.pluginName as string) = \"useHvGlobalFilter\";\n\nexport default useHvGlobalFilter as UseGlobalFilterProps;\n"],"names":[],"mappings":";AAUA,MAAM,oBAAoB,gBAAgB,KAAK,CAAA,CAAE;AAChD,kBAAkB,aAAwB;AAE3C,MAAA,sBAAe;"}
|
|
@@ -129,7 +129,7 @@ function hvSwitchColumn(col, switchLabel, falseLabel, trueLabel, switchProps) {
|
|
|
129
129
|
...col
|
|
130
130
|
};
|
|
131
131
|
}
|
|
132
|
-
function hvDropdownColumn(col, id, placeholder, disabledPlaceholder, onChange) {
|
|
132
|
+
function hvDropdownColumn(col, id, placeholder, disabledPlaceholder, onChange, dropdownProps) {
|
|
133
133
|
return {
|
|
134
134
|
Cell: (cellProps) => {
|
|
135
135
|
const { value, row, column } = cellProps;
|
|
@@ -142,8 +142,9 @@ function hvDropdownColumn(col, id, placeholder, disabledPlaceholder, onChange) {
|
|
|
142
142
|
onChange: (val) => onChange?.(row.id, val),
|
|
143
143
|
disabled,
|
|
144
144
|
dropdownProps: {
|
|
145
|
-
"aria-labelledby": setId(id, column.id) || column.id || id
|
|
145
|
+
"aria-labelledby": setId(id, column.id) || column.id || id,
|
|
146
146
|
// TODO - to be reviewed because it doesn't make much sense
|
|
147
|
+
...dropdownProps
|
|
147
148
|
}
|
|
148
149
|
}
|
|
149
150
|
);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"renderers.js","sources":["../../../../src/Table/renderers/renderers.tsx"],"sourcesContent":["import { ClassNames } from \"@emotion/react\";\n\nimport { DropDownXS, DropUpXS } from \"@hitachivantara/uikit-react-icons\";\n\nimport { setId } from \"../../utils/setId\";\nimport { HvTag, HvTagProps } from \"../../Tag\";\nimport { HvButton } from \"../../Button\";\nimport { HvTypography } from \"../../Typography\";\nimport {\n HvOverflowTooltip,\n HvOverflowTooltipProps,\n} from \"../../OverflowTooltip\";\nimport { HvBaseSwitchProps } from \"../../BaseSwitch\";\nimport { HvListValue } from \"../../List\";\n\nimport {\n HvTableHeaderRenderer,\n HvCellProps,\n HvTableColumnConfig,\n HvRowInstance,\n} from \"../hooks/useTable\";\nimport { HvDateColumnCell } from \"./DateColumnCell\";\nimport { HvSwitchColumnCell } from \"./SwitchColumnCell\";\nimport { HvProgressColumnCell } from \"./ProgressColumnCell\";\nimport { HvDropdownColumnCell } from \"./DropdownColumnCell\";\nimport { hvStringFallback, hvNumberFallback } from \"../utils\";\n\nexport function hvTextColumn<\n D extends object = Record<string, unknown>,\n H extends HvTableHeaderRenderer | undefined = HvTableHeaderRenderer\n>(\n col: HvTableColumnConfig<D, H>,\n overflowTooltipProps: Omit<HvOverflowTooltipProps, \"data\"> = {}\n): HvTableColumnConfig<D, H> {\n return {\n Cell: ({ value }: HvCellProps<D, H>) => (\n <HvOverflowTooltip\n data={hvStringFallback(value)}\n {...overflowTooltipProps}\n />\n ),\n sortType: \"alphanumeric\",\n ...col,\n };\n}\n\nexport function hvNumberColumn<\n D extends object = Record<string, unknown>,\n H extends HvTableHeaderRenderer | undefined = HvTableHeaderRenderer\n>(col: HvTableColumnConfig<D, H>): HvTableColumnConfig<D, H> {\n return {\n Cell: ({ value }: HvCellProps<D, H>) => <>{hvNumberFallback(value)}</>,\n align: \"right\",\n sortType: \"number\",\n ...col,\n };\n}\n\nexport function hvDateColumn<\n D extends object = Record<string, unknown>,\n H extends HvTableHeaderRenderer | undefined = HvTableHeaderRenderer\n>(\n col: HvTableColumnConfig<D, H>,\n dateFormat?: string\n): HvTableColumnConfig<D, H> {\n return {\n Cell: ({ value }: HvCellProps<D, H>) => (\n <HvDateColumnCell date={value} dateFormat={dateFormat} />\n ),\n sortType: \"alphanumeric\",\n sortDescFirst: true,\n ...col,\n };\n}\n\nexport function hvExpandColumn<\n D extends object = Record<string, unknown>,\n H extends HvTableHeaderRenderer | undefined = HvTableHeaderRenderer\n>(\n col: HvTableColumnConfig<D, H>,\n expandRowButtonAriaLabel: string,\n collapseRowButtonAriaLabel: string,\n getCanRowExpand?: (row: HvRowInstance<D, H>) => boolean,\n ExpandedIcon: React.ReactNode = <DropUpXS />,\n CollapsedIcon: React.ReactNode = <DropDownXS />\n): HvTableColumnConfig<D, H> {\n return {\n Cell: (cellProps: HvCellProps<D, H>) => {\n const { value, row } = cellProps;\n const expandedProps = row.getToggleRowExpandedProps?.();\n\n const hasContent = getCanRowExpand?.(row) ?? true;\n\n return (\n <ClassNames>\n {({ css }) => (\n <>\n {hasContent && (\n <HvButton\n icon\n aria-label={\n row.isExpanded\n ? collapseRowButtonAriaLabel\n : expandRowButtonAriaLabel\n }\n aria-expanded={row.isExpanded}\n onClick={expandedProps?.onClick}\n classes={{\n root: css({\n position: \"absolute\",\n left: 0,\n top: \"50%\",\n transform: \"translateY(-50%)\",\n }),\n }}\n >\n {row.isExpanded ? ExpandedIcon : CollapsedIcon}\n </HvButton>\n )}\n\n <HvOverflowTooltip data={hvStringFallback(value)} />\n </>\n )}\n </ClassNames>\n );\n },\n sortType: \"alphanumeric\",\n cellStyle: {\n position: \"relative\",\n },\n ...col,\n };\n}\n\nexport function hvTagColumn<\n D extends object = Record<string, unknown>,\n H extends HvTableHeaderRenderer | undefined = HvTableHeaderRenderer,\n A extends object = Record<string, unknown>\n>(\n col: HvTableColumnConfig<D, H>,\n valueDataKey: keyof A,\n colorDataKey: keyof A,\n textColorDataKey: keyof A,\n fromRowData: boolean = false,\n tagProps?: HvTagProps\n): HvTableColumnConfig<D, H> {\n return {\n Cell: (cellProps: HvCellProps<D, H>) => {\n const { value, row } = cellProps;\n if (!value) {\n return <>—</>;\n }\n\n const {\n [valueDataKey]: name,\n [colorDataKey]: color,\n [textColorDataKey]: textColor,\n } = fromRowData ? row.original : value;\n\n return (\n <HvTag\n label={<HvTypography variant=\"body\">{name}</HvTypography>}\n type=\"semantic\"\n color={color}\n style={textColor != null ? { color: textColor } : {}}\n tabIndex={-1}\n {...tagProps}\n />\n );\n },\n cellStyle: {\n paddingTop: 0,\n paddingBottom: 0,\n },\n ...col,\n };\n}\n\n// TODO - Review accessibility on the next renderers because they all differ\n\nexport function hvSwitchColumn<\n D extends object = Record<string, unknown>,\n H extends HvTableHeaderRenderer | undefined = HvTableHeaderRenderer\n>(\n col: HvTableColumnConfig<D, H>,\n switchLabel: string,\n falseLabel?: string,\n trueLabel?: string,\n switchProps?: HvBaseSwitchProps\n): HvTableColumnConfig<D, H> {\n return {\n Cell: (cellProps: HvCellProps<D, H>) => {\n const { value, row } = cellProps;\n return (\n <HvSwitchColumnCell\n checked={value}\n value={row.id}\n switchLabel={switchLabel}\n falseLabel={falseLabel}\n trueLabel={trueLabel}\n switchProps={switchProps}\n />\n );\n },\n cellStyle: {\n paddingTop: 0,\n paddingBottom: 0,\n },\n ...col,\n };\n}\n\nexport function hvDropdownColumn<\n D extends object = Record<string, unknown>,\n H extends HvTableHeaderRenderer | undefined = HvTableHeaderRenderer\n>(\n col: HvTableColumnConfig<D, H>,\n id: string | undefined,\n placeholder: string,\n disabledPlaceholder: string,\n onChange?: (identifier: string, value: HvListValue) => void\n): HvTableColumnConfig<D, H> {\n return {\n Cell: (cellProps: HvCellProps<D, H>) => {\n const { value, row, column } = cellProps;\n const disabled =\n !Array.isArray(value) || (Array.isArray(value) && value.length < 1);\n return (\n <HvDropdownColumnCell\n values={value}\n placeholder={disabled ? disabledPlaceholder : placeholder}\n onChange={(val) => onChange?.(row.id, val)}\n disabled={disabled}\n dropdownProps={{\n \"aria-labelledby\": setId(id, column.id) || column.id || id, // TODO - to be reviewed because it doesn't make much sense\n }}\n />\n );\n },\n cellStyle: {\n paddingTop: 0,\n paddingBottom: 0,\n },\n ...col,\n };\n}\n\nexport function hvProgressColumn<\n D extends object = Record<string, unknown>,\n H extends HvTableHeaderRenderer | undefined = HvTableHeaderRenderer\n>(\n col: HvTableColumnConfig<D, H>,\n getPartial?: (row: HvRowInstance<D, H>) => number,\n getTotal?: (row: HvRowInstance<D, H>) => number,\n color?: \"primary\" | \"secondary\"\n): HvTableColumnConfig<D, H> {\n return {\n Cell: (cellProps: HvCellProps<D, H>) => {\n const { row, column } = cellProps;\n const partial = getPartial?.(row) || 0;\n const total = getTotal?.(row);\n\n if (total) {\n return (\n <HvProgressColumnCell\n partial={partial}\n total={total}\n color={color}\n aria-labelledby={column.id}\n />\n );\n }\n\n return <>—</>;\n },\n\n cellStyle: {\n paddingTop: 0,\n paddingBottom: 0,\n },\n ...col,\n };\n}\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"renderers.js","sources":["../../../../src/Table/renderers/renderers.tsx"],"sourcesContent":["import { ClassNames } from \"@emotion/react\";\n\nimport { DropDownXS, DropUpXS } from \"@hitachivantara/uikit-react-icons\";\n\nimport { setId } from \"../../utils/setId\";\nimport { HvTag, HvTagProps } from \"../../Tag\";\nimport { HvButton } from \"../../Button\";\nimport { HvTypography } from \"../../Typography\";\nimport {\n HvOverflowTooltip,\n HvOverflowTooltipProps,\n} from \"../../OverflowTooltip\";\nimport { HvBaseSwitchProps } from \"../../BaseSwitch\";\nimport { HvListValue } from \"../../List\";\n\nimport {\n HvTableHeaderRenderer,\n HvCellProps,\n HvTableColumnConfig,\n HvRowInstance,\n} from \"../hooks/useTable\";\nimport { HvDateColumnCell } from \"./DateColumnCell\";\nimport { HvSwitchColumnCell } from \"./SwitchColumnCell\";\nimport { HvProgressColumnCell } from \"./ProgressColumnCell\";\nimport { HvDropdownColumnCell } from \"./DropdownColumnCell\";\nimport { hvStringFallback, hvNumberFallback } from \"../utils\";\nimport { HvDropdownProps } from \"../../Dropdown\";\n\nexport function hvTextColumn<\n D extends object = Record<string, unknown>,\n H extends HvTableHeaderRenderer | undefined = HvTableHeaderRenderer\n>(\n col: HvTableColumnConfig<D, H>,\n overflowTooltipProps: Omit<HvOverflowTooltipProps, \"data\"> = {}\n): HvTableColumnConfig<D, H> {\n return {\n Cell: ({ value }: HvCellProps<D, H>) => (\n <HvOverflowTooltip\n data={hvStringFallback(value)}\n {...overflowTooltipProps}\n />\n ),\n sortType: \"alphanumeric\",\n ...col,\n };\n}\n\nexport function hvNumberColumn<\n D extends object = Record<string, unknown>,\n H extends HvTableHeaderRenderer | undefined = HvTableHeaderRenderer\n>(col: HvTableColumnConfig<D, H>): HvTableColumnConfig<D, H> {\n return {\n Cell: ({ value }: HvCellProps<D, H>) => <>{hvNumberFallback(value)}</>,\n align: \"right\",\n sortType: \"number\",\n ...col,\n };\n}\n\nexport function hvDateColumn<\n D extends object = Record<string, unknown>,\n H extends HvTableHeaderRenderer | undefined = HvTableHeaderRenderer\n>(\n col: HvTableColumnConfig<D, H>,\n dateFormat?: string\n): HvTableColumnConfig<D, H> {\n return {\n Cell: ({ value }: HvCellProps<D, H>) => (\n <HvDateColumnCell date={value} dateFormat={dateFormat} />\n ),\n sortType: \"alphanumeric\",\n sortDescFirst: true,\n ...col,\n };\n}\n\nexport function hvExpandColumn<\n D extends object = Record<string, unknown>,\n H extends HvTableHeaderRenderer | undefined = HvTableHeaderRenderer\n>(\n col: HvTableColumnConfig<D, H>,\n expandRowButtonAriaLabel: string,\n collapseRowButtonAriaLabel: string,\n getCanRowExpand?: (row: HvRowInstance<D, H>) => boolean,\n ExpandedIcon: React.ReactNode = <DropUpXS />,\n CollapsedIcon: React.ReactNode = <DropDownXS />\n): HvTableColumnConfig<D, H> {\n return {\n Cell: (cellProps: HvCellProps<D, H>) => {\n const { value, row } = cellProps;\n const expandedProps = row.getToggleRowExpandedProps?.();\n\n const hasContent = getCanRowExpand?.(row) ?? true;\n\n return (\n <ClassNames>\n {({ css }) => (\n <>\n {hasContent && (\n <HvButton\n icon\n aria-label={\n row.isExpanded\n ? collapseRowButtonAriaLabel\n : expandRowButtonAriaLabel\n }\n aria-expanded={row.isExpanded}\n onClick={expandedProps?.onClick}\n classes={{\n root: css({\n position: \"absolute\",\n left: 0,\n top: \"50%\",\n transform: \"translateY(-50%)\",\n }),\n }}\n >\n {row.isExpanded ? ExpandedIcon : CollapsedIcon}\n </HvButton>\n )}\n\n <HvOverflowTooltip data={hvStringFallback(value)} />\n </>\n )}\n </ClassNames>\n );\n },\n sortType: \"alphanumeric\",\n cellStyle: {\n position: \"relative\",\n },\n ...col,\n };\n}\n\nexport function hvTagColumn<\n D extends object = Record<string, unknown>,\n H extends HvTableHeaderRenderer | undefined = HvTableHeaderRenderer,\n A extends object = Record<string, unknown>\n>(\n col: HvTableColumnConfig<D, H>,\n valueDataKey: keyof A,\n colorDataKey: keyof A,\n textColorDataKey: keyof A,\n fromRowData: boolean = false,\n tagProps?: HvTagProps\n): HvTableColumnConfig<D, H> {\n return {\n Cell: (cellProps: HvCellProps<D, H>) => {\n const { value, row } = cellProps;\n if (!value) {\n return <>—</>;\n }\n\n const {\n [valueDataKey]: name,\n [colorDataKey]: color,\n [textColorDataKey]: textColor,\n } = fromRowData ? row.original : value;\n\n return (\n <HvTag\n label={<HvTypography variant=\"body\">{name}</HvTypography>}\n type=\"semantic\"\n color={color}\n style={textColor != null ? { color: textColor } : {}}\n tabIndex={-1}\n {...tagProps}\n />\n );\n },\n cellStyle: {\n paddingTop: 0,\n paddingBottom: 0,\n },\n ...col,\n };\n}\n\n// TODO - Review accessibility on the next renderers because they all differ\n\nexport function hvSwitchColumn<\n D extends object = Record<string, unknown>,\n H extends HvTableHeaderRenderer | undefined = HvTableHeaderRenderer\n>(\n col: HvTableColumnConfig<D, H>,\n switchLabel: string,\n falseLabel?: string,\n trueLabel?: string,\n switchProps?: HvBaseSwitchProps\n): HvTableColumnConfig<D, H> {\n return {\n Cell: (cellProps: HvCellProps<D, H>) => {\n const { value, row } = cellProps;\n return (\n <HvSwitchColumnCell\n checked={value}\n value={row.id}\n switchLabel={switchLabel}\n falseLabel={falseLabel}\n trueLabel={trueLabel}\n switchProps={switchProps}\n />\n );\n },\n cellStyle: {\n paddingTop: 0,\n paddingBottom: 0,\n },\n ...col,\n };\n}\n\nexport function hvDropdownColumn<\n D extends object = Record<string, unknown>,\n H extends HvTableHeaderRenderer | undefined = HvTableHeaderRenderer\n>(\n col: HvTableColumnConfig<D, H>,\n id: string | undefined,\n placeholder: string,\n disabledPlaceholder: string,\n onChange?: (identifier: string, value: HvListValue) => void,\n dropdownProps?: HvDropdownProps\n): HvTableColumnConfig<D, H> {\n return {\n Cell: (cellProps: HvCellProps<D, H>) => {\n const { value, row, column } = cellProps;\n const disabled =\n !Array.isArray(value) || (Array.isArray(value) && value.length < 1);\n return (\n <HvDropdownColumnCell\n values={value}\n placeholder={disabled ? disabledPlaceholder : placeholder}\n onChange={(val) => onChange?.(row.id, val)}\n disabled={disabled}\n dropdownProps={{\n \"aria-labelledby\": setId(id, column.id) || column.id || id, // TODO - to be reviewed because it doesn't make much sense\n ...dropdownProps,\n }}\n />\n );\n },\n cellStyle: {\n paddingTop: 0,\n paddingBottom: 0,\n },\n ...col,\n };\n}\n\nexport function hvProgressColumn<\n D extends object = Record<string, unknown>,\n H extends HvTableHeaderRenderer | undefined = HvTableHeaderRenderer\n>(\n col: HvTableColumnConfig<D, H>,\n getPartial?: (row: HvRowInstance<D, H>) => number,\n getTotal?: (row: HvRowInstance<D, H>) => number,\n color?: \"primary\" | \"secondary\"\n): HvTableColumnConfig<D, H> {\n return {\n Cell: (cellProps: HvCellProps<D, H>) => {\n const { row, column } = cellProps;\n const partial = getPartial?.(row) || 0;\n const total = getTotal?.(row);\n\n if (total) {\n return (\n <HvProgressColumnCell\n partial={partial}\n total={total}\n color={color}\n aria-labelledby={column.id}\n />\n );\n }\n\n return <>—</>;\n },\n\n cellStyle: {\n paddingTop: 0,\n paddingBottom: 0,\n },\n ...col,\n };\n}\n"],"names":[],"mappings":"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"}
|
package/dist/esm/index.js
CHANGED
|
@@ -32,8 +32,6 @@ import { createTheme, getVarValue, processThemes, setElementAttrs } from "./util
|
|
|
32
32
|
import { useSavedState } from "./utils/useSavedState.js";
|
|
33
33
|
import { wrapperTooltip } from "./utils/wrapperTooltip.js";
|
|
34
34
|
import { default as default2, default as default3 } from "./Table/hooks/useTable.js";
|
|
35
|
-
import "./Table/hooks/useGlobalFilter.js";
|
|
36
|
-
import "./Table/hooks/useFilters.js";
|
|
37
35
|
import { typographyVariants } from "./Typography/utils.js";
|
|
38
36
|
import { staticClasses } from "./Typography/Typography.styles.js";
|
|
39
37
|
import { HvTypography } from "./Typography/Typography.js";
|
|
@@ -256,7 +254,8 @@ import { defaultgetHvBulkActionsProps, default as default9 } from "./Table/hooks
|
|
|
256
254
|
import { CellWithExpandButton, default as default10 } from "./Table/hooks/useRowExpand.js";
|
|
257
255
|
import { default as default11 } from "./Table/hooks/useHeaderGroups.js";
|
|
258
256
|
import { default as default12 } from "./Table/hooks/useResizeColumns.js";
|
|
259
|
-
import {
|
|
257
|
+
import { default as default13 } from "./Table/hooks/useGlobalFilter.js";
|
|
258
|
+
import { default as default14 } from "./Table/hooks/useFilters.js";
|
|
260
259
|
import { hvDateColumn, hvDropdownColumn, hvExpandColumn, hvNumberColumn, hvProgressColumn, hvSwitchColumn, hvTagColumn, hvTextColumn } from "./Table/renderers/renderers.js";
|
|
261
260
|
import { HvDateColumnCell } from "./Table/renderers/DateColumnCell/DateColumnCell.js";
|
|
262
261
|
import { HvDropdownColumnCell } from "./Table/renderers/DropdownColumnCell/DropdownColumnCell.js";
|
|
@@ -633,8 +632,8 @@ export {
|
|
|
633
632
|
useForkRef,
|
|
634
633
|
default9 as useHvBulkActions,
|
|
635
634
|
default2 as useHvData,
|
|
636
|
-
|
|
637
|
-
|
|
635
|
+
default14 as useHvFilters,
|
|
636
|
+
default13 as useHvGlobalFilter,
|
|
638
637
|
default11 as useHvHeaderGroups,
|
|
639
638
|
default7 as useHvPagination,
|
|
640
639
|
default12 as useHvResizeColumns,
|
package/dist/esm/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
package/dist/esm/utils/theme.js
CHANGED
|
@@ -1,26 +1,12 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { themes } from "@hitachivantara/uikit-styles";
|
|
2
2
|
import { getElementById } from "./document.js";
|
|
3
|
-
const setElementStyle = (element, style) => {
|
|
4
|
-
Object.entries(style).forEach(([property, value]) => {
|
|
5
|
-
element.style[property] = value;
|
|
6
|
-
});
|
|
7
|
-
};
|
|
8
3
|
const setElementAttrs = (themeName, modeName, colorScheme, themeRootId) => {
|
|
9
4
|
const element = themeRootId ? document.getElementById(themeRootId) : document.body;
|
|
10
5
|
if (element) {
|
|
11
6
|
element.setAttribute(`data-theme`, themeName);
|
|
12
7
|
element.setAttribute(`data-color-mode`, modeName);
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
backgroundColor: theme.colors.backgroundColor,
|
|
16
|
-
accentColor: theme.colors.secondary,
|
|
17
|
-
color: theme.colors.secondary,
|
|
18
|
-
fontSize: theme.typography.body.fontSize,
|
|
19
|
-
fontWeight: theme.typography.body.fontWeight,
|
|
20
|
-
lineHeight: theme.typography.body.lineHeight,
|
|
21
|
-
letterSpacing: theme.typography.body.letterSpacing,
|
|
22
|
-
fontFamily: theme.fontFamily.body
|
|
23
|
-
});
|
|
8
|
+
element.classList.add(`uikit-root-element`);
|
|
9
|
+
element.style.colorScheme = colorScheme;
|
|
24
10
|
}
|
|
25
11
|
};
|
|
26
12
|
const applyThemeCustomizations = (obj, customizations) => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"theme.js","sources":["../../../src/utils/theme.ts"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"file":"theme.js","sources":["../../../src/utils/theme.ts"],"sourcesContent":["import {\n themes,\n HvThemeColorModeStructure,\n HvThemeStructure,\n} from \"@hitachivantara/uikit-styles\";\n\nimport { HvTheme, HvCreateThemeProps } from \"../types/theme\";\n\nimport { getElementById } from \"./document\";\n\n/**\n * Sets the element attributes and style for a theme and color mode.\n */\nexport const setElementAttrs = (\n themeName: string,\n modeName: string,\n colorScheme: string,\n themeRootId?: string\n) => {\n const element = themeRootId\n ? document.getElementById(themeRootId)\n : document.body;\n\n if (element) {\n element.setAttribute(`data-theme`, themeName);\n element.setAttribute(`data-color-mode`, modeName);\n\n // set default styles for child components to inherit\n element.classList.add(`uikit-root-element`);\n element.style.colorScheme = colorScheme;\n }\n};\n\n/**\n * Applies customizations to a theme.\n */\nconst applyThemeCustomizations = (obj: any, customizations: any) => {\n const isObject = (val: any) =>\n val && typeof val === \"object\" && !Array.isArray(val);\n\n // Customized theme\n const customizedTheme = { ...obj };\n\n // Add new values to the theme or replace values\n Object.keys(customizations).forEach((key) => {\n if (customizedTheme[key]) {\n if (isObject(customizedTheme[key]) && isObject(customizations[key])) {\n customizedTheme[key] = applyThemeCustomizations(\n customizedTheme[key],\n customizations[key]\n );\n } else if (typeof customizedTheme[key] === typeof customizations[key]) {\n customizedTheme[key] = customizations[key];\n }\n } else {\n customizedTheme[key] = customizations[key];\n }\n });\n\n return customizedTheme;\n};\n\n/**\n * Creates a customized theme based on the base theme and customizations given.\n * For the color modes, the colors that are not defined will be replaced by the values from the dawn mode of the base theme.\n */\nexport const createTheme = (\n props: HvCreateThemeProps\n): HvTheme | HvThemeStructure => {\n const {\n name,\n base = \"ds5\",\n inheritColorModes = true,\n ...customizations\n } = props;\n\n // Apply customizations to the base theme\n const customizedTheme: HvTheme | HvThemeStructure = customizations\n ? (applyThemeCustomizations(themes[base], customizations) as HvTheme)\n : { ...themes[base] };\n\n // Set theme name\n customizedTheme.name = name.trim();\n // Set theme base\n customizedTheme.base = base;\n\n // Fill new color modes with missing colors\n if (customizations) {\n Object.keys(customizedTheme.colors.modes).forEach((mode) => {\n if (!themes[base].colors.modes[mode]) {\n customizedTheme.colors.modes[mode] = {\n ...themes[base].colors.modes.dawn,\n ...(customizedTheme.colors.modes[mode] as Partial<\n HvThemeColorModeStructure & { [key: string]: string }\n >),\n };\n }\n });\n }\n\n // If the flag `inheritColorModes` is false and customizations were given for the color modes,\n // we're removing any color modes that might have been inherited\n if (!inheritColorModes && customizations.colors?.modes) {\n Object.keys(customizedTheme.colors.modes).forEach((mode) => {\n if (!Object.keys(customizations.colors?.modes || {}).includes(mode)) {\n delete customizedTheme.colors.modes[mode];\n }\n });\n }\n\n // Created theme\n return customizedTheme;\n};\n\n/**\n * Process the themes provided to the HvProvider:\n * - Cleans themes with the same name\n * - Returns the default if the list is empty (ds5)\n */\nexport const processThemes = (\n themesList?: (HvTheme | HvThemeStructure)[]\n): (HvTheme | HvThemeStructure)[] => {\n if (themesList && Array.isArray(themesList) && themesList.length > 0) {\n const list: (HvTheme | HvThemeStructure)[] = [];\n\n themesList.forEach((thm) => {\n const i: number = list.findIndex(\n (t) => t.name.trim() === thm.name.trim()\n );\n\n if (i !== -1) {\n list.splice(i, 1);\n list.push(thm);\n } else {\n list.push(thm);\n }\n });\n\n // Cleaned themes\n return list;\n }\n // DS5\n return [themes.ds5];\n};\n\nexport const getVarValue = (cssVar: string, rootElementId?: string) => {\n const root = getElementById(rootElementId || \"hv-root\");\n if (!root) return undefined;\n\n return getComputedStyle(root)\n .getPropertyValue(cssVar.replace(\"var(\", \"\").replace(\")\", \"\"))\n .trim();\n};\n"],"names":[],"mappings":"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"}
|
package/dist/types/index.d.ts
CHANGED
|
@@ -2927,7 +2927,7 @@ export declare const HvDropdown: ForwardRefExoticComponent<HvDropdownProps & Ref
|
|
|
2927
2927
|
|
|
2928
2928
|
export declare type HvDropdownClasses = ExtractNames<typeof useClasses_54>;
|
|
2929
2929
|
|
|
2930
|
-
export declare function hvDropdownColumn<D extends object = Record<string, unknown>, H extends HvTableHeaderRenderer | undefined = HvTableHeaderRenderer>(col: HvTableColumnConfig<D, H>, id: string | undefined, placeholder: string, disabledPlaceholder: string, onChange?: (identifier: string, value: HvListValue) => void): HvTableColumnConfig<D, H>;
|
|
2930
|
+
export declare function hvDropdownColumn<D extends object = Record<string, unknown>, H extends HvTableHeaderRenderer | undefined = HvTableHeaderRenderer>(col: HvTableColumnConfig<D, H>, id: string | undefined, placeholder: string, disabledPlaceholder: string, onChange?: (identifier: string, value: HvListValue) => void, dropdownProps?: HvDropdownProps): HvTableColumnConfig<D, H>;
|
|
2931
2931
|
|
|
2932
2932
|
export declare const HvDropdownColumnCell: ({ values, disabled, onChange, placeholder, dropdownProps, }: HvDropdownColumnCellProp) => JSX.Element;
|
|
2933
2933
|
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@hitachivantara/uikit-react-core",
|
|
3
|
-
"version": "5.
|
|
3
|
+
"version": "5.46.0",
|
|
4
4
|
"private": false,
|
|
5
5
|
"author": "Hitachi Vantara UI Kit Team",
|
|
6
6
|
"description": "Core React components for the NEXT Design System.",
|
|
@@ -33,9 +33,9 @@
|
|
|
33
33
|
"@emotion/css": "^11.11.2",
|
|
34
34
|
"@emotion/serialize": "^1.1.2",
|
|
35
35
|
"@emotion/utils": "^1.2.1",
|
|
36
|
-
"@hitachivantara/uikit-react-icons": "^5.8.
|
|
37
|
-
"@hitachivantara/uikit-react-shared": "^5.1.
|
|
38
|
-
"@hitachivantara/uikit-styles": "^5.
|
|
36
|
+
"@hitachivantara/uikit-react-icons": "^5.8.2",
|
|
37
|
+
"@hitachivantara/uikit-react-shared": "^5.1.27",
|
|
38
|
+
"@hitachivantara/uikit-styles": "^5.18.0",
|
|
39
39
|
"@internationalized/date": "^3.2.0",
|
|
40
40
|
"@mui/base": "^5.0.0-beta.4",
|
|
41
41
|
"@popperjs/core": "^2.11.8",
|
|
@@ -63,7 +63,7 @@
|
|
|
63
63
|
"access": "public",
|
|
64
64
|
"directory": "package"
|
|
65
65
|
},
|
|
66
|
-
"gitHead": "
|
|
66
|
+
"gitHead": "a2562049d702de7c20373efd6785fb8f84e9a20a",
|
|
67
67
|
"main": "dist/cjs/index.cjs",
|
|
68
68
|
"exports": {
|
|
69
69
|
".": {
|