@grandbazar/ui-baza 1.5.0 → 1.5.2

package/README.md

@@ -200,6 +200,7 @@ All icons are exported from `@grandbazar/ui-baza` and accept standard SVG props
 - **IconStore** - Storefront/marketplace icon.
 - **IconSwitch** - Toggle/switch state icon.
 - **IconTrash** - Delete/remove action icon.
+- **IconTrophy** - Trophy/award icon.
 - **IconXMark** - Close/remove icon.
 - **IconXMarkCircle** - Close icon in a circle.
 - **IconLogo** - Brand icons namespace.
@@ -213,6 +214,7 @@ Some icons provide variants via Compound Components pattern, for example:
 - **IconEye.Off** - Visibility-off/hidden state variant.
 - **IconFace.Sad** - Negative feedback/emotion variant.
 - **IconFace.Smile** - Positive feedback/emotion variant.
+- **IconTrophy.Filled** - Filled trophy/award variant.
 - **IconXMark.Small** - Compact close icon for tight layouts.
 
 Brand icons are available under `IconLogo`:

package/dist/index.cjs

@@ -1086,6 +1086,57 @@ IconTrash.Filled = function IconTrashFilled(props) {
   ) });
 };
 
+function IconTrophy(props) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", ...props, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "path",
+      {
+        fillRule: "evenodd",
+        clipRule: "evenodd",
+        d: "M8 2H16A2 2 0 0 1 18 4V9A6 6 0 0 1 6 9V4A2 2 0 0 1 8 2ZM10 4H14A2 2 0 0 1 16 6V9A4 4 0 0 1 8 9V6A2 2 0 0 1 10 4Z",
+        fill: "currentColor"
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M6 4.5A4 4 0 0 0 2 8.5A4 4 0 0 0 6 12.5V10.5A2 2 0 0 1 4 8.5A2 2 0 0 1 6 6.5V4.5Z", fill: "currentColor" }),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "path",
+      {
+        d: "M18 4.5A4 4 0 0 1 22 8.5A4 4 0 0 1 18 12.5V10.5A2 2 0 0 0 20 8.5A2 2 0 0 0 18 6.5V4.5Z",
+        fill: "currentColor"
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M10 13.5H14L15.5 18.5H8.5L10 13.5Z", fill: "currentColor" }),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "path",
+      {
+        d: "M7 18.5H17A1 1 0 0 1 18 19.5V20.5A1 1 0 0 1 17 21.5H7A1 1 0 0 1 6 20.5V19.5A1 1 0 0 1 7 18.5Z",
+        fill: "currentColor"
+      }
+    )
+  ] });
+}
+IconTrophy.Filled = function IconTrophyFilled(props) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", ...props, children: [
+    /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M8 2H16A2 2 0 0 1 18 4V9A6 6 0 0 1 6 9V4A2 2 0 0 1 8 2Z", fill: "currentColor" }),
+    /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M6 4.5A4 4 0 0 0 2 8.5A4 4 0 0 0 6 12.5V10.5A2 2 0 0 1 4 8.5A2 2 0 0 1 6 6.5V4.5Z", fill: "currentColor" }),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "path",
+      {
+        d: "M18 4.5A4 4 0 0 1 22 8.5A4 4 0 0 1 18 12.5V10.5A2 2 0 0 0 20 8.5A2 2 0 0 0 18 6.5V4.5Z",
+        fill: "currentColor"
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M10 13.5H14L15.5 18.5H8.5L10 13.5Z", fill: "currentColor" }),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "path",
+      {
+        d: "M7 18.5H17A1 1 0 0 1 18 19.5V20.5A1 1 0 0 1 17 21.5H7A1 1 0 0 1 6 20.5V19.5A1 1 0 0 1 7 18.5Z",
+        fill: "currentColor"
+      }
+    )
+  ] });
+};
+
 function IconUpload(props) {
   return /* @__PURE__ */ jsxRuntime.jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", ...props, children: /* @__PURE__ */ jsxRuntime.jsx(
     "path",
@@ -3271,10 +3322,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 +3341,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 +3362,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";
@@ -3636,6 +3690,7 @@ exports.IconStop = IconStop;
 exports.IconStore = IconStore;
 exports.IconSwitch = IconSwitch;
 exports.IconTrash = IconTrash;
+exports.IconTrophy = IconTrophy;
 exports.IconUpload = IconUpload;
 exports.IconXMark = IconXMark;
 exports.IconXMarkCircle = IconXMarkCircle;

package/dist/index.d.ts

@@ -399,6 +399,12 @@ export declare namespace IconTrash {
     var Filled: (props: TSvgIconProps) => JSX.Element;
 }
 
+export declare function IconTrophy(props: TSvgIconProps): JSX.Element;
+
+export declare namespace IconTrophy {
+    var Filled: (props: TSvgIconProps) => JSX.Element;
+}
+
 export declare function IconUpload(props: TSvgIconProps): JSX.Element;
 
 declare function IconVK(props: TSvgIconProps): JSX.Element;
@@ -617,6 +623,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 +653,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 +667,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 +1050,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

@@ -1082,6 +1082,57 @@ IconTrash.Filled = function IconTrashFilled(props) {
   ) });
 };
 
