@saasquatch/mint-components 2.4.1 → 2.4.2-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.
Files changed (33) hide show
  1. package/dist/cjs/{GenericTableView-be5648e4.js → GenericTableView-2a5a39c8.js} +40 -5
  2. package/dist/cjs/sqm-banking-info-form_10.cjs.entry.js +1 -1
  3. package/dist/cjs/sqm-referral-table_11.cjs.entry.js +1 -1
  4. package/dist/cjs/sqm-rewards-table_9.cjs.entry.js +1 -1
  5. package/dist/cjs/sqm-stencilbook.cjs.entry.js +1 -1
  6. package/dist/collection/tables/GenericTableView.js +40 -5
  7. package/dist/esm/{GenericTableView-8c72ac30.js → GenericTableView-2555736c.js} +40 -5
  8. package/dist/esm/sqm-banking-info-form_10.entry.js +1 -1
  9. package/dist/esm/sqm-referral-table_11.entry.js +1 -1
  10. package/dist/esm/sqm-rewards-table_9.entry.js +1 -1
  11. package/dist/esm/sqm-stencilbook.entry.js +1 -1
  12. package/dist/esm-es5/GenericTableView-2555736c.js +1 -0
  13. package/dist/esm-es5/sqm-banking-info-form_10.entry.js +1 -1
  14. package/dist/esm-es5/sqm-referral-table_11.entry.js +1 -1
  15. package/dist/esm-es5/sqm-rewards-table_9.entry.js +1 -1
  16. package/dist/esm-es5/sqm-stencilbook.entry.js +1 -1
  17. package/dist/mint-components/mint-components.esm.js +1 -1
  18. package/dist/mint-components/{p-f7218609.system.entry.js → p-0b177618.system.entry.js} +1 -1
  19. package/dist/mint-components/{p-3784c92c.system.entry.js → p-1fb6c81b.system.entry.js} +1 -1
  20. package/dist/mint-components/{p-7c657e1f.entry.js → p-32192739.entry.js} +1 -1
  21. package/dist/mint-components/p-471b9c1d.js +1 -0
  22. package/dist/mint-components/{p-241e7226.system.entry.js → p-515262c7.system.entry.js} +1 -1
  23. package/dist/mint-components/{p-2a2332a6.entry.js → p-672070dc.entry.js} +1 -1
  24. package/dist/mint-components/{p-933bae53.system.entry.js → p-b9648151.system.entry.js} +1 -1
  25. package/dist/mint-components/p-bfb00685.system.js +1 -1
  26. package/dist/mint-components/{p-2e33148c.entry.js → p-d9d9ae3c.entry.js} +1 -1
  27. package/dist/mint-components/p-e8793c49.system.js +1 -0
  28. package/dist/mint-components/{p-e2fb11af.entry.js → p-fa0146e5.entry.js} +1 -1
  29. package/docs/docs.docx +0 -0
  30. package/package.json +1 -1
  31. package/dist/esm-es5/GenericTableView-8c72ac30.js +0 -1
  32. package/dist/mint-components/p-b1eb2a6a.js +0 -1
  33. package/dist/mint-components/p-d5eb601d.system.js +0 -1
