@multiplatform.one/table 7.8.0 → 7.10.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/components/DataTable/DataTableMobileCards.cjs +100 -33
- package/dist/cjs/components/DataTable/DataTableMobileCards.native.js +139 -38
- package/dist/cjs/components/DataTable/DataTableMobileCards.native.js.map +1 -1
- package/dist/cjs/components/DataTable/index.native.js +59 -93
- package/dist/cjs/components/DataTable/index.native.js.map +1 -1
- package/dist/esm/components/DataTable/DataTableMobileCards.mjs +99 -34
- package/dist/esm/components/DataTable/DataTableMobileCards.mjs.map +1 -1
- package/dist/esm/components/DataTable/DataTableMobileCards.native.js +138 -39
- package/dist/esm/components/DataTable/DataTableMobileCards.native.js.map +1 -1
- package/dist/esm/components/DataTable/index.native.js +60 -94
- package/dist/esm/components/DataTable/index.native.js.map +1 -1
- package/dist/jsx/components/DataTable/DataTableMobileCards.mjs +99 -34
- package/dist/jsx/components/DataTable/DataTableMobileCards.mjs.map +1 -1
- package/dist/jsx/components/DataTable/DataTableMobileCards.native.js +139 -38
- package/dist/jsx/components/DataTable/DataTableMobileCards.native.js.map +1 -1
- package/dist/jsx/components/DataTable/index.native.js +59 -93
- package/dist/jsx/components/DataTable/index.native.js.map +1 -1
- package/package.json +12 -12
- package/src/components/DataTable/DataTable.spec.tsx +5 -3
- package/src/components/DataTable/DataTableMobileCards.tsx +162 -39
- package/src/components/DataTable/cardLayout.spec.tsx +19 -8
- package/src/components/DataTable/dataTableMobileCards.spec.tsx +50 -2
- package/src/components/DataTable/index.native.tsx +80 -124
- package/src/components/DataTable/nativeCardParity.spec.tsx +95 -0
- package/types/components/DataTable/DataTableMobileCards.d.ts +42 -8
- package/types/components/DataTable/DataTableMobileCards.d.ts.map +1 -1
- package/types/components/DataTable/index.native.d.ts +1 -1
- package/types/components/DataTable/index.native.d.ts.map +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["TrashIcon","EmptyState","Button","Checkbox","hairline","useResolvedKnobs","useCallback","Text","View","XStack","useTranslation","TableCellContext","withInterp","rowIntentProps","jsx","jsxs","getColumnLabel","cell","columnDef","column","metaLabel","meta","label","header","id","DataTableMobileCards","tableRows","enableRowSelection","showRowNumbers","showDeleteRow","readOnly","disabled","dataLength","minRows","hasActiveFilters","renderCellContent","onDeleteRow","selectAllChecked","selectAllIndeterminate","onToggleSelectAll","compact","selectRowLabel","getRowPressProps","queryInFlight","t","knobProps","component","tableZebraOn","tableZebra","
|
|
1
|
+
{"version":3,"names":["TrashIcon","EmptyState","Button","Checkbox","hairline","useResolvedKnobs","useCallback","Text","View","VisuallyHidden","XStack","useTranslation","TableCellContext","withInterp","rowIntentProps","jsx","jsxs","getColumnLabel","cell","columnDef","column","metaLabel","meta","label","header","id","selfNamingFields","Set","indicatorIds","dateLike","numberLike","classifyCardField","def","String","role","startsWith","field","has","raw","getValue","trim","value","test","DataTableMobileCards","tableRows","enableRowSelection","showRowNumbers","showDeleteRow","readOnly","disabled","dataLength","minRows","hasActiveFilters","renderCellContent","onDeleteRow","selectAllChecked","selectAllIndeterminate","onToggleSelectAll","compact","selectRowLabel","getRowPressProps","queryInFlight","t","knobProps","component","tableZebraOn","tableZebra","renderCell","index","rowData","Provider","inTableCell","isHeader","children","renderMobileCard","row","original","visibleCells","getVisibleCells","titleCell","detailCells","showDelete","bare","figures","controls","kind","push","hasBody","length","testID","cardSurface","backgroundColor","alignItems","gap","paddingBottom","marginBottom","bottom","borderBottomColor","checked","getIsSelected","onChange","toggleSelected","checkboxProps","flex","minWidth","accessibilityLabel","fontSize","sizeToken","color","fontWeight","chromeless","circular","size","icon","onPress","flexWrap","map","i","flexShrink","accessibilityElementsHidden","importantForAccessibility","paddingTop","flexDirection","shouldSelect","borderRadius","title"],"sources":["../../../../src/components/DataTable/DataTableMobileCards.tsx"],"sourcesContent":[null],"mappings":"AAqBA,SAASA,SAAA,QAAiB;AAC1B,SAASC,UAAA,QAAkB;AAC3B,SAASC,MAAA,EAAQC,QAAA,QAAgB;AACjC,SAASC,QAAA,EAAUC,gBAAA,QAAwB;AAE3C,SAASC,WAAA,QAAmB;AAC5B,SAASC,IAAA,EAAMC,IAAA,EAAMC,cAAA,EAAgBC,MAAA,QAAc;AACnD,SAASC,cAAA,QAAsB;AAC/B,SAASC,gBAAA,QAAwB;AAEjC,SAASC,UAAA,QAAkB;AAC3B,SAASC,cAAA,QAAsB;AAuIzB,SAAAC,GAAA,EAkFQC,IAAA,QAlFR;AA/HC,SAASC,eAAeC,IAAA,EAAmB;EAChD,MAAMC,SAAA,GAAYD,IAAA,CAAKE,MAAA,CAAOD,SAAA;EAC9B,MAAME,SAAA,GAAYF,SAAA,CAAUG,IAAA,EAAMC,KAAA;EAClC,IAAI,OAAOF,SAAA,KAAc,YAAYA,SAAA,EAAW,OAAOA,SAAA;EACvD,OAAO,OAAOF,SAAA,CAAUK,MAAA,KAAW,WAAWL,SAAA,CAAUK,MAAA,GAASL,SAAA,CAAUM,EAAA,IAAMP,IAAA,CAAKE,MAAA,CAAOK,EAAA;AAC/F;AAGA,MAAMC,gBAAA,GAAmB,mBAAIC,GAAA,CAAoB,CAC/C,YACA,UACA,UACA,YACA,SACA,aACA,cACA,eACA,WACA,cACD;AAGD,MAAMC,YAAA,GAAe,mBAAID,GAAA,CAAI,CAAC,UAAU,YAAY,kBAAkB,OAAO,CAAC;AAE9E,MAAME,QAAA,GAAW;AACjB,MAAMC,UAAA,GAAa;AAyBZ,SAASC,kBAAkBb,IAAA,EAA0B;EAC1D,MAAMc,GAAA,GAAMd,IAAA,CAAKE,MAAA,CAAOD,SAAA;EACxB,MAAMM,EAAA,GAAKQ,MAAA,CAAOf,IAAA,CAAKE,MAAA,CAAOK,EAAA,IAAM,EAAE;EACtC,MAAMS,IAAA,GAAOF,GAAA,CAAIV,IAAA,EAAMY,IAAA;EACvB,IAAIA,IAAA,KAAS,YAAYA,IAAA,KAAS,QAAQ,OAAO;EACjD,IAAIA,IAAA,KAAS,aAAaT,EAAA,CAAGU,UAAA,CAAW,GAAG,KAAMH,GAAA,CAAII,KAAA,IAASV,gBAAA,CAAiBW,GAAA,CAAIL,GAAA,CAAII,KAAK,GAAI;IAC9F,OAAO;EACT;EACA,MAAME,GAAA,GAAM,OAAOpB,IAAA,CAAKqB,QAAA,KAAa,aAAarB,IAAA,CAAKqB,QAAA,CAAS,IAAI;EACpE,IAAID,GAAA,IAAO,QAAS,OAAOA,GAAA,KAAQ,YAAYA,GAAA,CAAIE,IAAA,CAAK,MAAM,IAAK,OAAO;EAC1E,IAAIN,IAAA,KAAS,eAAeN,YAAA,CAAaS,GAAA,CAAIZ,EAAE,GAAG,OAAO;EACzD,IAAI,OAAOa,GAAA,KAAQ,UAAU;IAC3B,MAAMG,KAAA,GAAQH,GAAA,CAAIE,IAAA,CAAK;IACvB,OAAOV,UAAA,CAAWY,IAAA,CAAKD,KAAK,KAAKZ,QAAA,CAASa,IAAA,CAAKD,KAAK,IAAI,WAAW;EACrE;EACA,OAAO;AACT;AAmCO,SAASE,qBAAwD;EACtEC,SAAA;EACAC,kBAAA,GAAqB;EACrBC,cAAA;EACAC,aAAA;EACAC,QAAA;EACAC,QAAA,GAAW;EACXC,UAAA;EACAC,OAAA;EACAC,gBAAA;EACAC,iBAAA;EACAC,WAAA;EACAC,gBAAA,GAAmB;EACnBC,sBAAA,GAAyB;EACzBC,iBAAA;EACAC,OAAA,GAAU;EACVC,cAAA;EACAC,gBAAA;EACAC,aAAA,GAAgB;AAClB,GAAqC;EACnC,MAAM;IAAEC;EAAE,IAAInD,cAAA,CAAe;EAC7B,MAAM;IAAEoD;EAAU,IAAI1D,gBAAA,CAAiB;IAAE2D,SAAA,EAAW;IAAaN;EAAQ,CAAC;EAC1E,MAAMO,YAAA,GAAeF,SAAA,CAAUG,UAAA,KAAe;EAE9C,MAAMC,UAAA,GAAa7D,WAAA,CACjB,CAACY,IAAA,EAAWkD,KAAA,EAAeC,OAAA,KACzB,eAAAtD,GAAA,CAACH,gBAAA,CAAiB0D,QAAA,EAAjB;IAA0B7B,KAAA,EAAO;MAAE8B,WAAA,EAAa;MAAMC,QAAA,EAAU;IAAM;IACpEC,QAAA,EAAApB,iBAAA,CAAkBnC,IAAA,EAAMkD,KAAA,EAAOC,OAAO;EAAA,CACzC,GAEF,CAAChB,iBAAiB,CACpB;EAEA,MAAMqB,gBAAA,GAAmBpE,WAAA,CACvB,CAACqE,GAAA,EAAUP,KAAA,KAAkB;IAC3B,MAAMC,OAAA,GAAUM,GAAA,CAAIC,QAAA;IACpB,MAAMC,YAAA,GAAeF,GAAA,CAAIG,eAAA,CAAgB;IACzC,MAAM,CAACC,SAAA,EAAW,GAAGC,WAAW,IAAIH,YAAA;IACpC,MAAMI,UAAA,GAAalC,aAAA,IAAiB,CAACC,QAAA;IAErC,MAAMkC,IAAA,GAAc,EAAC;IACrB,MAAMC,OAAA,GAAiB,EAAC;IACxB,MAAMC,QAAA,GAAkB,EAAC;IACzB,WAAWlE,IAAA,IAAQ8D,WAAA,EAAa;MAC9B,MAAMK,IAAA,GAAOtD,iBAAA,CAAkBb,IAAI;MACnC,IAAImE,IAAA,KAAS,QAAQH,IAAA,CAAKI,IAAA,CAAKpE,IAAI,WAC1BmE,IAAA,KAAS,UAAUF,OAAA,CAAQG,IAAA,CAAKpE,IAAI,WACpCmE,IAAA,KAAS,WAAWD,QAAA,CAASE,IAAA,CAAKpE,IAAI;IACjD;IACA,MAAMqE,OAAA,GAAUL,IAAA,CAAKM,MAAA,GAAS,KAAKL,OAAA,CAAQK,MAAA,GAAS,KAAKJ,QAAA,CAASI,MAAA,GAAS;IAE3E,OACE,eAAAxE,IAAA,CAACR,IAAA;MAECiF,MAAA,EAAO;MACN,GAAG1B,SAAA,CAAU2B,WAAA;MACb,IAAIzB,YAAA,IAAgBG,KAAA,GAAQ,MAAM,IAAI;QAAEuB,eAAA,EAAiB;MAAU,IAAI,CAAC;MACxE,GAAI;QACH,oBAAoB1B,YAAA,GAAgBG,KAAA,GAAQ,MAAM,IAAI,SAAS,QAAS;MAC1E;MACC,IAAIR,gBAAA,GAAoBA,gBAAA,CAAiBe,GAAA,EAAKP,KAAA,EAAO,MAAM,IAAY,CAAC;MACxE,GAAItD,cAAA,CAAeuD,OAAO;MAG3BI,QAAA,kBAAAzD,IAAA,CAACN,MAAA;QACCkF,UAAA,EAAW;QACXC,GAAA,EAAI;QACH,IAAIN,OAAA,GACD;UACEO,aAAA,EAAe;UACfC,YAAA,EAAc;UACd,GAAG3F,QAAA,CAAS4F,MAAA;UACZC,iBAAA,EAAmB;QACrB,IACA,CAAC;QAEJxB,QAAA,GAAA5B,kBAAA,IACC,eAAA9B,GAAA,CAACZ,QAAA;UACC+F,OAAA,EAASvB,GAAA,CAAIwB,aAAA,CAAc;UAC3BC,QAAA,EAAWF,OAAA,IAAY;YACrB,IAAIjD,QAAA,EAAU;YACd0B,GAAA,CAAI0B,cAAA,CAAe,CAAC,CAACH,OAAO;UAC9B;UACAjD,QAAA;UACAqD,aAAA,EAAe;YACb,cACE3C,cAAA,GAAiBgB,GAAA,EAAKP,KAAK,KAC3BvD,UAAA,CAAWiD,CAAA,CAAE,sBAAsB;cAAEa,GAAA,EAAKP,KAAA,GAAQ;YAAE,CAAC,GAAG;cACtDO,GAAA,EAAKP,KAAA,GAAQ;YACf,CAAC;UACL;UACAV;QAAA,CACF,GAEDqB,SAAA,GACC,eAAAhE,GAAA,CAACP,IAAA;UACC+F,IAAA,EAAM;UACNC,QAAA,EAAU;UACV,cAAYvF,cAAA,CAAe8D,SAAS;UACpC0B,kBAAA,EAAoBxF,cAAA,CAAe8D,SAAS;UAC3C,GAAI;YAAE,kBAAkB;UAAQ;UAEhCN,QAAA,EAAAN,UAAA,CAAWY,SAAA,EAAWX,KAAA,EAAOC,OAAO;QAAA,CACvC,IAEA,eAAAtD,GAAA,CAACP,IAAA;UAAK+F,IAAA,EAAM;QAAA,CAAG,GAEhBzD,cAAA,IACC,eAAA9B,IAAA,CAACT,IAAA;UAAKmG,QAAA,EAAU3C,SAAA,CAAU4C,SAAA;UAAWC,KAAA,EAAM;UAAWC,UAAA,EAAW;UAAMpC,QAAA,QACnEL,KAAA,GAAQ;QAAA,CACZ,GAEDa,UAAA,IACC,eAAAlE,GAAA,CAACb,MAAA;UACC4G,UAAA,EAAU;UACVC,QAAA,EAAQ;UACRC,IAAA,EAAK;UACLC,IAAA,EAAMjH,SAAA;UACNiD,QAAA,EAAUA,QAAA,IAAYC,UAAA,IAAcC,OAAA;UACpC+D,OAAA,EAASA,CAAA,KAAM5D,WAAA,CAAYc,KAAK;UAChC,cAAYvD,UAAA,CAAWiD,CAAA,CAAE,sBAAsB;YAAEa,GAAA,EAAKP,KAAA,GAAQ;UAAE,CAAC,GAAG;YAClEO,GAAA,EAAKP,KAAA,GAAQ;UACf,CAAC;QAAA,CACH;MAAA,CAEJ,GAICc,IAAA,CAAKM,MAAA,GAAS,IACb,eAAAzE,GAAA,CAACL,MAAA;QACCyG,QAAA,EAAS;QACTvB,UAAA,EAAW;QACXC,GAAA,EAAI;QACH,GAAI;UAAE,kBAAkB;QAAO;QAE/BpB,QAAA,EAAAS,IAAA,CAAKkC,GAAA,CAAI,CAAClG,IAAA,EAAWmG,CAAA,KACpB,eAAArG,IAAA,CAACN,MAAA;UAAqBkF,UAAA,EAAW;UAASC,GAAA,EAAI;UAAKyB,UAAA,EAAY;UAAGd,QAAA,EAAU;UAC1E/B,QAAA,kBAAA1D,GAAA,CAACN,cAAA;YAAgBgE,QAAA,KAAGxD,cAAA,CAAeC,IAAI,CAAC;UAAA,CAAK,GAC7C,eAAAH,GAAA,CAACP,IAAA;YAAK8G,UAAA,EAAY;YAAGd,QAAA,EAAU;YAC5B/B,QAAA,EAAAN,UAAA,CAAWjD,IAAA,EAAMkD,KAAA,EAAOC,OAAO;UAAA,CAClC,GAGCgD,CAAA,GAAInC,IAAA,CAAKM,MAAA,GAAS,IACjB,eAAAzE,GAAA,CAACR,IAAA;YACCmG,QAAA,EAAU3C,SAAA,CAAU4C,SAAA;YACpBC,KAAA,EAAM;YACN,eAAW;YACXW,2BAAA,EAA2B;YAC3BC,yBAAA,EAA0B;YAC3B/C,QAAA;UAAA,CAED,IACE;QAAA,GAjBOvD,IAAA,CAAKO,EAkBlB,CACD;MAAA,CACH,IACE,MAGH0D,OAAA,CAAQK,MAAA,GAAS,IAChB,eAAAzE,GAAA,CAACL,MAAA;QACCyG,QAAA,EAAS;QACTvB,UAAA,EAAW;QACXC,GAAA,EAAI;QACJ4B,UAAA,EAAYvC,IAAA,CAAKM,MAAA,GAAS,IAAI,SAAS;QACtC,GAAI;UAAE,kBAAkB;QAAS;QAEjCf,QAAA,EAAAU,OAAA,CAAQiC,GAAA,CAAKlG,IAAA,IACZ,eAAAF,IAAA,CAACN,MAAA;UAAqBkF,UAAA,EAAW;UAASC,GAAA,EAAI;UAAOyB,UAAA,EAAY;UAAGd,QAAA,EAAU;UAC5E/B,QAAA,kBAAA1D,GAAA,CAACR,IAAA;YAAKmG,QAAA,EAAU3C,SAAA,CAAU4C,SAAA;YAAWC,KAAA,EAAM;YAAWC,UAAA,EAAW;YAC9DpC,QAAA,EAAAxD,cAAA,CAAeC,IAAI;UAAA,CACtB,GACA,eAAAH,GAAA,CAACP,IAAA;YAAK8G,UAAA,EAAY;YAAGd,QAAA,EAAU;YAC5B/B,QAAA,EAAAN,UAAA,CAAWjD,IAAA,EAAMkD,KAAA,EAAOC,OAAO;UAAA,CAClC;QAAA,GANWnD,IAAA,CAAKO,EAOlB,CACD;MAAA,CACH,IACE,MAGH2D,QAAA,CAASgC,GAAA,CAAKlG,IAAA,IACb,eAAAF,IAAA,CAACR,IAAA;QAECiH,UAAA,EAAW;QACXjB,QAAA,EAAU;QACT,GAAI;UAAE,kBAAkB;QAAU;QAEnC/B,QAAA,kBAAA1D,GAAA,CAACN,cAAA;UAAgBgE,QAAA,KAAGxD,cAAA,CAAeC,IAAI,CAAC;QAAA,CAAK,GAC5CiD,UAAA,CAAWjD,IAAA,EAAMkD,KAAA,EAAOC,OAAO;MAAA,GAN3BnD,IAAA,CAAKO,EAOZ,CACD;IAAA,GA5II,GAAGkD,GAAA,CAAIlD,EAAE,IAAI2C,KAAK,EA6IzB;EAEJ,GACA,CACEvB,kBAAA,EACAC,cAAA,EACAC,aAAA,EACAC,QAAA,EACAC,QAAA,EACAC,UAAA,EACAC,OAAA,EACAgB,UAAA,EACAb,WAAA,EACAI,OAAA,EACAK,SAAA,EACAE,YAAA,EACAH,CAAA,EACAH,cAAA,EACAC,gBAAA,CAEJ;EAEA,OACE,eAAA5C,IAAA,CAACR,IAAA;IACCkH,aAAA,EAAc;IACb,GAAG3D,SAAA,CAAU8B,GAAA;IACdJ,MAAA,EAAO;IAGN,IAAI7B,gBAAA,GAAoB;MAAE,wBAAwB;IAAO,IAAY,CAAC;IAEtEa,QAAA,GAAA5B,kBAAA,IAAsBD,SAAA,CAAU4C,MAAA,GAAS,KACxC,eAAAxE,IAAA,CAACN,MAAA;MAAOkF,UAAA,EAAW;MAASC,GAAA,EAAI;MAAKC,aAAA,EAAc;MACjDrB,QAAA,kBAAA1D,GAAA,CAACZ,QAAA;QACC+F,OAAA,EAAS1C,sBAAA,GAAyB,kBAAkBD,gBAAA;QACpD6C,QAAA,EAAWF,OAAA,IAAY;UACrB,IAAIjD,QAAA,IAAYiD,OAAA,KAAY,iBAAiB;UAC7C,MAAMyB,YAAA,GAAezB,OAAA,KAAY;UACjC,IAAIyB,YAAA,KAAiBpE,gBAAA,EAAkBE,iBAAA,GAAoB;QAC7D;QACAR,QAAA;QACAqD,aAAA,EAAe;UAAE,cAAcxC,CAAA,CAAE,iBAAiB;QAAE;QACpDJ;MAAA,CACF,GACA,eAAA3C,GAAA,CAACR,IAAA;QAAKmG,QAAA,EAAU3C,SAAA,CAAU4C,SAAA;QAAWC,KAAA,EAAM;QACxCnC,QAAA,EAAAX,CAAA,CAAE,YAAY;MAAA,CACjB;IAAA,CACF,GAEDlB,SAAA,CAAU4C,MAAA,KAAW,IACpB3B,aAAA,GAAgB,OACd,eAAA9C,GAAA,CAACd,UAAA;MACCyD,OAAA,EAAO;MACPiC,eAAA,EAAgB;MACf,GAAG5B,SAAA,CAAU6D,YAAA;MACd,aAAU;MACVC,KAAA,EAAOzE,gBAAA,GAAmBU,CAAA,CAAE,kBAAkB,IAAIA,CAAA,CAAE,mBAAmB;IAAA,CACzE,IAGFlB,SAAA,CAAUwE,GAAA,CAAI,CAACzC,GAAA,EAAUP,KAAA,KAAkBM,gBAAA,CAAiBC,GAAA,EAAKP,KAAK,CAAC;EAAA,CAE3E;AAEJ","ignoreList":[]}
|
|
@@ -4,7 +4,7 @@ import { EmptyState } from "@multiplatform.one/components";
|
|
|
4
4
|
import { Button, Checkbox } from "@multiplatform.one/forms";
|
|
5
5
|
import { hairline, useResolvedKnobs } from "@multiplatform.one/theme";
|
|
6
6
|
import { useCallback } from "react";
|
|
7
|
-
import { Text, View, XStack } from "tamagui";
|
|
7
|
+
import { Text, View, VisuallyHidden, XStack } from "tamagui";
|
|
8
8
|
import { useTranslation } from "react-i18next";
|
|
9
9
|
import { TableCellContext } from "@multiplatform.one/table-primitives";
|
|
10
10
|
import { withInterp } from "../../utils/withInterp.native.js";
|
|
@@ -16,6 +16,29 @@ function getColumnLabel(cell) {
|
|
|
16
16
|
if (typeof metaLabel === "string" && metaLabel) return metaLabel;
|
|
17
17
|
return typeof columnDef.header === "string" ? columnDef.header : columnDef.id || cell.column.id;
|
|
18
18
|
}
|
|
19
|
+
var selfNamingFields = /* @__PURE__ */new Set(["checkbox", "switch", "rating", "progress", "image", "signature", "fileupload", "colorpicker", "barcode", "geolocation"]);
|
|
20
|
+
var indicatorIds = /* @__PURE__ */new Set(["status", "priority", "workflow_state", "state"]);
|
|
21
|
+
var dateLike = /^\d{4}-\d{2}-\d{2}([T ]|$)|^\d{1,2}\/\d{1,2}\/\d{2,4}$/;
|
|
22
|
+
var numberLike = /^[+\-−]?[\d,\s]*\d(\.\d+)?%?$/;
|
|
23
|
+
function classifyCardField(cell) {
|
|
24
|
+
var _cell_column_id;
|
|
25
|
+
var _def_meta;
|
|
26
|
+
var def = cell.column.columnDef;
|
|
27
|
+
var id = String((_cell_column_id = cell.column.id) !== null && _cell_column_id !== void 0 ? _cell_column_id : "");
|
|
28
|
+
var role = (_def_meta = def.meta) === null || _def_meta === void 0 ? void 0 : _def_meta.role;
|
|
29
|
+
if (role === "hidden" || role === "skip") return "skip";
|
|
30
|
+
if (role === "actions" || id.startsWith("_") || def.field && selfNamingFields.has(def.field)) {
|
|
31
|
+
return "control";
|
|
32
|
+
}
|
|
33
|
+
var raw = typeof cell.getValue === "function" ? cell.getValue() : void 0;
|
|
34
|
+
if (raw == null || typeof raw === "string" && raw.trim() === "") return "skip";
|
|
35
|
+
if (role === "indicator" || indicatorIds.has(id)) return "bare";
|
|
36
|
+
if (typeof raw === "string") {
|
|
37
|
+
var value = raw.trim();
|
|
38
|
+
return numberLike.test(value) || dateLike.test(value) ? "figure" : "bare";
|
|
39
|
+
}
|
|
40
|
+
return "figure";
|
|
41
|
+
}
|
|
19
42
|
function DataTableMobileCards(param) {
|
|
20
43
|
var {
|
|
21
44
|
tableRows,
|
|
@@ -47,18 +70,51 @@ function DataTableMobileCards(param) {
|
|
|
47
70
|
compact
|
|
48
71
|
});
|
|
49
72
|
var tableZebraOn = knobProps.tableZebra === "on";
|
|
73
|
+
var renderCell = useCallback(function (cell, index, rowData) {
|
|
74
|
+
return /* @__PURE__ */_jsx(TableCellContext.Provider, {
|
|
75
|
+
value: {
|
|
76
|
+
inTableCell: true,
|
|
77
|
+
isHeader: false
|
|
78
|
+
},
|
|
79
|
+
children: renderCellContent(cell, index, rowData)
|
|
80
|
+
});
|
|
81
|
+
}, [renderCellContent]);
|
|
50
82
|
var renderMobileCard = useCallback(function (row, index) {
|
|
51
83
|
var _ref;
|
|
52
84
|
var rowData = row.original;
|
|
53
85
|
var visibleCells = row.getVisibleCells();
|
|
54
86
|
var [titleCell, ...detailCells] = visibleCells;
|
|
55
87
|
var showDelete = showDeleteRow && !readOnly;
|
|
88
|
+
var bare = [];
|
|
89
|
+
var figures = [];
|
|
90
|
+
var controls = [];
|
|
91
|
+
var _iteratorNormalCompletion = true,
|
|
92
|
+
_didIteratorError = false,
|
|
93
|
+
_iteratorError = void 0;
|
|
94
|
+
try {
|
|
95
|
+
for (var _iterator = detailCells[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {
|
|
96
|
+
var cell = _step.value;
|
|
97
|
+
var kind = classifyCardField(cell);
|
|
98
|
+
if (kind === "bare") bare.push(cell);else if (kind === "figure") figures.push(cell);else if (kind === "control") controls.push(cell);
|
|
99
|
+
}
|
|
100
|
+
} catch (err) {
|
|
101
|
+
_didIteratorError = true;
|
|
102
|
+
_iteratorError = err;
|
|
103
|
+
} finally {
|
|
104
|
+
try {
|
|
105
|
+
if (!_iteratorNormalCompletion && _iterator.return != null) {
|
|
106
|
+
_iterator.return();
|
|
107
|
+
}
|
|
108
|
+
} finally {
|
|
109
|
+
if (_didIteratorError) {
|
|
110
|
+
throw _iteratorError;
|
|
111
|
+
}
|
|
112
|
+
}
|
|
113
|
+
}
|
|
114
|
+
var hasBody = bare.length > 0 || figures.length > 0 || controls.length > 0;
|
|
56
115
|
return /* @__PURE__ */_jsxs(View, {
|
|
57
116
|
testID: "data-table-card",
|
|
58
|
-
...knobProps.surface,
|
|
59
117
|
...knobProps.cardSurface,
|
|
60
|
-
elevation: knobProps.elevation,
|
|
61
|
-
borderColor: "$color6",
|
|
62
118
|
...(tableZebraOn && index % 2 === 1 ? {
|
|
63
119
|
backgroundColor: "$color2"
|
|
64
120
|
} : {}),
|
|
@@ -71,7 +127,7 @@ function DataTableMobileCards(param) {
|
|
|
71
127
|
/* @__PURE__ */_jsxs(XStack, {
|
|
72
128
|
alignItems: "center",
|
|
73
129
|
gap: "$2",
|
|
74
|
-
...(
|
|
130
|
+
...(hasBody ? {
|
|
75
131
|
paddingBottom: "$2",
|
|
76
132
|
marginBottom: "$2",
|
|
77
133
|
...hairline.bottom,
|
|
@@ -96,16 +152,11 @@ function DataTableMobileCards(param) {
|
|
|
96
152
|
flex: 1,
|
|
97
153
|
minWidth: 0,
|
|
98
154
|
"aria-label": getColumnLabel(titleCell),
|
|
155
|
+
accessibilityLabel: getColumnLabel(titleCell),
|
|
99
156
|
...{
|
|
100
157
|
"data-card-slot": "title"
|
|
101
158
|
},
|
|
102
|
-
children:
|
|
103
|
-
value: {
|
|
104
|
-
inTableCell: true,
|
|
105
|
-
isHeader: false
|
|
106
|
-
},
|
|
107
|
-
children: renderCellContent(titleCell, index, rowData)
|
|
108
|
-
})
|
|
159
|
+
children: renderCell(titleCell, index, rowData)
|
|
109
160
|
}) : /* @__PURE__ */_jsx(View, {
|
|
110
161
|
flex: 1
|
|
111
162
|
}), showRowNumbers && /* @__PURE__ */_jsxs(Text, {
|
|
@@ -128,35 +179,83 @@ function DataTableMobileCards(param) {
|
|
|
128
179
|
row: index + 1
|
|
129
180
|
})
|
|
130
181
|
})]
|
|
131
|
-
}),
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
flex: 1,
|
|
182
|
+
}),
|
|
183
|
+
/* Self-naming values, wrapped into one flow. No printed labels:
|
|
184
|
+
the name goes to assistive tech only, at no layout cost. */
|
|
185
|
+
bare.length > 0 ? /* @__PURE__ */_jsx(XStack, {
|
|
186
|
+
flexWrap: "wrap",
|
|
187
|
+
alignItems: "center",
|
|
188
|
+
gap: "$2",
|
|
189
|
+
...{
|
|
190
|
+
"data-card-slot": "meta"
|
|
191
|
+
},
|
|
192
|
+
children: bare.map(function (cell2, i) {
|
|
193
|
+
return /* @__PURE__ */_jsxs(XStack, {
|
|
194
|
+
alignItems: "center",
|
|
195
|
+
gap: "$2",
|
|
196
|
+
flexShrink: 1,
|
|
147
197
|
minWidth: 0,
|
|
148
|
-
children: /* @__PURE__ */_jsx(
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
children:
|
|
154
|
-
})
|
|
155
|
-
|
|
156
|
-
|
|
198
|
+
children: [/* @__PURE__ */_jsx(VisuallyHidden, {
|
|
199
|
+
children: `${getColumnLabel(cell2)}: `
|
|
200
|
+
}), /* @__PURE__ */_jsx(View, {
|
|
201
|
+
flexShrink: 1,
|
|
202
|
+
minWidth: 0,
|
|
203
|
+
children: renderCell(cell2, index, rowData)
|
|
204
|
+
}),
|
|
205
|
+
/* The separator TRAILS its value, so a line that wraps
|
|
206
|
+
starts with content instead of a stray dot. */
|
|
207
|
+
i < bare.length - 1 ? /* @__PURE__ */_jsx(Text, {
|
|
208
|
+
fontSize: knobProps.sizeToken,
|
|
209
|
+
color: "$color8",
|
|
210
|
+
"aria-hidden": true,
|
|
211
|
+
accessibilityElementsHidden: true,
|
|
212
|
+
importantForAccessibility: "no-hide-descendants",
|
|
213
|
+
children: "\xB7"
|
|
214
|
+
}) : null]
|
|
215
|
+
}, cell2.id);
|
|
216
|
+
})
|
|
217
|
+
}) : null, /* Figures keep their name, inline beside the value. */
|
|
218
|
+
figures.length > 0 ? /* @__PURE__ */_jsx(XStack, {
|
|
219
|
+
flexWrap: "wrap",
|
|
220
|
+
alignItems: "center",
|
|
221
|
+
gap: "$3",
|
|
222
|
+
paddingTop: bare.length > 0 ? "$1.5" : 0,
|
|
223
|
+
...{
|
|
224
|
+
"data-card-slot": "figure"
|
|
225
|
+
},
|
|
226
|
+
children: figures.map(function (cell2) {
|
|
227
|
+
return /* @__PURE__ */_jsxs(XStack, {
|
|
228
|
+
alignItems: "center",
|
|
229
|
+
gap: "$1.5",
|
|
230
|
+
flexShrink: 1,
|
|
231
|
+
minWidth: 0,
|
|
232
|
+
children: [/* @__PURE__ */_jsx(Text, {
|
|
233
|
+
fontSize: knobProps.sizeToken,
|
|
234
|
+
color: "$color10",
|
|
235
|
+
fontWeight: "500",
|
|
236
|
+
children: getColumnLabel(cell2)
|
|
237
|
+
}), /* @__PURE__ */_jsx(View, {
|
|
238
|
+
flexShrink: 1,
|
|
239
|
+
minWidth: 0,
|
|
240
|
+
children: renderCell(cell2, index, rowData)
|
|
241
|
+
})]
|
|
242
|
+
}, cell2.id);
|
|
243
|
+
})
|
|
244
|
+
}) : null, /* Controls keep a row of their own — they are tap targets. */
|
|
245
|
+
controls.map(function (cell2) {
|
|
246
|
+
return /* @__PURE__ */_jsxs(View, {
|
|
247
|
+
paddingTop: "$2",
|
|
248
|
+
minWidth: 0,
|
|
249
|
+
...{
|
|
250
|
+
"data-card-slot": "control"
|
|
251
|
+
},
|
|
252
|
+
children: [/* @__PURE__ */_jsx(VisuallyHidden, {
|
|
253
|
+
children: `${getColumnLabel(cell2)}: `
|
|
254
|
+
}), renderCell(cell2, index, rowData)]
|
|
255
|
+
}, cell2.id);
|
|
157
256
|
})]
|
|
158
257
|
}, `${row.id}-${index}`);
|
|
159
|
-
}, [enableRowSelection, showRowNumbers, showDeleteRow, readOnly, disabled, dataLength, minRows,
|
|
258
|
+
}, [enableRowSelection, showRowNumbers, showDeleteRow, readOnly, disabled, dataLength, minRows, renderCell, onDeleteRow, compact, knobProps, tableZebraOn, t, selectRowLabel, getRowPressProps]);
|
|
160
259
|
return /* @__PURE__ */_jsxs(View, {
|
|
161
260
|
flexDirection: "column",
|
|
162
261
|
...knobProps.gap,
|
|
@@ -198,5 +297,5 @@ function DataTableMobileCards(param) {
|
|
|
198
297
|
})]
|
|
199
298
|
});
|
|
200
299
|
}
|
|
201
|
-
export { DataTableMobileCards };
|
|
300
|
+
export { DataTableMobileCards, classifyCardField, getColumnLabel };
|
|
202
301
|
//# sourceMappingURL=DataTableMobileCards.native.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["jsx","_jsx","jsxs","_jsxs","TrashIcon","EmptyState","Button","Checkbox","hairline","useResolvedKnobs","useCallback","Text","View","XStack","useTranslation","TableCellContext","withInterp","rowIntentProps","getColumnLabel","cell","_columnDef_meta","columnDef","column","metaLabel","meta","label","header","id","DataTableMobileCards","param","tableRows","enableRowSelection","showRowNumbers","showDeleteRow","readOnly","disabled","dataLength","minRows","hasActiveFilters","renderCellContent","onDeleteRow","selectAllChecked","selectAllIndeterminate","onToggleSelectAll","compact","selectRowLabel","getRowPressProps","queryInFlight","t","knobProps","component","tableZebraOn","tableZebra","
|
|
1
|
+
{"version":3,"names":["jsx","_jsx","jsxs","_jsxs","TrashIcon","EmptyState","Button","Checkbox","hairline","useResolvedKnobs","useCallback","Text","View","VisuallyHidden","XStack","useTranslation","TableCellContext","withInterp","rowIntentProps","getColumnLabel","cell","_columnDef_meta","columnDef","column","metaLabel","meta","label","header","id","selfNamingFields","Set","indicatorIds","dateLike","numberLike","classifyCardField","_cell_column_id","_def_meta","def","String","role","startsWith","field","has","raw","getValue","trim","value","test","DataTableMobileCards","param","tableRows","enableRowSelection","showRowNumbers","showDeleteRow","readOnly","disabled","dataLength","minRows","hasActiveFilters","renderCellContent","onDeleteRow","selectAllChecked","selectAllIndeterminate","onToggleSelectAll","compact","selectRowLabel","getRowPressProps","queryInFlight","t","knobProps","component","tableZebraOn","tableZebra","renderCell","index","rowData","Provider","inTableCell","isHeader","children","renderMobileCard","row","_ref","original","visibleCells","getVisibleCells","titleCell","detailCells","showDelete","bare","figures","controls","_iteratorNormalCompletion","_didIteratorError","_iteratorError","_iterator","Symbol","iterator","_step","next","done","kind","push","err","return","hasBody","length","testID","cardSurface","backgroundColor","alignItems","gap","paddingBottom","marginBottom","bottom","borderBottomColor","checked","getIsSelected","onChange","toggleSelected","checkboxProps","flex","minWidth","accessibilityLabel","fontSize","sizeToken","color","fontWeight","chromeless","circular","size","icon","onPress","flexWrap","map","cell2","i","flexShrink","accessibilityElementsHidden","importantForAccessibility","paddingTop"],"sources":["../../../../src/components/DataTable/DataTableMobileCards.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}
|
|
@@ -5,7 +5,7 @@ import { FlashList } from "@shopify/flash-list";
|
|
|
5
5
|
import { AsyncBoundary, EmptyState, useDirection } from "@multiplatform.one/components";
|
|
6
6
|
import { Button, Field, useFormField } from "@multiplatform.one/forms";
|
|
7
7
|
import { flexRender } from "@tanstack/react-table";
|
|
8
|
-
import {
|
|
8
|
+
import { useResolvedKnobs } from "@multiplatform.one/theme";
|
|
9
9
|
import React, { useRef, useMemo, useCallback } from "react";
|
|
10
10
|
import { ScrollView, Text, View, useMedia, withStaticProperties } from "tamagui";
|
|
11
11
|
import { useTranslation } from "react-i18next";
|
|
@@ -25,6 +25,7 @@ import { DataTableCell } from "../DataTableCell/index.native.js";
|
|
|
25
25
|
import { Table } from "@multiplatform.one/table-primitives";
|
|
26
26
|
import { DataTableContext } from "./DataTableContext.native.js";
|
|
27
27
|
import { DataTableDocumentList } from "./DataTableDocumentList.native.js";
|
|
28
|
+
import { DataTableMobileCards } from "./DataTableMobileCards.native.js";
|
|
28
29
|
import { dataTableChrome, resolveDataTableIntent, rowIntentProps } from "./dataTableChrome.native.js";
|
|
29
30
|
import { tableRowStateProps } from "./rowStateChrome.native.js";
|
|
30
31
|
import { DataTableStateContext } from "./DataTableStateContext.native.js";
|
|
@@ -103,6 +104,8 @@ function DataTableRoot(param) {
|
|
|
103
104
|
virtualizationOverscan = 5,
|
|
104
105
|
enableRowExpansion = false,
|
|
105
106
|
renderSubComponent,
|
|
107
|
+
enableRowSelection = false,
|
|
108
|
+
selectAllScope: selectAllScopeProp,
|
|
106
109
|
enableColumnPinning = false,
|
|
107
110
|
maxPinnedColumns = 3,
|
|
108
111
|
enableKeyboardNavigation: _enableKeyboardNavigation = false,
|
|
@@ -160,6 +163,7 @@ function DataTableRoot(param) {
|
|
|
160
163
|
compact
|
|
161
164
|
});
|
|
162
165
|
var chrome = dataTableChrome(String(knobProps.sizeToken));
|
|
166
|
+
var selectAllScope = selectAllScopeProp !== null && selectAllScopeProp !== void 0 ? selectAllScopeProp : knobProps.selectAllScope === "filtered" ? "filtered" : "page";
|
|
163
167
|
var rowHeightPx = chrome.rowPx;
|
|
164
168
|
var isRTL = useDirection() === "rtl";
|
|
165
169
|
var ExpandCaretIcon = isRTL ? CaretLeftIcon : CaretRightIcon;
|
|
@@ -199,6 +203,7 @@ function DataTableRoot(param) {
|
|
|
199
203
|
virtualizationOverscan,
|
|
200
204
|
enableRowExpansion,
|
|
201
205
|
renderSubComponent,
|
|
206
|
+
enableRowSelection,
|
|
202
207
|
enableColumnPinning,
|
|
203
208
|
maxPinnedColumns,
|
|
204
209
|
enableKeyboardNavigation: false,
|
|
@@ -207,6 +212,15 @@ function DataTableRoot(param) {
|
|
|
207
212
|
isLoading: isLoadingProp,
|
|
208
213
|
isFetching: isFetchingProp
|
|
209
214
|
});
|
|
215
|
+
var selectAllChecked = enableRowSelection && (selectAllScope === "filtered" ? table.getIsAllRowsSelected() : table.getIsAllPageRowsSelected());
|
|
216
|
+
var selectAllIndeterminate = enableRowSelection && (selectAllScope === "filtered" ? table.getIsSomeRowsSelected() && !table.getIsAllRowsSelected() : table.getIsSomePageRowsSelected() && !table.getIsAllPageRowsSelected());
|
|
217
|
+
var toggleSelectAll = useCallback(function () {
|
|
218
|
+
if (selectAllScope === "filtered") {
|
|
219
|
+
table.toggleAllRowsSelected();
|
|
220
|
+
} else {
|
|
221
|
+
table.toggleAllPageRowsSelected();
|
|
222
|
+
}
|
|
223
|
+
}, [selectAllScope, table]);
|
|
210
224
|
var resolvedSize = size !== null && size !== void 0 ? size : knobProps.sizeToken === "$3" ? "sm" : knobProps.sizeToken === "$5" ? "lg" : "md";
|
|
211
225
|
var cellHeight = resolvedSize === "sm" ? "$6" : resolvedSize === "lg" ? "$10" : "$8";
|
|
212
226
|
var headerGroups = table.getHeaderGroups();
|
|
@@ -394,7 +408,7 @@ function DataTableRoot(param) {
|
|
|
394
408
|
}, [showRowNumbers, enableRowExpansion, showDeleteRow, readOnly, disabled, cellHeight, knobProps.sizeToken, getColSizeProps, renderCellContent, handleDeleteRow, data.length, minRows, t, ExpandCaretIcon, expandedCaretRotation]);
|
|
395
409
|
var tableZebraOn = knobProps.tableZebra === "on";
|
|
396
410
|
var rowPressActive = Boolean(onRowPress) && !disabled;
|
|
397
|
-
var
|
|
411
|
+
var deriveRowIdentity = useCallback(function (row) {
|
|
398
412
|
var fromAccessor = rowLabel === null || rowLabel === void 0 ? void 0 : rowLabel(row.original);
|
|
399
413
|
if (fromAccessor) return fromAccessor;
|
|
400
414
|
var firstCellValue;
|
|
@@ -407,13 +421,30 @@ function DataTableRoot(param) {
|
|
|
407
421
|
if (typeof firstCellValue === "string" && firstCellValue.length > 0 || typeof firstCellValue === "number") {
|
|
408
422
|
return String(firstCellValue);
|
|
409
423
|
}
|
|
410
|
-
return
|
|
424
|
+
return void 0;
|
|
425
|
+
}, [rowLabel]);
|
|
426
|
+
var deriveRowLabel = useCallback(function (row, index) {
|
|
427
|
+
var _deriveRowIdentity;
|
|
428
|
+
return (_deriveRowIdentity = deriveRowIdentity(row)) !== null && _deriveRowIdentity !== void 0 ? _deriveRowIdentity : withInterp(t("Row {{row}}", {
|
|
411
429
|
row: index + 1
|
|
412
430
|
}), {
|
|
413
431
|
row: index + 1
|
|
414
432
|
});
|
|
415
|
-
}, [
|
|
416
|
-
var
|
|
433
|
+
}, [deriveRowIdentity, t]);
|
|
434
|
+
var deriveSelectRowLabel = useCallback(function (row, index) {
|
|
435
|
+
var _deriveRowIdentity;
|
|
436
|
+
var identity = (_deriveRowIdentity = deriveRowIdentity(row)) !== null && _deriveRowIdentity !== void 0 ? _deriveRowIdentity : String(index + 1);
|
|
437
|
+
return withInterp(t("Select row {{row}}", {
|
|
438
|
+
row: identity
|
|
439
|
+
}), {
|
|
440
|
+
row: identity
|
|
441
|
+
});
|
|
442
|
+
}, [deriveRowIdentity, t]);
|
|
443
|
+
var getRowPressProps = useCallback(
|
|
444
|
+
// The card list asks for the "card" variant. Native carries no DOM row
|
|
445
|
+
// role for it to override, so both variants land on role="button".
|
|
446
|
+
function (row, index) {
|
|
447
|
+
var _variant = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : "row";
|
|
417
448
|
if (!rowPressActive) return {};
|
|
418
449
|
return {
|
|
419
450
|
onPress: function onPress() {
|
|
@@ -449,86 +480,6 @@ function DataTableRoot(param) {
|
|
|
449
480
|
...rowIntentProps(row.original)
|
|
450
481
|
}, renderRowContent(row, index));
|
|
451
482
|
}, [renderRowContent, tableZebraOn, t, getRowPressProps]);
|
|
452
|
-
var renderMobileCard = useCallback(function (row, index, onDelete) {
|
|
453
|
-
var rowData = row.original;
|
|
454
|
-
var visibleCells = row.getVisibleCells();
|
|
455
|
-
return /* @__PURE__ */_jsxs(View, {
|
|
456
|
-
backgroundColor: "$color1",
|
|
457
|
-
borderRadius: "$4",
|
|
458
|
-
borderWidth: 1,
|
|
459
|
-
borderColor: "$borderColor",
|
|
460
|
-
padding: "$3",
|
|
461
|
-
marginBottom: "$2",
|
|
462
|
-
...getRowPressProps(row, index),
|
|
463
|
-
...rowIntentProps(rowData),
|
|
464
|
-
children: [showRowNumbers && /* @__PURE__ */_jsxs(View, {
|
|
465
|
-
flexDirection: "row",
|
|
466
|
-
justifyContent: "space-between",
|
|
467
|
-
paddingBottom: "$2",
|
|
468
|
-
...hairline.bottom,
|
|
469
|
-
borderBottomColor: "$borderColor",
|
|
470
|
-
marginBottom: "$2",
|
|
471
|
-
children: [/* @__PURE__ */_jsxs(Text, {
|
|
472
|
-
fontSize: "$3",
|
|
473
|
-
color: "$color10",
|
|
474
|
-
fontWeight: "600",
|
|
475
|
-
children: ["#", index + 1]
|
|
476
|
-
}), showDeleteRow && !readOnly && /* @__PURE__ */_jsx(Button, {
|
|
477
|
-
chromeless: true,
|
|
478
|
-
circular: true,
|
|
479
|
-
size: "$2",
|
|
480
|
-
icon: TrashIcon,
|
|
481
|
-
disabled: disabled || tableRows.length <= minRows,
|
|
482
|
-
onPress: function onPress() {
|
|
483
|
-
return onDelete === null || onDelete === void 0 ? void 0 : onDelete(index);
|
|
484
|
-
},
|
|
485
|
-
"aria-label": withInterp(t("Delete row {{row}}", {
|
|
486
|
-
row: index + 1
|
|
487
|
-
}), {
|
|
488
|
-
row: index + 1
|
|
489
|
-
})
|
|
490
|
-
})]
|
|
491
|
-
}), visibleCells.map(function (cell) {
|
|
492
|
-
var columnDef = cell.column.columnDef;
|
|
493
|
-
var headerLabel = typeof columnDef.header === "string" ? columnDef.header : columnDef.id || cell.column.id;
|
|
494
|
-
return /* @__PURE__ */_jsxs(View, {
|
|
495
|
-
flexDirection: "row",
|
|
496
|
-
alignItems: "center",
|
|
497
|
-
paddingVertical: "$1.5",
|
|
498
|
-
gap: "$2",
|
|
499
|
-
children: [/* @__PURE__ */_jsx(Text, {
|
|
500
|
-
fontSize: "$3",
|
|
501
|
-
color: "$color10",
|
|
502
|
-
fontWeight: "500",
|
|
503
|
-
width: "40%",
|
|
504
|
-
flexShrink: 0,
|
|
505
|
-
children: headerLabel
|
|
506
|
-
}), /* @__PURE__ */_jsx(View, {
|
|
507
|
-
flex: 1,
|
|
508
|
-
children: renderCellContent(cell, index, rowData)
|
|
509
|
-
})]
|
|
510
|
-
}, cell.id);
|
|
511
|
-
}), !showRowNumbers && showDeleteRow && !readOnly && /* @__PURE__ */_jsx(View, {
|
|
512
|
-
paddingTop: "$2",
|
|
513
|
-
alignItems: "flex-end",
|
|
514
|
-
children: /* @__PURE__ */_jsx(Button, {
|
|
515
|
-
chromeless: true,
|
|
516
|
-
circular: true,
|
|
517
|
-
size: "$2",
|
|
518
|
-
icon: TrashIcon,
|
|
519
|
-
disabled: disabled || tableRows.length <= minRows,
|
|
520
|
-
onPress: function onPress() {
|
|
521
|
-
return onDelete === null || onDelete === void 0 ? void 0 : onDelete(index);
|
|
522
|
-
},
|
|
523
|
-
"aria-label": withInterp(t("Delete row {{row}}", {
|
|
524
|
-
row: index + 1
|
|
525
|
-
}), {
|
|
526
|
-
row: index + 1
|
|
527
|
-
})
|
|
528
|
-
})
|
|
529
|
-
})]
|
|
530
|
-
}, `${row.id}-${index}`);
|
|
531
|
-
}, [showRowNumbers, showDeleteRow, readOnly, disabled, tableRows.length, minRows, renderCellContent, t, getRowPressProps]);
|
|
532
483
|
var renderToolbarComponent = function renderToolbarComponent2() {
|
|
533
484
|
if (renderToolbar) {
|
|
534
485
|
return renderToolbar({
|
|
@@ -656,10 +607,12 @@ function DataTableRoot(param) {
|
|
|
656
607
|
})
|
|
657
608
|
}), showList ? /* @__PURE__ */_jsx(DataTableDocumentList, {
|
|
658
609
|
tableRows: displayRows,
|
|
610
|
+
enableRowSelection,
|
|
659
611
|
disabled,
|
|
660
612
|
hasActiveFilters: computed.hasActiveFilters,
|
|
661
613
|
renderCellContent,
|
|
662
614
|
compact: isCompact,
|
|
615
|
+
selectRowLabel: deriveSelectRowLabel,
|
|
663
616
|
queryInFlight,
|
|
664
617
|
...(rowPressActive ? {
|
|
665
618
|
getRowPressProps
|
|
@@ -667,14 +620,27 @@ function DataTableRoot(param) {
|
|
|
667
620
|
}) : showCards ? /* @__PURE__ */_jsxs(View, {
|
|
668
621
|
flexDirection: "column",
|
|
669
622
|
gap: "$2",
|
|
670
|
-
children: [
|
|
671
|
-
|
|
672
|
-
|
|
673
|
-
|
|
674
|
-
|
|
675
|
-
|
|
676
|
-
|
|
677
|
-
|
|
623
|
+
children: [/* @__PURE__ */_jsx(DataTableMobileCards, {
|
|
624
|
+
tableRows: displayRows,
|
|
625
|
+
enableRowSelection,
|
|
626
|
+
showRowNumbers,
|
|
627
|
+
showDeleteRow,
|
|
628
|
+
readOnly,
|
|
629
|
+
disabled,
|
|
630
|
+
dataLength: tableData.length,
|
|
631
|
+
minRows,
|
|
632
|
+
hasActiveFilters: computed.hasActiveFilters,
|
|
633
|
+
renderCellContent,
|
|
634
|
+
onDeleteRow: isFormMode ? effectiveHandleDeleteRow : handleDeleteRow,
|
|
635
|
+
selectAllChecked,
|
|
636
|
+
selectAllIndeterminate,
|
|
637
|
+
onToggleSelectAll: toggleSelectAll,
|
|
638
|
+
compact: isCompact,
|
|
639
|
+
selectRowLabel: deriveSelectRowLabel,
|
|
640
|
+
queryInFlight,
|
|
641
|
+
...(rowPressActive ? {
|
|
642
|
+
getRowPressProps
|
|
643
|
+
} : {})
|
|
678
644
|
}), enablePagination && /* @__PURE__ */_jsx(View, {
|
|
679
645
|
width: "100%",
|
|
680
646
|
...(disabled ? disabledState.chromeKnobProps : {}),
|
|
@@ -863,7 +829,7 @@ function DataTableRoot(param) {
|
|
|
863
829
|
})
|
|
864
830
|
})
|
|
865
831
|
});
|
|
866
|
-
}, [resolvedSize, isCompact, stateContextValue, ariaLabel, ariaDescribedBy, knobProps, props, enableGlobalSearch, enableFiltering, enableViews, renderToolbarComponent, children, renderFilters, state, actions, columns, cellHeight, enablePagination, computed, table, extraColumnsBefore, extraColumnsAfter, headerGroups, showRowNumbers, enableRowExpansion, showDeleteRow, readOnly, getColSizeProps, pinning, tableRows, isVirtualized, virtualizationHeight, virtualizationOverscan, renderRow,
|
|
832
|
+
}, [resolvedSize, isCompact, stateContextValue, ariaLabel, ariaDescribedBy, knobProps, props, enableGlobalSearch, enableFiltering, enableViews, renderToolbarComponent, children, renderFilters, state, actions, columns, cellHeight, enablePagination, computed, table, extraColumnsBefore, extraColumnsAfter, headerGroups, showRowNumbers, enableRowExpansion, showDeleteRow, readOnly, getColSizeProps, pinning, tableRows, isVirtualized, virtualizationHeight, virtualizationOverscan, renderRow, renderSubComponent, footerGroups, sm, showList, showCards, renderPaginationComponent, showAddRow, maxRows, isFormMode, handleAddRow, handleDeleteRow, minRows, defaultRow, disabled, disabledState, renderCellContent, rowPressActive, getRowPressProps, enableRowSelection, selectAllChecked, selectAllIndeterminate, toggleSelectAll, deriveSelectRowLabel, displayRows, queryInFlight, t]);
|
|
867
833
|
if (isFormMode) {
|
|
868
834
|
return /* @__PURE__ */_jsx(Field, {
|
|
869
835
|
form: resolvedForm,
|