@vuu-ui/vuu-datatable 0.12.2 → 0.13.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.
- package/cjs/json-table/JsonTable.js +1 -1
- package/cjs/json-table/JsonTable.js.map +1 -1
- package/cjs/tree-table/TreeTable.js +1 -1
- package/cjs/tree-table/TreeTable.js.map +1 -1
- package/esm/json-table/JsonTable.js +1 -1
- package/esm/json-table/JsonTable.js.map +1 -1
- package/esm/tree-table/TreeTable.js +1 -1
- package/esm/tree-table/TreeTable.js.map +1 -1
- package/package.json +13 -13
|
@@ -14,7 +14,7 @@ const JsonTable = ({
|
|
|
14
14
|
...tableProps
|
|
15
15
|
}) => {
|
|
16
16
|
const sourceRef = react.useRef(sourceProp);
|
|
17
|
-
const dataSourceRef = react.useRef();
|
|
17
|
+
const dataSourceRef = react.useRef(void 0);
|
|
18
18
|
react.useMemo(() => {
|
|
19
19
|
dataSourceRef.current = new vuuDataLocal.JsonDataSource({
|
|
20
20
|
data: sourceRef.current
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"JsonTable.js","sources":["../../src/json-table/JsonTable.tsx"],"sourcesContent":["import { TableProps } from \"@vuu-ui/vuu-table\";\nimport { JsonData, registerComponent } from \"@vuu-ui/vuu-utils\";\nimport { Table } from \"@vuu-ui/vuu-table\";\nimport { JsonDataSource } from \"@vuu-ui/vuu-data-local\";\nimport { useEffect, useMemo, useRef } from \"react\";\nimport { TableConfig } from \"@vuu-ui/vuu-table-types\";\nimport { JsonCell } from \"./JsonCell\";\n\nregisterComponent(\"json\", JsonCell, \"cell-renderer\");\n\nexport interface JsonTableProps\n extends Omit<TableProps, \"config\" | \"dataSource\"> {\n config?: Pick<\n TableConfig,\n \"columnSeparators\" | \"rowSeparators\" | \"zebraStripes\"\n >;\n source: JsonData;\n}\n\nexport const JsonTable = ({\n config,\n source: sourceProp,\n ...tableProps\n}: JsonTableProps) => {\n const sourceRef = useRef(sourceProp);\n const dataSourceRef = useRef<JsonDataSource>();\n useMemo(() => {\n dataSourceRef.current = new JsonDataSource({\n data: sourceRef.current,\n });\n }, []);\n\n const tableConfig = useMemo<TableConfig>(() => {\n return {\n ...config,\n columns: dataSourceRef.current?.columnDescriptors ?? [],\n columnSeparators: true,\n rowSeparators: true,\n };\n }, [config]);\n\n useEffect(() => {\n if (dataSourceRef.current) {\n dataSourceRef.current.data = sourceProp;\n }\n }, [sourceProp]);\n\n if (dataSourceRef.current === undefined) {\n return null;\n }\n\n return (\n <Table\n {...tableProps}\n config={tableConfig}\n dataSource={dataSourceRef.current}\n showColumnHeaderMenus={false}\n selectionModel=\"none\"\n />\n );\n};\n"],"names":["registerComponent","JsonCell","useRef","useMemo","JsonDataSource","useEffect","jsx","Table"],"mappings":";;;;;;;;;AAQAA,0BAAkB,CAAA,MAAA,EAAQC,mBAAU,eAAe,CAAA;AAW5C,MAAM,YAAY,CAAC;AAAA,EACxB,MAAA;AAAA,EACA,MAAQ,EAAA,UAAA;AAAA,EACR,GAAG;AACL,CAAsB,KAAA;AACpB,EAAM,MAAA,SAAA,GAAYC,aAAO,UAAU,CAAA;AACnC,
|
|
1
|
+
{"version":3,"file":"JsonTable.js","sources":["../../src/json-table/JsonTable.tsx"],"sourcesContent":["import { TableProps } from \"@vuu-ui/vuu-table\";\nimport { JsonData, registerComponent } from \"@vuu-ui/vuu-utils\";\nimport { Table } from \"@vuu-ui/vuu-table\";\nimport { JsonDataSource } from \"@vuu-ui/vuu-data-local\";\nimport { useEffect, useMemo, useRef } from \"react\";\nimport { TableConfig } from \"@vuu-ui/vuu-table-types\";\nimport { JsonCell } from \"./JsonCell\";\n\nregisterComponent(\"json\", JsonCell, \"cell-renderer\");\n\nexport interface JsonTableProps\n extends Omit<TableProps, \"config\" | \"dataSource\"> {\n config?: Pick<\n TableConfig,\n \"columnSeparators\" | \"rowSeparators\" | \"zebraStripes\"\n >;\n source: JsonData;\n}\n\nexport const JsonTable = ({\n config,\n source: sourceProp,\n ...tableProps\n}: JsonTableProps) => {\n const sourceRef = useRef(sourceProp);\n const dataSourceRef = useRef<JsonDataSource>(undefined);\n useMemo(() => {\n dataSourceRef.current = new JsonDataSource({\n data: sourceRef.current,\n });\n }, []);\n\n const tableConfig = useMemo<TableConfig>(() => {\n return {\n ...config,\n columns: dataSourceRef.current?.columnDescriptors ?? [],\n columnSeparators: true,\n rowSeparators: true,\n };\n }, [config]);\n\n useEffect(() => {\n if (dataSourceRef.current) {\n dataSourceRef.current.data = sourceProp;\n }\n }, [sourceProp]);\n\n if (dataSourceRef.current === undefined) {\n return null;\n }\n\n return (\n <Table\n {...tableProps}\n config={tableConfig}\n dataSource={dataSourceRef.current}\n showColumnHeaderMenus={false}\n selectionModel=\"none\"\n />\n );\n};\n"],"names":["registerComponent","JsonCell","useRef","useMemo","JsonDataSource","useEffect","jsx","Table"],"mappings":";;;;;;;;;AAQAA,0BAAkB,CAAA,MAAA,EAAQC,mBAAU,eAAe,CAAA;AAW5C,MAAM,YAAY,CAAC;AAAA,EACxB,MAAA;AAAA,EACA,MAAQ,EAAA,UAAA;AAAA,EACR,GAAG;AACL,CAAsB,KAAA;AACpB,EAAM,MAAA,SAAA,GAAYC,aAAO,UAAU,CAAA;AACnC,EAAM,MAAA,aAAA,GAAgBA,aAAuB,KAAS,CAAA,CAAA;AACtD,EAAAC,aAAA,CAAQ,MAAM;AACZ,IAAc,aAAA,CAAA,OAAA,GAAU,IAAIC,2BAAe,CAAA;AAAA,MACzC,MAAM,SAAU,CAAA;AAAA,KACjB,CAAA;AAAA,GACH,EAAG,EAAE,CAAA;AAEL,EAAM,MAAA,WAAA,GAAcD,cAAqB,MAAM;AAC7C,IAAO,OAAA;AAAA,MACL,GAAG,MAAA;AAAA,MACH,OAAS,EAAA,aAAA,CAAc,OAAS,EAAA,iBAAA,IAAqB,EAAC;AAAA,MACtD,gBAAkB,EAAA,IAAA;AAAA,MAClB,aAAe,EAAA;AAAA,KACjB;AAAA,GACF,EAAG,CAAC,MAAM,CAAC,CAAA;AAEX,EAAAE,eAAA,CAAU,MAAM;AACd,IAAA,IAAI,cAAc,OAAS,EAAA;AACzB,MAAA,aAAA,CAAc,QAAQ,IAAO,GAAA,UAAA;AAAA;AAC/B,GACF,EAAG,CAAC,UAAU,CAAC,CAAA;AAEf,EAAI,IAAA,aAAA,CAAc,YAAY,KAAW,CAAA,EAAA;AACvC,IAAO,OAAA,IAAA;AAAA;AAGT,EACE,uBAAAC,cAAA;AAAA,IAACC,cAAA;AAAA,IAAA;AAAA,MACE,GAAG,UAAA;AAAA,MACJ,MAAQ,EAAA,WAAA;AAAA,MACR,YAAY,aAAc,CAAA,OAAA;AAAA,MAC1B,qBAAuB,EAAA,KAAA;AAAA,MACvB,cAAe,EAAA;AAAA;AAAA,GACjB;AAEJ;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TreeTable.js","sources":["../../src/tree-table/TreeTable.tsx"],"sourcesContent":["import { TableProps } from \"@vuu-ui/vuu-table\";\nimport { Table } from \"@vuu-ui/vuu-table\";\nimport { TreeDataSource } from \"@vuu-ui/vuu-data-local\";\nimport { useMemo, useRef } from \"react\";\nimport { TableConfig } from \"@vuu-ui/vuu-table-types\";\nimport {\n isRowSelected,\n metadataKeys,\n type RowToObjectMapper,\n type TreeSourceNode,\n} from \"@vuu-ui/vuu-utils\";\n\nconst { DEPTH, IS_LEAF, KEY, IDX } = metadataKeys;\n\ninterface Props extends Omit<TableProps, \"config\" | \"dataSource\"> {\n config?: Pick<\n TableConfig,\n \"columnSeparators\" | \"rowSeparators\" | \"zebraStripes\"\n >;\n dataSource?: TreeDataSource;\n source?: TreeSourceNode[];\n}\n\nexport type TreeTableProps = Props &\n ({ dataSource: TreeDataSource } | { source: TreeSourceNode[] });\n\nconst rowToTreeNodeObject: RowToObjectMapper = (row, columnMap) => {\n const { [IS_LEAF]: isLeaf, [KEY]: key, [IDX]: index, [DEPTH]: depth } = row;\n const firstColIdx = columnMap.nodeData;\n const labelColIdx = firstColIdx + depth;\n\n return {\n key,\n index,\n isGroupRow: !isLeaf,\n isSelected: isRowSelected(row),\n data: {\n label: row[labelColIdx],\n nodeData: row[firstColIdx],\n },\n };\n};\n\nexport const TreeTable = ({\n config,\n dataSource,\n source,\n ...tableProps\n}: TreeTableProps) => {\n const dataSourceRef = useRef<TreeDataSource>();\n useMemo(() => {\n if (dataSource) {\n dataSourceRef.current = dataSource;\n } else if (source) {\n dataSourceRef.current = new TreeDataSource({\n data: source,\n });\n } else {\n throw Error(`TreeTable either source or dataSource must be provided`);\n }\n }, [dataSource, source]);\n\n const tableConfig = useMemo<TableConfig>(() => {\n return {\n ...config,\n columns: dataSourceRef.current?.columnDescriptors ?? [],\n columnSeparators: false,\n rowSeparators: false,\n };\n }, [config]);\n\n console.log({ tableConfig, dataSource: dataSourceRef.current });\n\n if (dataSourceRef.current === undefined) {\n return null;\n }\n\n return (\n <Table\n {...tableProps}\n className=\"vuuTreeTable\"\n config={tableConfig}\n dataSource={dataSourceRef.current}\n groupToggleTarget=\"toggle-icon\"\n navigationStyle=\"tree\"\n rowToObject={rowToTreeNodeObject}\n showColumnHeaderMenus={false}\n selectionModel=\"single\"\n selectionBookendWidth={0}\n />\n );\n};\n"],"names":["metadataKeys","isRowSelected","useRef","useMemo","TreeDataSource","jsx","Table"],"mappings":";;;;;;;;AAYA,MAAM,EAAE,KAAA,EAAO,OAAS,EAAA,GAAA,EAAK,KAAQ,GAAAA,qBAAA;AAcrC,MAAM,mBAAA,GAAyC,CAAC,GAAA,EAAK,SAAc,KAAA;AACjE,EAAA,MAAM,EAAE,CAAC,OAAO,GAAG,MAAA,EAAQ,CAAC,GAAG,GAAG,GAAK,EAAA,CAAC,GAAG,GAAG,KAAA,EAAO,CAAC,KAAK,GAAG,OAAU,GAAA,GAAA;AACxE,EAAA,MAAM,cAAc,SAAU,CAAA,QAAA;AAC9B,EAAA,MAAM,cAAc,WAAc,GAAA,KAAA;AAElC,EAAO,OAAA;AAAA,IACL,GAAA;AAAA,IACA,KAAA;AAAA,IACA,YAAY,CAAC,MAAA;AAAA,IACb,UAAA,EAAYC,uBAAc,GAAG,CAAA;AAAA,IAC7B,IAAM,EAAA;AAAA,MACJ,KAAA,EAAO,IAAI,WAAW,CAAA;AAAA,MACtB,QAAA,EAAU,IAAI,WAAW;AAAA;AAC3B,GACF;AACF,CAAA;AAEO,MAAM,YAAY,CAAC;AAAA,EACxB,MAAA;AAAA,EACA,UAAA;AAAA,EACA,MAAA;AAAA,EACA,GAAG;AACL,CAAsB,KAAA;AACpB,
|
|
1
|
+
{"version":3,"file":"TreeTable.js","sources":["../../src/tree-table/TreeTable.tsx"],"sourcesContent":["import { TableProps } from \"@vuu-ui/vuu-table\";\nimport { Table } from \"@vuu-ui/vuu-table\";\nimport { TreeDataSource } from \"@vuu-ui/vuu-data-local\";\nimport { useMemo, useRef } from \"react\";\nimport { TableConfig } from \"@vuu-ui/vuu-table-types\";\nimport {\n isRowSelected,\n metadataKeys,\n type RowToObjectMapper,\n type TreeSourceNode,\n} from \"@vuu-ui/vuu-utils\";\n\nconst { DEPTH, IS_LEAF, KEY, IDX } = metadataKeys;\n\ninterface Props extends Omit<TableProps, \"config\" | \"dataSource\"> {\n config?: Pick<\n TableConfig,\n \"columnSeparators\" | \"rowSeparators\" | \"zebraStripes\"\n >;\n dataSource?: TreeDataSource;\n source?: TreeSourceNode[];\n}\n\nexport type TreeTableProps = Props &\n ({ dataSource: TreeDataSource } | { source: TreeSourceNode[] });\n\nconst rowToTreeNodeObject: RowToObjectMapper = (row, columnMap) => {\n const { [IS_LEAF]: isLeaf, [KEY]: key, [IDX]: index, [DEPTH]: depth } = row;\n const firstColIdx = columnMap.nodeData;\n const labelColIdx = firstColIdx + depth;\n\n return {\n key,\n index,\n isGroupRow: !isLeaf,\n isSelected: isRowSelected(row),\n data: {\n label: row[labelColIdx],\n nodeData: row[firstColIdx],\n },\n };\n};\n\nexport const TreeTable = ({\n config,\n dataSource,\n source,\n ...tableProps\n}: TreeTableProps) => {\n const dataSourceRef = useRef<TreeDataSource>(undefined);\n useMemo(() => {\n if (dataSource) {\n dataSourceRef.current = dataSource;\n } else if (source) {\n dataSourceRef.current = new TreeDataSource({\n data: source,\n });\n } else {\n throw Error(`TreeTable either source or dataSource must be provided`);\n }\n }, [dataSource, source]);\n\n const tableConfig = useMemo<TableConfig>(() => {\n return {\n ...config,\n columns: dataSourceRef.current?.columnDescriptors ?? [],\n columnSeparators: false,\n rowSeparators: false,\n };\n }, [config]);\n\n console.log({ tableConfig, dataSource: dataSourceRef.current });\n\n if (dataSourceRef.current === undefined) {\n return null;\n }\n\n return (\n <Table\n {...tableProps}\n className=\"vuuTreeTable\"\n config={tableConfig}\n dataSource={dataSourceRef.current}\n groupToggleTarget=\"toggle-icon\"\n navigationStyle=\"tree\"\n rowToObject={rowToTreeNodeObject}\n showColumnHeaderMenus={false}\n selectionModel=\"single\"\n selectionBookendWidth={0}\n />\n );\n};\n"],"names":["metadataKeys","isRowSelected","useRef","useMemo","TreeDataSource","jsx","Table"],"mappings":";;;;;;;;AAYA,MAAM,EAAE,KAAA,EAAO,OAAS,EAAA,GAAA,EAAK,KAAQ,GAAAA,qBAAA;AAcrC,MAAM,mBAAA,GAAyC,CAAC,GAAA,EAAK,SAAc,KAAA;AACjE,EAAA,MAAM,EAAE,CAAC,OAAO,GAAG,MAAA,EAAQ,CAAC,GAAG,GAAG,GAAK,EAAA,CAAC,GAAG,GAAG,KAAA,EAAO,CAAC,KAAK,GAAG,OAAU,GAAA,GAAA;AACxE,EAAA,MAAM,cAAc,SAAU,CAAA,QAAA;AAC9B,EAAA,MAAM,cAAc,WAAc,GAAA,KAAA;AAElC,EAAO,OAAA;AAAA,IACL,GAAA;AAAA,IACA,KAAA;AAAA,IACA,YAAY,CAAC,MAAA;AAAA,IACb,UAAA,EAAYC,uBAAc,GAAG,CAAA;AAAA,IAC7B,IAAM,EAAA;AAAA,MACJ,KAAA,EAAO,IAAI,WAAW,CAAA;AAAA,MACtB,QAAA,EAAU,IAAI,WAAW;AAAA;AAC3B,GACF;AACF,CAAA;AAEO,MAAM,YAAY,CAAC;AAAA,EACxB,MAAA;AAAA,EACA,UAAA;AAAA,EACA,MAAA;AAAA,EACA,GAAG;AACL,CAAsB,KAAA;AACpB,EAAM,MAAA,aAAA,GAAgBC,aAAuB,KAAS,CAAA,CAAA;AACtD,EAAAC,aAAA,CAAQ,MAAM;AACZ,IAAA,IAAI,UAAY,EAAA;AACd,MAAA,aAAA,CAAc,OAAU,GAAA,UAAA;AAAA,eACf,MAAQ,EAAA;AACjB,MAAc,aAAA,CAAA,OAAA,GAAU,IAAIC,2BAAe,CAAA;AAAA,QACzC,IAAM,EAAA;AAAA,OACP,CAAA;AAAA,KACI,MAAA;AACL,MAAA,MAAM,MAAM,CAAwD,sDAAA,CAAA,CAAA;AAAA;AACtE,GACC,EAAA,CAAC,UAAY,EAAA,MAAM,CAAC,CAAA;AAEvB,EAAM,MAAA,WAAA,GAAcD,cAAqB,MAAM;AAC7C,IAAO,OAAA;AAAA,MACL,GAAG,MAAA;AAAA,MACH,OAAS,EAAA,aAAA,CAAc,OAAS,EAAA,iBAAA,IAAqB,EAAC;AAAA,MACtD,gBAAkB,EAAA,KAAA;AAAA,MAClB,aAAe,EAAA;AAAA,KACjB;AAAA,GACF,EAAG,CAAC,MAAM,CAAC,CAAA;AAEX,EAAA,OAAA,CAAQ,IAAI,EAAE,WAAA,EAAa,UAAY,EAAA,aAAA,CAAc,SAAS,CAAA;AAE9D,EAAI,IAAA,aAAA,CAAc,YAAY,KAAW,CAAA,EAAA;AACvC,IAAO,OAAA,IAAA;AAAA;AAGT,EACE,uBAAAE,cAAA;AAAA,IAACC,cAAA;AAAA,IAAA;AAAA,MACE,GAAG,UAAA;AAAA,MACJ,SAAU,EAAA,cAAA;AAAA,MACV,MAAQ,EAAA,WAAA;AAAA,MACR,YAAY,aAAc,CAAA,OAAA;AAAA,MAC1B,iBAAkB,EAAA,aAAA;AAAA,MAClB,eAAgB,EAAA,MAAA;AAAA,MAChB,WAAa,EAAA,mBAAA;AAAA,MACb,qBAAuB,EAAA,KAAA;AAAA,MACvB,cAAe,EAAA,QAAA;AAAA,MACf,qBAAuB,EAAA;AAAA;AAAA,GACzB;AAEJ;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"JsonTable.js","sources":["../../src/json-table/JsonTable.tsx"],"sourcesContent":["import { TableProps } from \"@vuu-ui/vuu-table\";\nimport { JsonData, registerComponent } from \"@vuu-ui/vuu-utils\";\nimport { Table } from \"@vuu-ui/vuu-table\";\nimport { JsonDataSource } from \"@vuu-ui/vuu-data-local\";\nimport { useEffect, useMemo, useRef } from \"react\";\nimport { TableConfig } from \"@vuu-ui/vuu-table-types\";\nimport { JsonCell } from \"./JsonCell\";\n\nregisterComponent(\"json\", JsonCell, \"cell-renderer\");\n\nexport interface JsonTableProps\n extends Omit<TableProps, \"config\" | \"dataSource\"> {\n config?: Pick<\n TableConfig,\n \"columnSeparators\" | \"rowSeparators\" | \"zebraStripes\"\n >;\n source: JsonData;\n}\n\nexport const JsonTable = ({\n config,\n source: sourceProp,\n ...tableProps\n}: JsonTableProps) => {\n const sourceRef = useRef(sourceProp);\n const dataSourceRef = useRef<JsonDataSource>();\n useMemo(() => {\n dataSourceRef.current = new JsonDataSource({\n data: sourceRef.current,\n });\n }, []);\n\n const tableConfig = useMemo<TableConfig>(() => {\n return {\n ...config,\n columns: dataSourceRef.current?.columnDescriptors ?? [],\n columnSeparators: true,\n rowSeparators: true,\n };\n }, [config]);\n\n useEffect(() => {\n if (dataSourceRef.current) {\n dataSourceRef.current.data = sourceProp;\n }\n }, [sourceProp]);\n\n if (dataSourceRef.current === undefined) {\n return null;\n }\n\n return (\n <Table\n {...tableProps}\n config={tableConfig}\n dataSource={dataSourceRef.current}\n showColumnHeaderMenus={false}\n selectionModel=\"none\"\n />\n );\n};\n"],"names":[],"mappings":";;;;;;;AAQA,iBAAkB,CAAA,MAAA,EAAQ,UAAU,eAAe,CAAA;AAW5C,MAAM,YAAY,CAAC;AAAA,EACxB,MAAA;AAAA,EACA,MAAQ,EAAA,UAAA;AAAA,EACR,GAAG;AACL,CAAsB,KAAA;AACpB,EAAM,MAAA,SAAA,GAAY,OAAO,UAAU,CAAA;AACnC,
|
|
1
|
+
{"version":3,"file":"JsonTable.js","sources":["../../src/json-table/JsonTable.tsx"],"sourcesContent":["import { TableProps } from \"@vuu-ui/vuu-table\";\nimport { JsonData, registerComponent } from \"@vuu-ui/vuu-utils\";\nimport { Table } from \"@vuu-ui/vuu-table\";\nimport { JsonDataSource } from \"@vuu-ui/vuu-data-local\";\nimport { useEffect, useMemo, useRef } from \"react\";\nimport { TableConfig } from \"@vuu-ui/vuu-table-types\";\nimport { JsonCell } from \"./JsonCell\";\n\nregisterComponent(\"json\", JsonCell, \"cell-renderer\");\n\nexport interface JsonTableProps\n extends Omit<TableProps, \"config\" | \"dataSource\"> {\n config?: Pick<\n TableConfig,\n \"columnSeparators\" | \"rowSeparators\" | \"zebraStripes\"\n >;\n source: JsonData;\n}\n\nexport const JsonTable = ({\n config,\n source: sourceProp,\n ...tableProps\n}: JsonTableProps) => {\n const sourceRef = useRef(sourceProp);\n const dataSourceRef = useRef<JsonDataSource>(undefined);\n useMemo(() => {\n dataSourceRef.current = new JsonDataSource({\n data: sourceRef.current,\n });\n }, []);\n\n const tableConfig = useMemo<TableConfig>(() => {\n return {\n ...config,\n columns: dataSourceRef.current?.columnDescriptors ?? [],\n columnSeparators: true,\n rowSeparators: true,\n };\n }, [config]);\n\n useEffect(() => {\n if (dataSourceRef.current) {\n dataSourceRef.current.data = sourceProp;\n }\n }, [sourceProp]);\n\n if (dataSourceRef.current === undefined) {\n return null;\n }\n\n return (\n <Table\n {...tableProps}\n config={tableConfig}\n dataSource={dataSourceRef.current}\n showColumnHeaderMenus={false}\n selectionModel=\"none\"\n />\n );\n};\n"],"names":[],"mappings":";;;;;;;AAQA,iBAAkB,CAAA,MAAA,EAAQ,UAAU,eAAe,CAAA;AAW5C,MAAM,YAAY,CAAC;AAAA,EACxB,MAAA;AAAA,EACA,MAAQ,EAAA,UAAA;AAAA,EACR,GAAG;AACL,CAAsB,KAAA;AACpB,EAAM,MAAA,SAAA,GAAY,OAAO,UAAU,CAAA;AACnC,EAAM,MAAA,aAAA,GAAgB,OAAuB,KAAS,CAAA,CAAA;AACtD,EAAA,OAAA,CAAQ,MAAM;AACZ,IAAc,aAAA,CAAA,OAAA,GAAU,IAAI,cAAe,CAAA;AAAA,MACzC,MAAM,SAAU,CAAA;AAAA,KACjB,CAAA;AAAA,GACH,EAAG,EAAE,CAAA;AAEL,EAAM,MAAA,WAAA,GAAc,QAAqB,MAAM;AAC7C,IAAO,OAAA;AAAA,MACL,GAAG,MAAA;AAAA,MACH,OAAS,EAAA,aAAA,CAAc,OAAS,EAAA,iBAAA,IAAqB,EAAC;AAAA,MACtD,gBAAkB,EAAA,IAAA;AAAA,MAClB,aAAe,EAAA;AAAA,KACjB;AAAA,GACF,EAAG,CAAC,MAAM,CAAC,CAAA;AAEX,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,cAAc,OAAS,EAAA;AACzB,MAAA,aAAA,CAAc,QAAQ,IAAO,GAAA,UAAA;AAAA;AAC/B,GACF,EAAG,CAAC,UAAU,CAAC,CAAA;AAEf,EAAI,IAAA,aAAA,CAAc,YAAY,KAAW,CAAA,EAAA;AACvC,IAAO,OAAA,IAAA;AAAA;AAGT,EACE,uBAAA,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACE,GAAG,UAAA;AAAA,MACJ,MAAQ,EAAA,WAAA;AAAA,MACR,YAAY,aAAc,CAAA,OAAA;AAAA,MAC1B,qBAAuB,EAAA,KAAA;AAAA,MACvB,cAAe,EAAA;AAAA;AAAA,GACjB;AAEJ;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TreeTable.js","sources":["../../src/tree-table/TreeTable.tsx"],"sourcesContent":["import { TableProps } from \"@vuu-ui/vuu-table\";\nimport { Table } from \"@vuu-ui/vuu-table\";\nimport { TreeDataSource } from \"@vuu-ui/vuu-data-local\";\nimport { useMemo, useRef } from \"react\";\nimport { TableConfig } from \"@vuu-ui/vuu-table-types\";\nimport {\n isRowSelected,\n metadataKeys,\n type RowToObjectMapper,\n type TreeSourceNode,\n} from \"@vuu-ui/vuu-utils\";\n\nconst { DEPTH, IS_LEAF, KEY, IDX } = metadataKeys;\n\ninterface Props extends Omit<TableProps, \"config\" | \"dataSource\"> {\n config?: Pick<\n TableConfig,\n \"columnSeparators\" | \"rowSeparators\" | \"zebraStripes\"\n >;\n dataSource?: TreeDataSource;\n source?: TreeSourceNode[];\n}\n\nexport type TreeTableProps = Props &\n ({ dataSource: TreeDataSource } | { source: TreeSourceNode[] });\n\nconst rowToTreeNodeObject: RowToObjectMapper = (row, columnMap) => {\n const { [IS_LEAF]: isLeaf, [KEY]: key, [IDX]: index, [DEPTH]: depth } = row;\n const firstColIdx = columnMap.nodeData;\n const labelColIdx = firstColIdx + depth;\n\n return {\n key,\n index,\n isGroupRow: !isLeaf,\n isSelected: isRowSelected(row),\n data: {\n label: row[labelColIdx],\n nodeData: row[firstColIdx],\n },\n };\n};\n\nexport const TreeTable = ({\n config,\n dataSource,\n source,\n ...tableProps\n}: TreeTableProps) => {\n const dataSourceRef = useRef<TreeDataSource>();\n useMemo(() => {\n if (dataSource) {\n dataSourceRef.current = dataSource;\n } else if (source) {\n dataSourceRef.current = new TreeDataSource({\n data: source,\n });\n } else {\n throw Error(`TreeTable either source or dataSource must be provided`);\n }\n }, [dataSource, source]);\n\n const tableConfig = useMemo<TableConfig>(() => {\n return {\n ...config,\n columns: dataSourceRef.current?.columnDescriptors ?? [],\n columnSeparators: false,\n rowSeparators: false,\n };\n }, [config]);\n\n console.log({ tableConfig, dataSource: dataSourceRef.current });\n\n if (dataSourceRef.current === undefined) {\n return null;\n }\n\n return (\n <Table\n {...tableProps}\n className=\"vuuTreeTable\"\n config={tableConfig}\n dataSource={dataSourceRef.current}\n groupToggleTarget=\"toggle-icon\"\n navigationStyle=\"tree\"\n rowToObject={rowToTreeNodeObject}\n showColumnHeaderMenus={false}\n selectionModel=\"single\"\n selectionBookendWidth={0}\n />\n );\n};\n"],"names":[],"mappings":";;;;;;AAYA,MAAM,EAAE,KAAA,EAAO,OAAS,EAAA,GAAA,EAAK,KAAQ,GAAA,YAAA;AAcrC,MAAM,mBAAA,GAAyC,CAAC,GAAA,EAAK,SAAc,KAAA;AACjE,EAAA,MAAM,EAAE,CAAC,OAAO,GAAG,MAAA,EAAQ,CAAC,GAAG,GAAG,GAAK,EAAA,CAAC,GAAG,GAAG,KAAA,EAAO,CAAC,KAAK,GAAG,OAAU,GAAA,GAAA;AACxE,EAAA,MAAM,cAAc,SAAU,CAAA,QAAA;AAC9B,EAAA,MAAM,cAAc,WAAc,GAAA,KAAA;AAElC,EAAO,OAAA;AAAA,IACL,GAAA;AAAA,IACA,KAAA;AAAA,IACA,YAAY,CAAC,MAAA;AAAA,IACb,UAAA,EAAY,cAAc,GAAG,CAAA;AAAA,IAC7B,IAAM,EAAA;AAAA,MACJ,KAAA,EAAO,IAAI,WAAW,CAAA;AAAA,MACtB,QAAA,EAAU,IAAI,WAAW;AAAA;AAC3B,GACF;AACF,CAAA;AAEO,MAAM,YAAY,CAAC;AAAA,EACxB,MAAA;AAAA,EACA,UAAA;AAAA,EACA,MAAA;AAAA,EACA,GAAG;AACL,CAAsB,KAAA;AACpB,
|
|
1
|
+
{"version":3,"file":"TreeTable.js","sources":["../../src/tree-table/TreeTable.tsx"],"sourcesContent":["import { TableProps } from \"@vuu-ui/vuu-table\";\nimport { Table } from \"@vuu-ui/vuu-table\";\nimport { TreeDataSource } from \"@vuu-ui/vuu-data-local\";\nimport { useMemo, useRef } from \"react\";\nimport { TableConfig } from \"@vuu-ui/vuu-table-types\";\nimport {\n isRowSelected,\n metadataKeys,\n type RowToObjectMapper,\n type TreeSourceNode,\n} from \"@vuu-ui/vuu-utils\";\n\nconst { DEPTH, IS_LEAF, KEY, IDX } = metadataKeys;\n\ninterface Props extends Omit<TableProps, \"config\" | \"dataSource\"> {\n config?: Pick<\n TableConfig,\n \"columnSeparators\" | \"rowSeparators\" | \"zebraStripes\"\n >;\n dataSource?: TreeDataSource;\n source?: TreeSourceNode[];\n}\n\nexport type TreeTableProps = Props &\n ({ dataSource: TreeDataSource } | { source: TreeSourceNode[] });\n\nconst rowToTreeNodeObject: RowToObjectMapper = (row, columnMap) => {\n const { [IS_LEAF]: isLeaf, [KEY]: key, [IDX]: index, [DEPTH]: depth } = row;\n const firstColIdx = columnMap.nodeData;\n const labelColIdx = firstColIdx + depth;\n\n return {\n key,\n index,\n isGroupRow: !isLeaf,\n isSelected: isRowSelected(row),\n data: {\n label: row[labelColIdx],\n nodeData: row[firstColIdx],\n },\n };\n};\n\nexport const TreeTable = ({\n config,\n dataSource,\n source,\n ...tableProps\n}: TreeTableProps) => {\n const dataSourceRef = useRef<TreeDataSource>(undefined);\n useMemo(() => {\n if (dataSource) {\n dataSourceRef.current = dataSource;\n } else if (source) {\n dataSourceRef.current = new TreeDataSource({\n data: source,\n });\n } else {\n throw Error(`TreeTable either source or dataSource must be provided`);\n }\n }, [dataSource, source]);\n\n const tableConfig = useMemo<TableConfig>(() => {\n return {\n ...config,\n columns: dataSourceRef.current?.columnDescriptors ?? [],\n columnSeparators: false,\n rowSeparators: false,\n };\n }, [config]);\n\n console.log({ tableConfig, dataSource: dataSourceRef.current });\n\n if (dataSourceRef.current === undefined) {\n return null;\n }\n\n return (\n <Table\n {...tableProps}\n className=\"vuuTreeTable\"\n config={tableConfig}\n dataSource={dataSourceRef.current}\n groupToggleTarget=\"toggle-icon\"\n navigationStyle=\"tree\"\n rowToObject={rowToTreeNodeObject}\n showColumnHeaderMenus={false}\n selectionModel=\"single\"\n selectionBookendWidth={0}\n />\n );\n};\n"],"names":[],"mappings":";;;;;;AAYA,MAAM,EAAE,KAAA,EAAO,OAAS,EAAA,GAAA,EAAK,KAAQ,GAAA,YAAA;AAcrC,MAAM,mBAAA,GAAyC,CAAC,GAAA,EAAK,SAAc,KAAA;AACjE,EAAA,MAAM,EAAE,CAAC,OAAO,GAAG,MAAA,EAAQ,CAAC,GAAG,GAAG,GAAK,EAAA,CAAC,GAAG,GAAG,KAAA,EAAO,CAAC,KAAK,GAAG,OAAU,GAAA,GAAA;AACxE,EAAA,MAAM,cAAc,SAAU,CAAA,QAAA;AAC9B,EAAA,MAAM,cAAc,WAAc,GAAA,KAAA;AAElC,EAAO,OAAA;AAAA,IACL,GAAA;AAAA,IACA,KAAA;AAAA,IACA,YAAY,CAAC,MAAA;AAAA,IACb,UAAA,EAAY,cAAc,GAAG,CAAA;AAAA,IAC7B,IAAM,EAAA;AAAA,MACJ,KAAA,EAAO,IAAI,WAAW,CAAA;AAAA,MACtB,QAAA,EAAU,IAAI,WAAW;AAAA;AAC3B,GACF;AACF,CAAA;AAEO,MAAM,YAAY,CAAC;AAAA,EACxB,MAAA;AAAA,EACA,UAAA;AAAA,EACA,MAAA;AAAA,EACA,GAAG;AACL,CAAsB,KAAA;AACpB,EAAM,MAAA,aAAA,GAAgB,OAAuB,KAAS,CAAA,CAAA;AACtD,EAAA,OAAA,CAAQ,MAAM;AACZ,IAAA,IAAI,UAAY,EAAA;AACd,MAAA,aAAA,CAAc,OAAU,GAAA,UAAA;AAAA,eACf,MAAQ,EAAA;AACjB,MAAc,aAAA,CAAA,OAAA,GAAU,IAAI,cAAe,CAAA;AAAA,QACzC,IAAM,EAAA;AAAA,OACP,CAAA;AAAA,KACI,MAAA;AACL,MAAA,MAAM,MAAM,CAAwD,sDAAA,CAAA,CAAA;AAAA;AACtE,GACC,EAAA,CAAC,UAAY,EAAA,MAAM,CAAC,CAAA;AAEvB,EAAM,MAAA,WAAA,GAAc,QAAqB,MAAM;AAC7C,IAAO,OAAA;AAAA,MACL,GAAG,MAAA;AAAA,MACH,OAAS,EAAA,aAAA,CAAc,OAAS,EAAA,iBAAA,IAAqB,EAAC;AAAA,MACtD,gBAAkB,EAAA,KAAA;AAAA,MAClB,aAAe,EAAA;AAAA,KACjB;AAAA,GACF,EAAG,CAAC,MAAM,CAAC,CAAA;AAEX,EAAA,OAAA,CAAQ,IAAI,EAAE,WAAA,EAAa,UAAY,EAAA,aAAA,CAAc,SAAS,CAAA;AAE9D,EAAI,IAAA,aAAA,CAAc,YAAY,KAAW,CAAA,EAAA;AACvC,IAAO,OAAA,IAAA;AAAA;AAGT,EACE,uBAAA,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACE,GAAG,UAAA;AAAA,MACJ,SAAU,EAAA,cAAA;AAAA,MACV,MAAQ,EAAA,WAAA;AAAA,MACR,YAAY,aAAc,CAAA,OAAA;AAAA,MAC1B,iBAAkB,EAAA,aAAA;AAAA,MAClB,eAAgB,EAAA,MAAA;AAAA,MAChB,WAAa,EAAA,mBAAA;AAAA,MACb,qBAAuB,EAAA,KAAA;AAAA,MACvB,cAAe,EAAA,QAAA;AAAA,MACf,qBAAuB,EAAA;AAAA;AAAA,GACzB;AAEJ;;;;"}
|
package/package.json
CHANGED
|
@@ -1,26 +1,26 @@
|
|
|
1
1
|
{
|
|
2
|
-
"version": "0.
|
|
2
|
+
"version": "0.13.1",
|
|
3
3
|
"author": "heswell",
|
|
4
4
|
"license": "Apache-2.0",
|
|
5
5
|
"dependencies": {
|
|
6
6
|
"@salt-ds/core": "1.43.0",
|
|
7
7
|
"@salt-ds/styles": "0.2.1",
|
|
8
8
|
"@salt-ds/window": "0.1.1",
|
|
9
|
-
"@vuu-ui/vuu-data-local": "0.
|
|
10
|
-
"@vuu-ui/vuu-table-types": "0.
|
|
11
|
-
"@vuu-ui/vuu-filters": "0.
|
|
12
|
-
"@vuu-ui/vuu-layout": "0.
|
|
13
|
-
"@vuu-ui/vuu-popups": "0.
|
|
14
|
-
"@vuu-ui/vuu-shell": "0.
|
|
15
|
-
"@vuu-ui/vuu-table": "0.
|
|
16
|
-
"@vuu-ui/vuu-table-extras": "0.
|
|
17
|
-
"@vuu-ui/vuu-ui-controls": "0.
|
|
18
|
-
"@vuu-ui/vuu-utils": "0.
|
|
9
|
+
"@vuu-ui/vuu-data-local": "0.13.1",
|
|
10
|
+
"@vuu-ui/vuu-table-types": "0.13.1",
|
|
11
|
+
"@vuu-ui/vuu-filters": "0.13.1",
|
|
12
|
+
"@vuu-ui/vuu-layout": "0.13.1",
|
|
13
|
+
"@vuu-ui/vuu-popups": "0.13.1",
|
|
14
|
+
"@vuu-ui/vuu-shell": "0.13.1",
|
|
15
|
+
"@vuu-ui/vuu-table": "0.13.1",
|
|
16
|
+
"@vuu-ui/vuu-table-extras": "0.13.1",
|
|
17
|
+
"@vuu-ui/vuu-ui-controls": "0.13.1",
|
|
18
|
+
"@vuu-ui/vuu-utils": "0.13.1"
|
|
19
19
|
},
|
|
20
20
|
"peerDependencies": {
|
|
21
21
|
"clsx": "^2.0.0",
|
|
22
|
-
"react": "
|
|
23
|
-
"react-dom": "
|
|
22
|
+
"react": "^19.1.0",
|
|
23
|
+
"react-dom": "^19.1.0"
|
|
24
24
|
},
|
|
25
25
|
"files": [
|
|
26
26
|
"README.md",
|