+function IconTrophy(props) {
+  return /* @__PURE__ */ jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", ...props, children: [
+    /* @__PURE__ */ jsx(
+      "path",
+      {
+        fillRule: "evenodd",
+        clipRule: "evenodd",
+        d: "M8 2H16A2 2 0 0 1 18 4V9A6 6 0 0 1 6 9V4A2 2 0 0 1 8 2ZM10 4H14A2 2 0 0 1 16 6V9A4 4 0 0 1 8 9V6A2 2 0 0 1 10 4Z",
+        fill: "currentColor"
+      }
+    ),
+    /* @__PURE__ */ jsx("path", { d: "M6 4.5A4 4 0 0 0 2 8.5A4 4 0 0 0 6 12.5V10.5A2 2 0 0 1 4 8.5A2 2 0 0 1 6 6.5V4.5Z", fill: "currentColor" }),
+    /* @__PURE__ */ jsx(
+      "path",
+      {
+        d: "M18 4.5A4 4 0 0 1 22 8.5A4 4 0 0 1 18 12.5V10.5A2 2 0 0 0 20 8.5A2 2 0 0 0 18 6.5V4.5Z",
+        fill: "currentColor"
+      }
+    ),
+    /* @__PURE__ */ jsx("path", { d: "M10 13.5H14L15.5 18.5H8.5L10 13.5Z", fill: "currentColor" }),
+    /* @__PURE__ */ jsx(
+      "path",
+      {
+        d: "M7 18.5H17A1 1 0 0 1 18 19.5V20.5A1 1 0 0 1 17 21.5H7A1 1 0 0 1 6 20.5V19.5A1 1 0 0 1 7 18.5Z",
+        fill: "currentColor"
+      }
+    )
+  ] });
+}
+IconTrophy.Filled = function IconTrophyFilled(props) {
+  return /* @__PURE__ */ jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", ...props, children: [
+    /* @__PURE__ */ jsx("path", { d: "M8 2H16A2 2 0 0 1 18 4V9A6 6 0 0 1 6 9V4A2 2 0 0 1 8 2Z", fill: "currentColor" }),
+    /* @__PURE__ */ jsx("path", { d: "M6 4.5A4 4 0 0 0 2 8.5A4 4 0 0 0 6 12.5V10.5A2 2 0 0 1 4 8.5A2 2 0 0 1 6 6.5V4.5Z", fill: "currentColor" }),
+    /* @__PURE__ */ jsx(
+      "path",
+      {
+        d: "M18 4.5A4 4 0 0 1 22 8.5A4 4 0 0 1 18 12.5V10.5A2 2 0 0 0 20 8.5A2 2 0 0 0 18 6.5V4.5Z",
+        fill: "currentColor"
+      }
+    ),
+    /* @__PURE__ */ jsx("path", { d: "M10 13.5H14L15.5 18.5H8.5L10 13.5Z", fill: "currentColor" }),
+    /* @__PURE__ */ jsx(
+      "path",
+      {
+        d: "M7 18.5H17A1 1 0 0 1 18 19.5V20.5A1 1 0 0 1 17 21.5H7A1 1 0 0 1 6 20.5V19.5A1 1 0 0 1 7 18.5Z",
+        fill: "currentColor"
+      }
+    )
+  ] });
+};
+
 function IconUpload(props) {
   return /* @__PURE__ */ jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", ...props, children: /* @__PURE__ */ jsx(
     "path",
@@ -3267,10 +3318,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 +3337,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 +3358,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";
@@ -3568,4 +3622,4 @@ function Tooltip(props) {
 }
 Tooltip.Content = TooltipContent;
 
-export { Badge, BadgeTabs, Breadcrumbs, Button, Checkbox, Chip, Counter, DatePicker, DropdownMenu, I18N_MONTH_LABELS, I18N_WEEKDAY_LABELS, IconArrow, IconArrowCircle, IconArrowCircleUp, IconArrowDiagonal, IconArrowUTurn, IconBell, IconBox, IconCalendar, IconCamera, IconCharacteristic, IconCheck, IconCheckCircle, IconChevron, IconChevronDouble, IconClock, IconCollapse, IconCopy, IconDocument, IconDots, IconDownload, IconEye, IconFace, IconFile, IconFilters, IconGear, IconHanger, IconHome, IconInfo, IconLogOut, IconLogo, IconMail, IconMinus, IconOneCircle, IconPause, IconPerson, IconPhone, IconPlay, IconPlus, IconPrize, IconProject, IconQRCode, IconRequest, IconResizeCorner, IconScan, IconSearch, IconShopping, IconSort, IconStar, IconSticker, IconStop, IconStore, IconSwitch, IconTrash, IconUpload, IconXMark, IconXMarkCircle, LOCALE_FIRST_DAY_OF_WEEK, NotificationInline, Pagination, ProgressBar, RadioButton, Search, SegmentControl, Slider, Stepper, Switch, Table, Tabs, Tag, TextField, Tooltip, useDatePickerControls, useDatePickerMultiSelect, useDatePickerSelect };
+export { Badge, BadgeTabs, Breadcrumbs, Button, Checkbox, Chip, Counter, DatePicker, DropdownMenu, I18N_MONTH_LABELS, I18N_WEEKDAY_LABELS, IconArrow, IconArrowCircle, IconArrowCircleUp, IconArrowDiagonal, IconArrowUTurn, IconBell, IconBox, IconCalendar, IconCamera, IconCharacteristic, IconCheck, IconCheckCircle, IconChevron, IconChevronDouble, IconClock, IconCollapse, IconCopy, IconDocument, IconDots, IconDownload, IconEye, IconFace, IconFile, IconFilters, IconGear, IconHanger, IconHome, IconInfo, IconLogOut, IconLogo, IconMail, IconMinus, IconOneCircle, IconPause, IconPerson, IconPhone, IconPlay, IconPlus, IconPrize, IconProject, IconQRCode, IconRequest, IconResizeCorner, IconScan, IconSearch, IconShopping, IconSort, IconStar, IconSticker, IconStop, IconStore, IconSwitch, IconTrash, IconTrophy, IconUpload, IconXMark, IconXMarkCircle, LOCALE_FIRST_DAY_OF_WEEK, NotificationInline, Pagination, ProgressBar, RadioButton, Search, SegmentControl, Slider, Stepper, Switch, Table, Tabs, Tag, TextField, Tooltip, useDatePickerControls, useDatePickerMultiSelect, useDatePickerSelect };

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.2",
   "description": "A lightweight and modular UI kit for building modern, accessible web interfaces. Designed for flexibility, scalability, and developer happiness.",
   "repository": {
     "type": "git",