tcce-design-system 0.1.27 → 0.1.28

package/dist/tcce-design-system-components.js

@@ -12612,7 +12612,7 @@ const aw = C.div`
             background-color: var(--color-blue-400);
         `}
 `, Ma = C.div`
-    ${vu}
+    ${vu};
     justify-content: ${({ $align: e }) => e || "space-between"};
 `, bu = C.button`
     all: unset;
@@ -12974,28 +12974,30 @@ const Rw = (e) => {
       $active: !!l,
       colSpan: e.colSpan,
       $width: e.getSize(),
-      children: s ? /* @__PURE__ */ g(
-        bu,
-        {
-          onClick: e.column.getToggleSortingHandler(),
-          type: "button",
-          "aria-label": `Sort by ${Qn(e.column.columnDef.header, e.getContext())}`,
-          "aria-sort": c === "asc" ? "ascending" : c === "desc" ? "descending" : "none",
-          children: /* @__PURE__ */ g(Ma, { $align: i?.align, children: /* @__PURE__ */ M(Va, { children: [
-            Qn(e.column.columnDef.header, e.getContext()),
-            /* @__PURE__ */ g(uw, { $direction: c, children: c === "none" ? /* @__PURE__ */ g(J, { component: Z0, size: "tn" }) : /* @__PURE__ */ g(J, { component: Y0, size: "tn" }) }),
-            a && /* @__PURE__ */ g(
-              _o,
-              {
-                column: e.column,
-                uniqueValues: u,
-                selectedValues: r,
-                onChange: o
-              }
-            )
-          ] }) })
-        }
-      ) : /* @__PURE__ */ g(Ma, { $align: i?.align, children: /* @__PURE__ */ M(Va, { children: [
+      children: s ? /* @__PURE__ */ M("section", { className: "flex", onClick: e.column.getToggleSortingHandler(), children: [
+        /* @__PURE__ */ g(
+          bu,
+          {
+            onClick: e.column.getToggleSortingHandler(),
+            type: "button",
+            "aria-label": `Sort by ${Qn(e.column.columnDef.header, e.getContext())}`,
+            "aria-sort": c === "asc" ? "ascending" : c === "desc" ? "descending" : "none",
+            children: /* @__PURE__ */ g(Ma, { $align: i?.align, children: /* @__PURE__ */ M(Va, { children: [
+              Qn(e.column.columnDef.header, e.getContext()),
+              /* @__PURE__ */ g(uw, { $direction: c, children: c === "none" ? /* @__PURE__ */ g(J, { component: Z0, size: "tn" }) : /* @__PURE__ */ g(J, { component: Y0, size: "tn" }) })
+            ] }) })
+          }
+        ),
+        a && /* @__PURE__ */ g(
+          _o,
+          {
+            column: e.column,
+            uniqueValues: u,
+            selectedValues: r,
+            onChange: o
+          }
+        )
+      ] }) : /* @__PURE__ */ g(Ma, { $align: i?.align, children: /* @__PURE__ */ M(Va, { children: [
         Qn(e.column.columnDef.header, e.getContext()),
         a && /* @__PURE__ */ g(
           _o,
@@ -13049,8 +13051,8 @@ const Rw = (e) => {
     border-left: 1px solid var(--color-main-light-borders);
     border-top: 1px solid var(--color-main-light-borders);
     transition: background-color 0.3s ease-out;
-`, Mw = C.p`
-    ${vu}
+`, Mw = C.section`
+    ${vu};
     justify-content: ${({ $align: e }) => e === "center" ? "center" : e === "right" ? "flex-end" : "flex-start"};
 
     width: 100%;

package/dist/tcce-design-system-components.umd.cjs

@@ -1712,7 +1712,7 @@ See https://s-c.sh/2BAXzed for more info.`),window[Bn]+=1);const _r={80:T`
             background-color: var(--color-blue-400);
         `}
 `,Vu=k.div`
-    ${Mu}
+    ${Mu};
     justify-content: ${({$align:e})=>e||"space-between"};
 `,Du=k.button`
     all: unset;
@@ -1863,7 +1863,7 @@ See https://s-c.sh/2BAXzed for more info.`),window[Bn]+=1);const _r={80:T`
     align-items: center;
     gap: 0.25rem;
     width: 100%;
-`,Nu=({header:e})=>{const{size:t,getUniqueValues:n}=bn(),{selectedValues:r,handleChange:o}=pw(e.column.id),i=e.column.columnDef.meta,s=e.column.getCanSort()&&i?.sortable!==!1,a=i?.filterable!==!1&&e.column.getCanFilter(),l=e.column.getIsSorted(),c=l||"none",d=e.column.id,u=a?n(d):[];return g.jsx(ew,{$size:i?.size||t,$active:!!l,colSpan:e.colSpan,$width:e.getSize(),children:s?g.jsx(Du,{onClick:e.column.getToggleSortingHandler(),type:"button","aria-label":`Sort by ${mr(e.column.columnDef.header,e.getContext())}`,"aria-sort":c==="asc"?"ascending":c==="desc"?"descending":"none",children:g.jsx(Vu,{$align:i?.align,children:g.jsxs(_u,{children:[mr(e.column.columnDef.header,e.getContext()),g.jsx(tw,{$direction:c,children:c==="none"?g.jsx(K,{component:yy,size:"tn"}):g.jsx(K,{component:my,size:"tn"})}),a&&g.jsx(gr,{column:e.column,uniqueValues:u,selectedValues:r,onChange:o})]})})}):g.jsx(Vu,{$align:i?.align,children:g.jsxs(_u,{children:[mr(e.column.columnDef.header,e.getContext()),a&&g.jsx(gr,{column:e.column,uniqueValues:u,selectedValues:r,onChange:o})]})})})},Ou=({headerGroup:e})=>g.jsx(Au,{children:e.headers.map(t=>g.jsx(Nu,{header:t},t.id))}),Bu=({headerGroups:e,stickyHeader:t,className:n})=>g.jsx(Z1,{$sticky:t,className:n,children:e.map(r=>g.jsx(Ou,{headerGroup:r},r.id))}),mw={sm:T`
+`,Nu=({header:e})=>{const{size:t,getUniqueValues:n}=bn(),{selectedValues:r,handleChange:o}=pw(e.column.id),i=e.column.columnDef.meta,s=e.column.getCanSort()&&i?.sortable!==!1,a=i?.filterable!==!1&&e.column.getCanFilter(),l=e.column.getIsSorted(),c=l||"none",d=e.column.id,u=a?n(d):[];return g.jsx(ew,{$size:i?.size||t,$active:!!l,colSpan:e.colSpan,$width:e.getSize(),children:s?g.jsxs("section",{className:"flex",onClick:e.column.getToggleSortingHandler(),children:[g.jsx(Du,{onClick:e.column.getToggleSortingHandler(),type:"button","aria-label":`Sort by ${mr(e.column.columnDef.header,e.getContext())}`,"aria-sort":c==="asc"?"ascending":c==="desc"?"descending":"none",children:g.jsx(Vu,{$align:i?.align,children:g.jsxs(_u,{children:[mr(e.column.columnDef.header,e.getContext()),g.jsx(tw,{$direction:c,children:c==="none"?g.jsx(K,{component:yy,size:"tn"}):g.jsx(K,{component:my,size:"tn"})})]})})}),a&&g.jsx(gr,{column:e.column,uniqueValues:u,selectedValues:r,onChange:o})]}):g.jsx(Vu,{$align:i?.align,children:g.jsxs(_u,{children:[mr(e.column.columnDef.header,e.getContext()),a&&g.jsx(gr,{column:e.column,uniqueValues:u,selectedValues:r,onChange:o})]})})})},Ou=({headerGroup:e})=>g.jsx(Au,{children:e.headers.map(t=>g.jsx(Nu,{header:t},t.id))}),Bu=({headerGroups:e,stickyHeader:t,className:n})=>g.jsx(Z1,{$sticky:t,className:n,children:e.map(r=>g.jsx(Ou,{headerGroup:r},r.id))}),mw={sm:T`
         ${Kt.sm}
         ${V[14]}
     `,md:T`
@@ -1893,8 +1893,8 @@ See https://s-c.sh/2BAXzed for more info.`),window[Bn]+=1);const _r={80:T`
     border-left: 1px solid var(--color-main-light-borders);
     border-top: 1px solid var(--color-main-light-borders);
     transition: background-color 0.3s ease-out;
-`,yw=k.p`
-    ${Mu}
+`,yw=k.section`
+    ${Mu};
     justify-content: ${({$align:e})=>e==="center"?"center":e==="right"?"flex-end":"flex-start"};
 
     width: 100%;

package/package.json

@@ -3,7 +3,7 @@
     "publishConfig": {
         "access": "public"
     },
-    "version": "0.1.27",
+    "version": "0.1.28",
     "description": "This package provides reusable UI components to ensure consistency across all CRM frontend applications",
     "author": "BizAppsTotal <bizapps@tcce.biz>",
     "type": "module",