@@ -9,6 +9,9 @@ function GenericTableView(props) {
9
9
  const { columns, rows } = elements;
10
10
  const { show } = states;
11
11
  const hiddenCols = data.hiddenColumns && data.hiddenColumns.split(",").map(Number);
12
+ // Non-string columns are the editor's raisins plop targets, so the header has to stay rendered for them
13
+ const hasDropZones = !!(columns === null || columns === void 0 ? void 0 : columns.some((column) => typeof column !== "string"));
14
+ const showLabels = data.textOverrides.showLabels;
12
15
  const mobile = "@media (max-width: " + data.mdBreakpoint + "px)";
13
16
  const tablet = `@media (min-width: ${Boolean(rows.length < 2) ? data.mdBreakpoint : data.smBreakpoint}px) and (max-width: ${data.mdBreakpoint}px)`;
14
17
  // Due to mobile media queries being dependant on props, not feasiable to move out of render function
@@ -29,6 +32,13 @@ function GenericTableView(props) {
29
32
  fontWeight: "var(--sl-font-weight-semibold)",
30
33
  overflowWrap: "anywhere",
31
34
  },
35
+ "& th.collapsed": {
36
+ fontSize: "0",
37
+ padding: "14px 0",
38
+ },
39
+ "& th.drop-zone": {
40
+ width: "30px",
41
+ },
32
42
  "& td": {
33
43
  padding: "var(--sl-spacing-small)",
34
44
  paddingLeft: "0",
@@ -36,10 +46,35 @@ function GenericTableView(props) {
36
46
  textOverflow: "ellipsis",
37
47
  },
38
48
  [mobile]: {
49
+ // Body rows become blocks here, so the header has to leave the table layout to stay full width
39
50
  "& thead": {
51
+ display: hasDropZones ? "block" : "none",
52
+ },
53
+ // Columns read top-to-bottom inside a card, so the drop zones between them stack the same way
54
+ "& thead tr": {
55
+ display: "flex",
56
+ flexDirection: "column",
57
+ },
58
+ "& thead th.label": {
59
+ padding: "0",
60
+ lineHeight: "20px",
61
+ fontSize: "var(--sl-font-size-small)",
62
+ color: "var(--sl-color-neutral-500)",
63
+ },
64
+ "& thead th.drop-zone": {
65
+ width: "auto",
66
+ padding: "14px 0",
67
+ lineHeight: "0",
68
+ position: "relative",
69
+ },
70
+ // The plop target is inline-styled position:absolute, so it needs the cell as its containing block to span it
71
+ "& thead th.drop-zone slot::slotted(raisins-plop-target)": {
72
+ width: "100%",
73
+ },
74
+ "& tbody td.drop-zone": {
40
75
  display: "none",
41
76
  },
42
- "& tr": {
77
+ "& tbody tr": {
43
78
  display: "block",
44
79
  background: "inherit",
45
80
  border: "var(--sqm-border-thickness, 1px) solid var(--sqm-border-color)",
@@ -96,11 +131,11 @@ function GenericTableView(props) {
96
131
  return (index.h("div", null,
97
132
  index.h("style", { type: "text/css" }, styleString),
98
133
  index.h("table", { class: sheet.classes.Table },
99
- data.textOverrides.showLabels && (index.h("thead", null,
134
+ (showLabels || hasDropZones) && (index.h("thead", null,
100
135
  index.h("tr", null, columns === null || columns === void 0 ? void 0 : columns.map((column) => {
101
136
  if (typeof column === "string")
102
- return index.h("th", null, column);
103
- return index.h("th", { style: { width: "30px" } }, column);
137
+ return (index.h("th", { class: showLabels ? "label" : "collapsed" }, column));
138
+ return index.h("th", { class: "drop-zone" }, column);
104
139
  })))),
105
140
  index.h("tbody", null,
106
141
  show === "loading" && elements.loadingElement,
@@ -111,7 +146,7 @@ function GenericTableView(props) {
111
146
  return typeof columns[j] === "string" ? (index.h("td", { class: (hiddenCols === null || hiddenCols === void 0 ? void 0 : hiddenCols.includes(j)) ? "hidden" : "", "data-label": columns[j] + ":", style: {
112
147
  gridTemplateColumns: (hiddenCols === null || hiddenCols === void 0 ? void 0 : hiddenCols.includes(j)) ? "1fr"
113
148
  : "0.5fr 0.5fr",
114
- } }, cell)) : (index.h("td", null, cell));
149
+ } }, cell)) : (index.h("td", { class: "drop-zone" }, cell));
115
150
  })));
116
151
  })))),
