@grandbazar/ui-baza 1.5.0 → 1.5.1

package/dist/index.cjs

@@ -3271,10 +3271,10 @@ function TableCaption({ className, children, ...props }) {
   return /* @__PURE__ */ jsxRuntime.jsx("caption", { className: classNames(styles$8.tableCaption, className), ...props, children });
 }
 
-const tableCell = "_tableCell_fsw3w_2";
-const left$1 = "_left_fsw3w_6";
-const center$1 = "_center_fsw3w_10";
-const right$1 = "_right_fsw3w_14";
+const tableCell = "_tableCell_1lfet_2";
+const left$1 = "_left_1lfet_7";
+const center$1 = "_center_1lfet_11";
+const right$1 = "_right_1lfet_15";
 const styles$7 = {
 	tableCell: tableCell,
 	left: left$1,
@@ -3290,10 +3290,10 @@ function TableHeader({ className, children, ...props }) {
   return /* @__PURE__ */ jsxRuntime.jsx("thead", { className, ...props, children });
 }
 
-const tableHeaderCell = "_tableHeaderCell_1ubwo_2";
-const left = "_left_1ubwo_10";
-const center = "_center_1ubwo_14";
-const right = "_right_1ubwo_18";
+const tableHeaderCell = "_tableHeaderCell_1r67q_2";
+const left = "_left_1r67q_11";
+const center = "_center_1r67q_15";
+const right = "_right_1r67q_19";
 const styles$6 = {
 	tableHeaderCell: tableHeaderCell,
 	left: left,
@@ -3311,15 +3311,18 @@ function TableHeaderCell({
   return /* @__PURE__ */ jsxRuntime.jsx("th", { scope, className: classNames(styles$6.tableHeaderCell, styles$6[align], className), ...props, children });
 }
 
-const scrollContainer = "_scrollContainer_3qaei_2";
-const table = "_table_3qaei_10";
+const scrollContainer = "_scrollContainer_hioz2_2";
+const bare = "_bare_hioz2_15";
+const table = "_table_hioz2_21";
 const styles$5 = {
 	scrollContainer: scrollContainer,
+	"default": "_default_hioz2_9",
+	bare: bare,
 	table: table
 };
 
-function TableRoot({ className, children, ...props }) {
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles$5.scrollContainer, children: /* @__PURE__ */ jsxRuntime.jsx("table", { className: classNames(styles$5.table, className), ...props, children }) });
+function TableRoot({ className, children, mode = "default", ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: classNames(styles$5.scrollContainer, styles$5[mode]), children: /* @__PURE__ */ jsxRuntime.jsx("table", { className: classNames(styles$5.table, className), ...props, children }) });
 }
 
 const tableRow = "_tableRow_1p3oc_2";

package/dist/index.d.ts

@@ -617,6 +617,8 @@ export declare function Switch({ className, label, indeterminate, ...props }: TS
  * by the consumer — the component only reflects the state it is given.
  *
  * @param className - Additional CSS classes applied to the table element
+ * @param mode - Surface of the scroll container: `default` draws a self-contained card,
+ * `bare` draws nothing and expects the consumer's own surface around the table
  *
  * @example
  * <Table>
@@ -645,6 +647,8 @@ export declare namespace Table {
 
 declare const TABLE_CELL_ALIGNS: readonly ["left", "center", "right"];
 
+declare const TABLE_MODES: readonly ["default", "bare"];
+
 declare const TABLE_ROW_MODES: readonly ["default", "group"];
 
 declare function TableBody({ className, children, ...props }: TTableBodyProps): JSX.Element;
@@ -657,7 +661,7 @@ declare function TableHeader({ className, children, ...props }: TTableHeaderProp
 
 declare function TableHeaderCell({ className, children, align, scope, ...props }: TTableHeaderCellProps): JSX.Element;
 
-declare function TableRoot({ className, children, ...props }: TTableRootProps): JSX.Element;
+declare function TableRoot({ className, children, mode, ...props }: TTableRootProps): JSX.Element;
 
 declare function TableRow({ className, children, mode, isCurrent, ...props }: TTableRowProps): JSX.Element;
 
@@ -1040,9 +1044,13 @@ declare type TTableHeaderCellProps = Omit<React.ThHTMLAttributes<HTMLTableCellEl
 
 declare type TTableHeaderProps = React.HTMLAttributes<HTMLTableSectionElement>;
 
+declare type TTableMode = TArrayElement<typeof TABLE_MODES>;
+
 declare type TTableProps = React.ComponentProps<typeof TableRoot>;
 
-declare type TTableRootProps = React.TableHTMLAttributes<HTMLTableElement>;
+declare type TTableRootProps = React.TableHTMLAttributes<HTMLTableElement> & {
+    mode?: TTableMode;
+};
 
 declare type TTableRowMode = TArrayElement<typeof TABLE_ROW_MODES>;
 

package/dist/index.js

@@ -3267,10 +3267,10 @@ function TableCaption({ className, children, ...props }) {
   return /* @__PURE__ */ jsx("caption", { className: classNames(styles$8.tableCaption, className), ...props, children });
 }
 
-const tableCell = "_tableCell_fsw3w_2";
-const left$1 = "_left_fsw3w_6";
-const center$1 = "_center_fsw3w_10";
-const right$1 = "_right_fsw3w_14";
+const tableCell = "_tableCell_1lfet_2";
+const left$1 = "_left_1lfet_7";
+const center$1 = "_center_1lfet_11";
+const right$1 = "_right_1lfet_15";
 const styles$7 = {
 	tableCell: tableCell,
 	left: left$1,
@@ -3286,10 +3286,10 @@ function TableHeader({ className, children, ...props }) {
   return /* @__PURE__ */ jsx("thead", { className, ...props, children });
 }
 
-const tableHeaderCell = "_tableHeaderCell_1ubwo_2";
-const left = "_left_1ubwo_10";
-const center = "_center_1ubwo_14";
-const right = "_right_1ubwo_18";
+const tableHeaderCell = "_tableHeaderCell_1r67q_2";
+const left = "_left_1r67q_11";
+const center = "_center_1r67q_15";
+const right = "_right_1r67q_19";
 const styles$6 = {
 	tableHeaderCell: tableHeaderCell,
 	left: left,
@@ -3307,15 +3307,18 @@ function TableHeaderCell({
   return /* @__PURE__ */ jsx("th", { scope, className: classNames(styles$6.tableHeaderCell, styles$6[align], className), ...props, children });
 }
 
-const scrollContainer = "_scrollContainer_3qaei_2";
-const table = "_table_3qaei_10";
+const scrollContainer = "_scrollContainer_hioz2_2";
+const bare = "_bare_hioz2_15";
+const table = "_table_hioz2_21";
 const styles$5 = {
 	scrollContainer: scrollContainer,
+	"default": "_default_hioz2_9",
+	bare: bare,
 	table: table
 };
 
-function TableRoot({ className, children, ...props }) {
-  return /* @__PURE__ */ jsx("div", { className: styles$5.scrollContainer, children: /* @__PURE__ */ jsx("table", { className: classNames(styles$5.table, className), ...props, children }) });
+function TableRoot({ className, children, mode = "default", ...props }) {
+  return /* @__PURE__ */ jsx("div", { className: classNames(styles$5.scrollContainer, styles$5[mode]), children: /* @__PURE__ */ jsx("table", { className: classNames(styles$5.table, className), ...props, children }) });
 }
 
 const tableRow = "_tableRow_1p3oc_2";

package/dist/style.css

@@ -2101,55 +2101,68 @@ textarea {
   }
 }
 @layer ui_baza_components {
-  ._tableCell_fsw3w_2 {
+  ._tableCell_1lfet_2 {
     padding: var(--table-cell-padding-block) var(--table-cell-padding-inline);
     font-variant-numeric: tabular-nums;
+    vertical-align: middle;
 
-    &._left_fsw3w_6 {
+    &._left_1lfet_7 {
       text-align: left;
     }
 
-    &._center_fsw3w_10 {
+    &._center_1lfet_11 {
       text-align: center;
     }
 
-    &._right_fsw3w_14 {
+    &._right_1lfet_15 {
       text-align: right;
     }
   }
 }
 @layer ui_baza_components {
-  ._tableHeaderCell_1ubwo_2 {
+  ._tableHeaderCell_1r67q_2 {
     padding: var(--table-cell-padding-block) var(--table-cell-padding-inline);
     color: var(--color-neutral-340);
     font-weight: var(--font-weight-regular);
     font-size: var(--size-sm);
     line-height: var(--line-height-sm);
     font-variant-numeric: tabular-nums;
+    vertical-align: middle;
 
-    &._left_1ubwo_10 {
+    &._left_1r67q_11 {
       text-align: left;
     }
 
-    &._center_1ubwo_14 {
+    &._center_1r67q_15 {
       text-align: center;
     }
 
-    &._right_1ubwo_18 {
+    &._right_1r67q_19 {
       text-align: right;
     }
   }
 }
 @layer ui_baza_components {
-  ._scrollContainer_3qaei_2 {
+  ._scrollContainer_hioz2_2 {
     width: 100%;
     overflow-x: auto;
+  }
+
+  /* The surface is the mode's business: `default` is a self-contained card, `bare` expects the
+     consumer's own surface around it and would otherwise draw a second box inside it. */
+  ._default_hioz2_9 {
     border: 1px solid var(--color-neutral-alpha-100);
     border-radius: var(--radius-content-md);
     background-color: var(--color-white);
   }
 
-  ._table_3qaei_10 {
+  ._bare_hioz2_15 {
+    border: none;
+    border-radius: 0;
+    background-color: var(--color-transparent);
+  }
+
+  ._table_hioz2_21 {
     --table-cell-padding-block: var(--space-xl);
     --table-cell-padding-inline: var(--space-2xl);
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@grandbazar/ui-baza",
-  "version": "1.5.0",
+  "version": "1.5.1",
   "description": "A lightweight and modular UI kit for building modern, accessible web interfaces. Designed for flexibility, scalability, and developer happiness.",
   "repository": {
     "type": "git",