117
152
  index.h("div", { class: sheet.classes.ButtonContainer, part: states.namespace + "-button-wrapper" },
@@ -13,7 +13,7 @@ const JSS = require('./JSS-8503a151.js');
13
13
  require('./mixins-4761d472.js');
14
14
  require('./AsYouType-d15caac8.js');
15
15
  const subregions = require('./subregions-3d27e279.js');
16
- const GenericTableView = require('./GenericTableView-be5648e4.js');
16
+ const GenericTableView = require('./GenericTableView-2a5a39c8.js');
17
17
  const reRender = require('./re-render-72a0ef45.js');
18
18
  const useChildElements = require('./useChildElements-041127d7.js');
19
19
  const luxon = require('./luxon-c1ad356a.js');
@@ -11,7 +11,7 @@ const utils = require('./utils-6847bc06.js');
11
11
  const JSS = require('./JSS-8503a151.js');
12
12
  require('./mixins-4761d472.js');
13
13
  const sqmTextSpanView = require('./sqm-text-span-view-b9e10f5d.js');
14
- const GenericTableView = require('./GenericTableView-be5648e4.js');
14
+ const GenericTableView = require('./GenericTableView-2a5a39c8.js');
15
15
  const reRender = require('./re-render-72a0ef45.js');
16
16
  const useChildElements = require('./useChildElements-041127d7.js');
17
17
  const luxon = require('./luxon-c1ad356a.js');
@@ -10,7 +10,7 @@ const cjs = require('./cjs-1066ec21.js');
10
10
  const utils = require('./utils-6847bc06.js');
11
11
  const JSS = require('./JSS-8503a151.js');
12
12
  require('./mixins-4761d472.js');
13
- const GenericTableView = require('./GenericTableView-be5648e4.js');
13
+ const GenericTableView = require('./GenericTableView-2a5a39c8.js');
14
14
  const reRender = require('./re-render-72a0ef45.js');
15
15
  const useChildElements = require('./useChildElements-041127d7.js');
16
16
  const luxon = require('./luxon-c1ad356a.js');
@@ -17,7 +17,7 @@ const sqmPortalVerifyEmailView = require('./sqm-portal-verify-email-view-717d063
17
17
  require('./AsYouType-d15caac8.js');
18
18
  const subregions = require('./subregions-3d27e279.js');
19
19
  const sqmPortalRegistrationFormView = require('./sqm-portal-registration-form-view-a45f7a52.js');
20
- const GenericTableView = require('./GenericTableView-be5648e4.js');
20
+ const GenericTableView = require('./GenericTableView-2a5a39c8.js');
21
21
  require('./useChildElements-041127d7.js');
22
22
  const luxon = require('./luxon-c1ad356a.js');
23
23
  const sqmCloseButtonView = require('./sqm-close-button-view-e9f2a454.js');
@@ -6,6 +6,9 @@ export function GenericTableView(props) {
6
6
  const { columns, rows } = elements;
7
7
  const { show } = states;
8
8
  const hiddenCols = data.hiddenColumns && data.hiddenColumns.split(",").map(Number);
9
+ // Non-string columns are the editor's raisins plop targets, so the header has to stay rendered for them
10
+ const hasDropZones = !!(columns === null || columns === void 0 ? void 0 : columns.some((column) => typeof column !== "string"));
11
+ const showLabels = data.textOverrides.showLabels;
9
12
  const mobile = "@media (max-width: " + data.mdBreakpoint + "px)";
10
13
  const tablet = `@media (min-width: ${Boolean(rows.length < 2) ? data.mdBreakpoint : data.smBreakpoint}px) and (max-width: ${data.mdBreakpoint}px)`;
11
14
  // Due to mobile media queries being dependant on props, not feasiable to move out of render function
@@ -26,6 +29,13 @@ export function GenericTableView(props) {
26
29
  fontWeight: "var(--sl-font-weight-semibold)",
27
30
  overflowWrap: "anywhere",
28
31
  },
32
+ "& th.collapsed": {
33
+ fontSize: "0",
34
+ padding: "14px 0",
35
+ },
36
+ "& th.drop-zone": {
37
+ width: "30px",
38
+ },
29
39
  "& td": {
30
40
  padding: "var(--sl-spacing-small)",
31
41
  paddingLeft: "0",
@@ -33,10 +43,35 @@ export function GenericTableView(props) {
33
43
  textOverflow: "ellipsis",
34
44
  },
35
45
  [mobile]: {
46
+ // Body rows become blocks here, so the header has to leave the table layout to stay full width
36
47
  "& thead": {
48
+ display: hasDropZones ? "block" : "none",
49
+ },
50
+ // Columns read top-to-bottom inside a card, so the drop zones between them stack the same way
51
+ "& thead tr": {
52
+ display: "flex",
53
+ flexDirection: "column",
54
+ },
55
+ "& thead th.label": {
56
+ padding: "0",
57
+ lineHeight: "20px",
58
+ fontSize: "var(--sl-font-size-small)",
59
+ color: "var(--sl-color-neutral-500)",
60
+ },
61
+ "& thead th.drop-zone": {
62
+ width: "auto",
63
+ padding: "14px 0",
64
+ lineHeight: "0",
65
+ position: "relative",
66
+ },
67
+ // The plop target is inline-styled position:absolute, so it needs the cell as its containing block to span it
68
+ "& thead th.drop-zone slot::slotted(raisins-plop-target)": {
69
+ width: "100%",
70
+ },
71
+ "& tbody td.drop-zone": {
37
72
  display: "none",
38
73
  },
39
- "& tr": {
74
+ "& tbody tr": {
40
75
  display: "block",
41
76
  background: "inherit",
42
77
  border: "var(--sqm-border-thickness, 1px) solid var(--sqm-border-color)",
@@ -93,11 +128,11 @@ export function GenericTableView(props) {
93
128
  return (h("div", null,
94
129
  h("style", { type: "text/css" }, styleString),
95
130
  h("table", { class: sheet.classes.Table },
96
- data.textOverrides.showLabels && (h("thead", null,
131
+ (showLabels || hasDropZones) && (h("thead", null,
97
132
  h("tr", null, columns === null || columns === void 0 ? void 0 : columns.map((column) => {
98
133
  if (typeof column === "string")
99
- return h("th", null, column);
100
- return h("th", { style: { width: "30px" } }, column);
134
+ return (h("th", { class: showLabels ? "label" : "collapsed" }, column));
135
+ return h("th", { class: "drop-zone" }, column);
101
136
  })))),
102
137
  h("tbody", null,
103
138
  show === "loading" && elements.loadingElement,
@@ -108,7 +143,7 @@ export function GenericTableView(props) {
108
143
  return typeof columns[j] === "string" ? (h("td", { class: (hiddenCols === null || hiddenCols === void 0 ? void 0 : hiddenCols.includes(j)) ? "hidden" : "", "data-label": columns[j] + ":", style: {
109
144
  gridTemplateColumns: (hiddenCols === null || hiddenCols === void 0 ? void 0 : hiddenCols.includes(j)) ? "1fr"
110
145
  : "0.5fr 0.5fr",
111
- } }, cell)) : (h("td", null, cell));
146
+ } }, cell)) : (h("td", { class: "drop-zone" }, cell));
112
147
  })));
113
148
  })))),
114
149
  h("div", { class: sheet.classes.ButtonContainer, part: states.namespace + "-button-wrapper" },
@@ -7,6 +7,9 @@ function GenericTableView(props) {
7
7
  const { columns, rows } = elements;
8
8
  const { show } = states;
9
9
  const hiddenCols = data.hiddenColumns && data.hiddenColumns.split(",").map(Number);
10
+ // Non-string columns are the editor's raisins plop targets, so the header has to stay rendered for them
11
+ const hasDropZones = !!(columns === null || columns === void 0 ? void 0 : columns.some((column) => typeof column !== "string"));
12
+ const showLabels = data.textOverrides.showLabels;
10
13
  const mobile = "@media (max-width: " + data.mdBreakpoint + "px)";
11
14
  const tablet = `@media (min-width: ${Boolean(rows.length < 2) ? data.mdBreakpoint : data.smBreakpoint}px) and (max-width: ${data.mdBreakpoint}px)`;
12
15
  // Due to mobile media queries being dependant on props, not feasiable to move out of render function
@@ -27,6 +30,13 @@ function GenericTableView(props) {
27
30
  fontWeight: "var(--sl-font-weight-semibold)",
28
31
  overflowWrap: "anywhere",
29
32
  },
33
+ "& th.collapsed": {
34
+ fontSize: "0",
35
+ padding: "14px 0",
36
+ },
37
+ "& th.drop-zone": {
38
+ width: "30px",
39
+ },
30
40
  "& td": {
31
41
  padding: "var(--sl-spacing-small)",
32
42
  paddingLeft: "0",
@@ -34,10 +44,35 @@ function GenericTableView(props) {
34
44
  textOverflow: "ellipsis",
35
45
  },
36
46
  [mobile]: {
47
+ // Body rows become blocks here, so the header has to leave the table layout to stay full width
37
48
  "& thead": {
49
+ display: hasDropZones ? "block" : "none",
50
+ },
51
+ // Columns read top-to-bottom inside a card, so the drop zones between them stack the same way
52
+ "& thead tr": {
53
+ display: "flex",
54
+ flexDirection: "column",
55
+ },
56
+ "& thead th.label": {
57
+ padding: "0",
58
+ lineHeight: "20px",
59
+ fontSize: "var(--sl-font-size-small)",
60
+ color: "var(--sl-color-neutral-500)",
61
+ },
62
+ "& thead th.drop-zone": {
63
+ width: "auto",
64
+ padding: "14px 0",
65
+ lineHeight: "0",
66
+ position: "relative",
67
+ },
68
+ // The plop target is inline-styled position:absolute, so it needs the cell as its containing block to span it
69
+ "& thead th.drop-zone slot::slotted(raisins-plop-target)": {
70
+ width: "100%",
71
+ },
72
+ "& tbody td.drop-zone": {
38
73
  display: "none",
39
74
  },
40
- "& tr": {
75
+ "& tbody tr": {
41
76
  display: "block",
42
77
  background: "inherit",
43
78
  border: "var(--sqm-border-thickness, 1px) solid var(--sqm-border-color)",
@@ -94,11 +129,11 @@ function GenericTableView(props) {
94
129
  return (h("div", null,
95
130
  h("style", { type: "text/css" }, styleString),
96
131
  h("table", { class: sheet.classes.Table },
97
- data.textOverrides.showLabels && (h("thead", null,
132
+ (showLabels || hasDropZones) && (h("thead", null,
98
133
  h("tr", null, columns === null || columns === void 0 ? void 0 : columns.map((column) => {
99
134
  if (typeof column === "string")
100
- return h("th", null, column);
101
- return h("th", { style: { width: "30px" } }, column);
135
+ return (h("th", { class: showLabels ? "label" : "collapsed" }, column));
136
+ return h("th", { class: "drop-zone" }, column);
102
137
  })))),
103
138
  h("tbody", null,
104
139
  show === "loading" && elements.loadingElement,
@@ -109,7 +144,7 @@ function GenericTableView(props) {
109
144
  return typeof columns[j] === "string" ? (h("td", { class: (hiddenCols === null || hiddenCols === void 0 ? void 0 : hiddenCols.includes(j)) ? "hidden" : "", "data-label": columns[j] + ":", style: {
110
145
  gridTemplateColumns: (hiddenCols === null || hiddenCols === void 0 ? void 0 : hiddenCols.includes(j)) ? "1fr"
111
146
  : "0.5fr 0.5fr",
112
- } }, cell)) : (h("td", null, cell));
147
+ } }, cell)) : (h("td", { class: "drop-zone" }, cell));
113
148
  })));
114
149
  })))),
115
150
  h("div", { class: sheet.classes.ButtonContainer, part: states.namespace + "-button-wrapper" },
@@ -9,7 +9,7 @@ import { c as createStyleSheet } from './JSS-67b5cff8.js';
9
9
  import './mixins-f750863a.js';
10
10
  import './AsYouType-2d56519e.js';
11
11
  import { t as taxTypeToName, b as validTaxDocument, I as INDIRECT_TAX_SPAIN_REGIONS, a as INDIRECT_TAX_PROVINCES, o as objectIsFull, c as toDomesticNumber, A as ADDRESS_REGIONS } from './subregions-810a5c2d.js';
12
- import { G as GenericTableView } from './GenericTableView-8c72ac30.js';
12
+ import { G as GenericTableView } from './GenericTableView-2555736c.js';
13
13
  import { u as useRerenderListener, a as useRequestRerender } from './re-render-bf46ba54.js';
14
14
  import { u as useChildElements } from './useChildElements-06937df7.js';
15
15
  import { l as luxon } from './luxon-1be92a8e.js';
@@ -7,7 +7,7 @@ import { l as luxonLocale } from './utils-334c1e34.js';
7
7
  import { c as createStyleSheet } from './JSS-67b5cff8.js';
8
8
  import './mixins-f750863a.js';
9
9
  import { T as TextSpanView } from './sqm-text-span-view-72f43dff.js';
10
- import { G as GenericTableView } from './GenericTableView-8c72ac30.js';
10
+ import { G as GenericTableView } from './GenericTableView-2555736c.js';
11
11
  import { a as useRequestRerender, u as useRerenderListener } from './re-render-bf46ba54.js';
12
12
  import { u as useChildElements } from './useChildElements-06937df7.js';
13
13
  import { l as luxon } from './luxon-1be92a8e.js';
@@ -6,7 +6,7 @@ import { c as cjs } from './cjs-bdfb4486.js';
6
6
  import { l as luxonLocale } from './utils-334c1e34.js';
7
7
  import { c as createStyleSheet } from './JSS-67b5cff8.js';
8
8
  import './mixins-f750863a.js';
9
- import { G as GenericTableView } from './GenericTableView-8c72ac30.js';
9
+ import { G as GenericTableView } from './GenericTableView-2555736c.js';
10
10
  import { u as useRerenderListener, a as useRequestRerender } from './re-render-bf46ba54.js';
11
11
  import { u as useChildElements } from './useChildElements-06937df7.js';
12
12
  import { l as luxon } from './luxon-1be92a8e.js';
@@ -13,7 +13,7 @@ import { b as PortalRegisterView, P as PortalForgotPasswordView, a as PortalLogi
13
13
  import './AsYouType-2d56519e.js';
14
14
  import { t as taxTypeToName, L as LoadingView, I as INDIRECT_TAX_SPAIN_REGIONS, a as INDIRECT_TAX_PROVINCES } from './subregions-810a5c2d.js';
15
15
  import { P as PortalRegistrationFormView } from './sqm-portal-registration-form-view-79265df5.js';
16
- import { G as GenericTableView } from './GenericTableView-8c72ac30.js';
16
+ import { G as GenericTableView } from './GenericTableView-2555736c.js';
17
17
  import './useChildElements-06937df7.js';
18
18
  import { l as luxon } from './luxon-1be92a8e.js';
19
19
  import { C as CloseButtonView } from './sqm-close-button-view-fd9012e7.js';
@@ -0,0 +1 @@
1
+ var __assign=this&&this.__assign||function(){__assign=Object.assign||function(e){for(var t,a=1,r=arguments.length;a<r;a++){t=arguments[a];for(var o in t)if(Object.prototype.hasOwnProperty.call(t,o))e[o]=t[o]}return e};return __assign.apply(this,arguments)};import{h}from"./index-38ad4957.js";import{c as createStyleSheet}from"./JSS-67b5cff8.js";import{g as gap}from"./mixins-f750863a.js";function GenericTableView(e){var t;var a=e.states,r=e.data,o=e.callbacks,s=e.elements;var l=s.columns,i=s.rows;var n=a.show;var d=r.hiddenColumns&&r.hiddenColumns.split(",").map(Number);var p=!!(l===null||l===void 0?void 0:l.some((function(e){return typeof e!=="string"})));var c=r.textOverrides.showLabels;var m="@media (max-width: "+r.mdBreakpoint+"px)";var b="@media (min-width: "+(Boolean(i.length<2)?r.mdBreakpoint:r.smBreakpoint)+"px) and (max-width: "+r.mdBreakpoint+"px)";var g={Table:(t={borderCollapse:"collapse",tableLayout:"fixed",width:"100%","& tbody tr":{borderBottom:"var(--sqm-border-thickness, 1px) solid var(--sqm-border-color)","&:first-child":{borderTop:"var(--sqm-border-thickness, 1px) solid var(--sqm-border-color)"}},"& th":{paddingBottom:"var(--sl-spacing-small)",textAlign:"left",fontWeight:"var(--sl-font-weight-semibold)",overflowWrap:"anywhere"},"& th.collapsed":{fontSize:"0",padding:"14px 0"},"& th.drop-zone":{width:"30px"},"& td":{padding:"var(--sl-spacing-small)",paddingLeft:"0",overflow:"hidden",textOverflow:"ellipsis"}},t[m]={"& thead":{display:p?"block":"none"},"& thead tr":{display:"flex",flexDirection:"column"},"& thead th.label":{padding:"0",lineHeight:"20px",fontSize:"var(--sl-font-size-small)",color:"var(--sl-color-neutral-500)"},"& thead th.drop-zone":{width:"auto",padding:"14px 0",lineHeight:"0",position:"relative"},"& thead th.drop-zone slot::slotted(raisins-plop-target)":{width:"100%"},"& tbody td.drop-zone":{display:"none"},"& tbody tr":{display:"block",background:"inherit",border:"var(--sqm-border-thickness, 1px) solid var(--sqm-border-color)",boxShadow:"0px 2px 4px rgba(0, 0, 0, 0.1)",borderRadius:"var(--sl-border-radius-large)",padding:"var(--sl-spacing-medium)",fontSize:"var(--sl-font-size-small)",marginBottom:"var(--sl-spacing-large)"},"& td":{display:"grid",borderTop:"none",padding:"0",marginBottom:"var(--sl-spacing-medium)","&:first-child":{textAlign:"left"},"&:before":{content:"attr(data-label)",whiteSpace:"nowrap"},"&:last-child":{marginBottom:"0"},"&.hidden:before":{content:"none"}}},t[b]={"& tbody":{display:"grid",gridTemplateColumns:"0.5fr 0.5fr",gap:"25px"}},t),ButtonContainer:__assign({display:"flex","justify-content":"flex-end","margin-top":"var(--sl-spacing-small)"},gap({direction:"row",size:"var(--sl-spacing-small)"})),ButtonDisabled:{"&::part(base)":{opacity:"0.25"}}};var v=createStyleSheet(g);var u=v.toString();if(n==="empty")return s.emptyElement;return h("div",null,h("style",{type:"text/css"},u),h("table",{class:v.classes.Table},(c||p)&&h("thead",null,h("tr",null,l===null||l===void 0?void 0:l.map((function(e){if(typeof e==="string")return h("th",{class:c?"label":"collapsed"},e);return h("th",{class:"drop-zone"},e)})))),h("tbody",null,n==="loading"&&s.loadingElement,n==="rows"&&(i===null||i===void 0?void 0:i.map((function(e,t){return h("tr",{style:{borderTop:""+(!r.textOverrides.showLabels&&t===0?"none":"")},part:"table-row"},e.map((function(e,t){return typeof l[t]==="string"?h("td",{class:(d===null||d===void 0?void 0:d.includes(t))?"hidden":"","data-label":l[t]+":",style:{gridTemplateColumns:(d===null||d===void 0?void 0:d.includes(t))?"1fr":"0.5fr 0.5fr"}},e):h("td",{class:"drop-zone"},e)})))}))))),h("div",{class:v.classes.ButtonContainer,part:a.namespace+"-button-wrapper"},h("sl-button",{size:"small",disabled:!a.hasPrev,loading:n==="loading",onClick:o.prevPage,exportparts:"base: secondarybutton-base",class:!a.hasPrev?v.classes.ButtonDisabled:""},r.textOverrides.prevLabel),h("sl-button",{size:"small",loading:n==="loading",disabled:!a.hasNext,onClick:o.nextPage,exportparts:"base: secondarybutton-base",class:!a.hasNext?v.classes.ButtonDisabled:""},r.textOverrides.moreLabel)))}export{GenericTableView as G};