@x-plat/design-system 0.5.1 → 0.5.3

package/dist/components/DatePicker/index.js

@@ -1701,6 +1701,35 @@ var Modal_default = Modal;
 // src/components/DatePicker/RangePicker/index.tsx
 import React8 from "react";
 import { jsx as jsx302, jsxs as jsxs193 } from "react/jsx-runtime";
+var RangeDayCell = React8.memo(
+  ({
+    day,
+    disabled,
+    isStart,
+    isEnd,
+    inRange,
+    onClick
+  }) => /* @__PURE__ */ jsx302(
+    "button",
+    {
+      type: "button",
+      className: clsx_default(
+        "datepicker-day",
+        !day.isCurrentMonth && "outside",
+        disabled && "disabled",
+        (isStart || isEnd) && "selected",
+        inRange && !isStart && !isEnd && "in-range",
+        day.isToday && "today",
+        day.isSunday && "sunday",
+        day.isSaturday && "saturday"
+      ),
+      disabled: disabled || !day.isCurrentMonth,
+      onClick,
+      children: day.day
+    }
+  )
+);
+RangeDayCell.displayName = "RangeDayCell";
 var RangePicker = (props) => {
   const {
     startDate,
@@ -1777,20 +1806,13 @@ var RangePicker = (props) => {
         const isEnd = isSameDay(day.date, endDate);
         const inRange = isInRange(day.date, startDate, endDate);
         return /* @__PURE__ */ jsx302(
-          "button",
+          RangeDayCell,
           {
-            type: "button",
-            className: clsx_default(
-              "datepicker-day",
-              !day.isCurrentMonth && "outside",
-              disabled && "disabled",
-              (isStart || isEnd) && "selected",
-              inRange && !isStart && !isEnd && "in-range",
-              day.isToday && "today",
-              day.isSunday && "sunday",
-              day.isSaturday && "saturday"
-            ),
-            disabled: disabled || !day.isCurrentMonth,
+            day,
+            disabled,
+            isStart,
+            isEnd,
+            inRange,
             onClick: () => {
               if (!disabled && day.isCurrentMonth) {
                 if (type === "start") {
@@ -1801,8 +1823,7 @@ var RangePicker = (props) => {
                   onChange?.({ startDate, endDate: newEnd });
                 }
               }
-            },
-            children: day.day
+            }
           },
           idx
         );

package/dist/components/EmptyState/index.css

@@ -1,5 +1,6 @@
 /* src/components/EmptyState/emptystate.scss */
 .lib-xplat-empty-state {
+  width: 100%;
   display: flex;
   flex-direction: column;
   align-items: center;

package/dist/components/FileUpload/index.css

@@ -1,5 +1,7 @@
 /* src/components/FileUpload/fileupload.scss */
 .lib-xplat-file-upload {
+  contain: content;
+  width: 100%;
   display: flex;
   flex-direction: column;
   align-items: center;

package/dist/components/HtmlTypeWriter/index.css

@@ -1,5 +1,6 @@
 /* src/components/HtmlTypeWriter/htmlTypeWriter.scss */
 .lib-xplat-htmlTypewriter {
+  width: 100%;
   font-size: 16px;
 }
 .lib-xplat-htmlTypewriter h1,

package/dist/components/Pagination/index.css

@@ -66,21 +66,21 @@
   color: var(--semantic-text-inverse);
   font-weight: 600;
 }
-.lib-xplat-pagination.brand .lib-xplat-pagination .page-btn.active {
+.lib-xplat-pagination .page-btn svg {
+  font-size: 16px;
+}
+.lib-xplat-pagination.brand .page-btn.active {
   background-color: var(--semantic-surface-brand-default);
 }
-.lib-xplat-pagination.success .lib-xplat-pagination .page-btn.active {
+.lib-xplat-pagination.success .page-btn.active {
   background-color: var(--semantic-surface-success-default);
 }
-.lib-xplat-pagination.error .lib-xplat-pagination .page-btn.active {
+.lib-xplat-pagination.error .page-btn.active {
   background-color: var(--semantic-surface-error-default);
 }
-.lib-xplat-pagination.warning .lib-xplat-pagination .page-btn.active {
+.lib-xplat-pagination.warning .page-btn.active {
   background-color: var(--semantic-surface-warning-default);
 }
-.lib-xplat-pagination.info .lib-xplat-pagination .page-btn.active {
+.lib-xplat-pagination.info .page-btn.active {
   background-color: var(--semantic-surface-info-default);
 }
-.lib-xplat-pagination .page-btn svg {
-  font-size: 16px;
-}

package/dist/components/Spinner/index.css

@@ -16,10 +16,15 @@
   width: var(--spacing-space-9);
   height: var(--spacing-space-9);
 }
+.lib-xplat-spinner {
+  contain: strict;
+}
 .lib-xplat-spinner svg {
   width: 100%;
   height: 100%;
   animation: lib-xplat-spin 0.8s linear infinite;
+  will-change: transform;
+  backface-visibility: hidden;
 }
 .lib-xplat-spinner .track {
   stroke: var(--semantic-border-default);
@@ -45,9 +50,9 @@
 }
 @keyframes lib-xplat-spin {
   from {
-    transform: rotate(0deg);
+    transform: rotate3d(0, 0, 1, 0deg);
   }
   to {
-    transform: rotate(360deg);
+    transform: rotate3d(0, 0, 1, 360deg);
   }
 }

package/dist/components/Steps/index.cjs

@@ -951,10 +951,7 @@ var Steps = (props) => {
   return /* @__PURE__ */ (0, import_jsx_runtime295.jsx)("div", { className: clsx_default("lib-xplat-steps", type), children: items.map((item, index) => {
     const status = index < current ? "completed" : index === current ? "active" : "pending";
     return /* @__PURE__ */ (0, import_jsx_runtime295.jsxs)("div", { className: clsx_default("step-item", status), children: [
-      /* @__PURE__ */ (0, import_jsx_runtime295.jsxs)("div", { className: "step-indicator", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime295.jsx)("div", { className: "step-circle", children: status === "completed" ? /* @__PURE__ */ (0, import_jsx_runtime295.jsx)(CheckIcon_default, {}) : /* @__PURE__ */ (0, import_jsx_runtime295.jsx)("span", { children: index + 1 }) }),
-        index < items.length - 1 && /* @__PURE__ */ (0, import_jsx_runtime295.jsx)("div", { className: "step-line" })
-      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime295.jsx)("div", { className: "step-circle", children: status === "completed" ? /* @__PURE__ */ (0, import_jsx_runtime295.jsx)(CheckIcon_default, {}) : /* @__PURE__ */ (0, import_jsx_runtime295.jsx)("span", { children: index + 1 }) }),
       /* @__PURE__ */ (0, import_jsx_runtime295.jsxs)("div", { className: "step-content", children: [
         /* @__PURE__ */ (0, import_jsx_runtime295.jsx)("span", { className: "step-title", children: item.title }),
         item.description && /* @__PURE__ */ (0, import_jsx_runtime295.jsx)("span", { className: "step-description", children: item.description })

package/dist/components/Steps/index.css

@@ -8,16 +8,18 @@
   display: flex;
   flex-direction: column;
   align-items: center;
-}
-.lib-xplat-steps .step-item:last-child .step-line {
-  display: none;
-}
-.lib-xplat-steps .step-indicator {
-  display: flex;
-  align-items: center;
-  width: 100%;
   position: relative;
 }
+.lib-xplat-steps .step-item:not(:last-child)::after {
+  content: "";
+  position: absolute;
+  top: 16px;
+  left: calc(50% + 20px);
+  right: calc(-50% + 20px);
+  height: 2px;
+  background-color: var(--semantic-surface-neutral-disabled);
+  transition: background-color 0.2s;
+}
 .lib-xplat-steps .step-circle {
   width: var(--spacing-control-height-sm);
   height: var(--spacing-control-height-sm);
@@ -34,11 +36,6 @@
 .lib-xplat-steps .step-circle svg {
   font-size: 16px;
 }
-.lib-xplat-steps .step-line {
-  flex: 1;
-  height: 2px;
-  transition: background-color 0.2s;
-}
 .lib-xplat-steps .step-content {
   display: flex;
   flex-direction: column;
@@ -60,79 +57,61 @@
   color: var(--semantic-text-inverse);
   background-color: var(--semantic-surface-brand-default);
 }
-.lib-xplat-steps.brand .step-item.completed .step-line {
+.lib-xplat-steps.brand .step-item.completed::after {
   background-color: var(--semantic-surface-brand-default);
 }
 .lib-xplat-steps.brand .step-item.active .step-circle {
   color: var(--semantic-text-inverse);
   background-color: var(--semantic-surface-brand-default);
 }
-.lib-xplat-steps.brand .step-item.active .step-line {
-  background-color: var(--semantic-surface-neutral-disabled);
-}
 .lib-xplat-steps.success .step-item.completed .step-circle {
   color: var(--semantic-text-inverse);
   background-color: var(--semantic-surface-success-default);
 }
-.lib-xplat-steps.success .step-item.completed .step-line {
+.lib-xplat-steps.success .step-item.completed::after {
   background-color: var(--semantic-surface-success-default);
 }
 .lib-xplat-steps.success .step-item.active .step-circle {
   color: var(--semantic-text-inverse);
   background-color: var(--semantic-surface-success-default);
 }
-.lib-xplat-steps.success .step-item.active .step-line {
-  background-color: var(--semantic-surface-neutral-disabled);
-}
 .lib-xplat-steps.error .step-item.completed .step-circle {
   color: var(--semantic-text-inverse);
   background-color: var(--semantic-surface-error-default);
 }
-.lib-xplat-steps.error .step-item.completed .step-line {
+.lib-xplat-steps.error .step-item.completed::after {
   background-color: var(--semantic-surface-error-default);
 }
 .lib-xplat-steps.error .step-item.active .step-circle {
   color: var(--semantic-text-inverse);
   background-color: var(--semantic-surface-error-default);
 }
-.lib-xplat-steps.error .step-item.active .step-line {
-  background-color: var(--semantic-surface-neutral-disabled);
-}
 .lib-xplat-steps.warning .step-item.completed .step-circle {
   color: var(--semantic-text-inverse);
   background-color: var(--semantic-surface-warning-default);
 }
-.lib-xplat-steps.warning .step-item.completed .step-line {
+.lib-xplat-steps.warning .step-item.completed::after {
   background-color: var(--semantic-surface-warning-default);
 }
 .lib-xplat-steps.warning .step-item.active .step-circle {
   color: var(--semantic-text-inverse);
   background-color: var(--semantic-surface-warning-default);
 }
-.lib-xplat-steps.warning .step-item.active .step-line {
-  background-color: var(--semantic-surface-neutral-disabled);
-}
 .lib-xplat-steps.info .step-item.completed .step-circle {
   color: var(--semantic-text-inverse);
   background-color: var(--semantic-surface-info-default);
 }
-.lib-xplat-steps.info .step-item.completed .step-line {
+.lib-xplat-steps.info .step-item.completed::after {
   background-color: var(--semantic-surface-info-default);
 }
 .lib-xplat-steps.info .step-item.active .step-circle {
   color: var(--semantic-text-inverse);
   background-color: var(--semantic-surface-info-default);
 }
-.lib-xplat-steps.info .step-item.active .step-line {
-  background-color: var(--semantic-surface-neutral-disabled);
-}
 .lib-xplat-steps .step-item.pending .step-circle {
   background-color: var(--semantic-surface-neutral-disabled);
   color: var(--semantic-text-muted);
 }
-.lib-xplat-steps .step-item.pending .step-line {
-  background-color: var(--semantic-surface-neutral-disabled);
-}
 .lib-xplat-steps .step-item.pending .step-title {
   color: var(--semantic-text-disabled);
 }

package/dist/components/Steps/index.js

@@ -925,10 +925,7 @@ var Steps = (props) => {
   return /* @__PURE__ */ jsx295("div", { className: clsx_default("lib-xplat-steps", type), children: items.map((item, index) => {
     const status = index < current ? "completed" : index === current ? "active" : "pending";
     return /* @__PURE__ */ jsxs189("div", { className: clsx_default("step-item", status), children: [
-      /* @__PURE__ */ jsxs189("div", { className: "step-indicator", children: [
-        /* @__PURE__ */ jsx295("div", { className: "step-circle", children: status === "completed" ? /* @__PURE__ */ jsx295(CheckIcon_default, {}) : /* @__PURE__ */ jsx295("span", { children: index + 1 }) }),
-        index < items.length - 1 && /* @__PURE__ */ jsx295("div", { className: "step-line" })
-      ] }),
+      /* @__PURE__ */ jsx295("div", { className: "step-circle", children: status === "completed" ? /* @__PURE__ */ jsx295(CheckIcon_default, {}) : /* @__PURE__ */ jsx295("span", { children: index + 1 }) }),
       /* @__PURE__ */ jsxs189("div", { className: "step-content", children: [
         /* @__PURE__ */ jsx295("span", { className: "step-title", children: item.title }),
         item.description && /* @__PURE__ */ jsx295("span", { className: "step-description", children: item.description })

package/dist/components/Swiper/index.cjs

@@ -252,6 +252,21 @@ var Swiper = (props) => {
   }, [isDragging, dragOffset, innerIndex, useLoop, maxIndex, slideStep, moveToInner]);
   const slideWidthPercent = 100 / viewItemCount;
   const gapAdjust = spaceBetween * (viewItemCount - 1) / viewItemCount;
+  const slideElements = import_react.default.useMemo(
+    () => extendedItems.map((item, idx) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      "div",
+      {
+        className: "lib-xplat-swiper__slide",
+        style: {
+          minWidth: `calc(${slideWidthPercent}% - ${gapAdjust}px)`,
+          maxWidth: `calc(${slideWidthPercent}% - ${gapAdjust}px)`
+        },
+        children: item
+      },
+      idx
+    )),
+    [extendedItems, slideWidthPercent, gapAdjust]
+  );
   const totalSteps = Math.ceil((maxIndex + 1) / slideBy);
   const currentStep = Math.min(
     Math.floor(realIndex / slideBy),
@@ -277,18 +292,7 @@ var Swiper = (props) => {
               gap: `${spaceBetween}px`
             },
             onTransitionEnd: handleTransitionEnd,
-            children: extendedItems.map((item, idx) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-              "div",
-              {
-                className: "lib-xplat-swiper__slide",
-                style: {
-                  minWidth: `calc(${slideWidthPercent}% - ${gapAdjust}px)`,
-                  maxWidth: `calc(${slideWidthPercent}% - ${gapAdjust}px)`
-                },
-                children: item
-              },
-              idx
-            ))
+            children: slideElements
           }
         )
       }

package/dist/components/Swiper/index.css

@@ -1,5 +1,6 @@
 /* src/components/Swiper/swiper.scss */
 .lib-xplat-swiper {
+  contain: content;
   width: 100%;
   position: relative;
 }

package/dist/components/Swiper/index.js

@@ -216,6 +216,21 @@ var Swiper = (props) => {
   }, [isDragging, dragOffset, innerIndex, useLoop, maxIndex, slideStep, moveToInner]);
   const slideWidthPercent = 100 / viewItemCount;
   const gapAdjust = spaceBetween * (viewItemCount - 1) / viewItemCount;
+  const slideElements = React.useMemo(
+    () => extendedItems.map((item, idx) => /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: "lib-xplat-swiper__slide",
+        style: {
+          minWidth: `calc(${slideWidthPercent}% - ${gapAdjust}px)`,
+          maxWidth: `calc(${slideWidthPercent}% - ${gapAdjust}px)`
+        },
+        children: item
+      },
+      idx
+    )),
+    [extendedItems, slideWidthPercent, gapAdjust]
+  );
   const totalSteps = Math.ceil((maxIndex + 1) / slideBy);
   const currentStep = Math.min(
     Math.floor(realIndex / slideBy),
@@ -241,18 +256,7 @@ var Swiper = (props) => {
               gap: `${spaceBetween}px`
             },
             onTransitionEnd: handleTransitionEnd,
-            children: extendedItems.map((item, idx) => /* @__PURE__ */ jsx(
-              "div",
-              {
-                className: "lib-xplat-swiper__slide",
-                style: {
-                  minWidth: `calc(${slideWidthPercent}% - ${gapAdjust}px)`,
-                  maxWidth: `calc(${slideWidthPercent}% - ${gapAdjust}px)`
-                },
-                children: item
-              },
-              idx
-            ))
+            children: slideElements
           }
         )
       }

package/dist/components/Switch/index.css

@@ -3,43 +3,44 @@
   position: relative;
   border-radius: var(--spacing-radius-full);
   cursor: pointer;
+  box-sizing: border-box;
   transition: background-color 0.2s, border-color 0.2s;
   border: 1px solid transparent;
   background-color: var(--semantic-border-default);
   border-color: var(--semantic-border-default);
 }
 .lib-xplat-switch.sm {
-  width: var(--spacing-space-8);
-  height: var(--spacing-space-4);
+  width: 34px;
+  height: 20px;
 }
 .lib-xplat-switch.sm > .knob {
-  width: var(--spacing-space-4);
-  height: var(--spacing-space-4);
+  width: 16px;
+  height: 16px;
 }
 .lib-xplat-switch.sm > .knob.checked {
-  transform: translateY(-50%) translateX(14px);
+  left: calc(100% - 16px - 2px);
 }
 .lib-xplat-switch.md {
-  width: var(--spacing-space-11);
-  height: var(--spacing-space-6);
+  width: 42px;
+  height: 24px;
 }
 .lib-xplat-switch.md > .knob {
-  width: var(--spacing-space-6);
-  height: var(--spacing-space-6);
+  width: 20px;
+  height: 20px;
 }
 .lib-xplat-switch.md > .knob.checked {
-  transform: translateY(-50%) translateX(22px);
+  left: calc(100% - 20px - 2px);
 }
 .lib-xplat-switch.lg {
-  width: var(--spacing-space-11);
-  height: var(--spacing-space-8);
+  width: 50px;
+  height: 28px;
 }
 .lib-xplat-switch.lg > .knob {
-  width: var(--spacing-space-6);
-  height: var(--spacing-space-6);
+  width: 24px;
+  height: 24px;
 }
 .lib-xplat-switch.lg > .knob.checked {
-  transform: translateY(-50%) translateX(26px);
+  left: calc(100% - 24px - 2px);
 }
 .lib-xplat-switch.disabled {
   opacity: 0.5;
@@ -93,10 +94,10 @@
 .lib-xplat-switch > .knob {
   position: absolute;
   top: 50%;
-  left: 0;
+  left: 2px;
+  transform: translateY(-50%);
   background-color: var(--semantic-surface-neutral-default);
   border-radius: var(--spacing-radius-full);
-  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
-  transform: translateY(-50%);
-  transition: transform 0.25s;
+  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
+  transition: left 0.25s;
 }

package/dist/components/Tab/index.css

@@ -2,9 +2,15 @@
 .lib-xplat-tab {
   position: relative;
   display: flex;
-  width: fit-content;
-  overflow: hidden;
+  width: 100%;
+  min-width: 0;
   align-items: center;
+  overflow-x: auto;
+  -ms-overflow-style: none;
+  scrollbar-width: none;
+}
+.lib-xplat-tab::-webkit-scrollbar {
+  display: none;
 }
 .lib-xplat-tab.sm {
   height: var(--spacing-control-height-sm);
@@ -19,15 +25,19 @@
   font-size: 18px;
 }
 .lib-xplat-tab.type-default {
+  width: 100%;
   background-color: var(--semantic-surface-neutral-strong);
   border-radius: var(--spacing-radius-md);
 }
 .lib-xplat-tab.type-default > .tab-item {
+  flex: 1;
   padding: var(--spacing-space-1) var(--spacing-space-6);
   height: 100%;
   display: flex;
   align-items: center;
+  justify-content: center;
   cursor: pointer;
+  white-space: nowrap;
   border-right: 1px solid var(--semantic-border-strong);
   color: var(--semantic-text-inverse);
 }
@@ -38,13 +48,17 @@
   background-color: var(--semantic-surface-brand-default);
 }
 .lib-xplat-tab.type-toggle {
+  width: 100%;
   border-bottom: 1px solid var(--semantic-border-default);
   gap: var(--spacing-space-6);
 }
 .lib-xplat-tab.type-toggle > .tab-item {
   position: relative;
+  flex: 1;
   display: flex;
   align-items: center;
+  justify-content: center;
+  white-space: nowrap;
   padding: 0 var(--spacing-space-3);
   font-size: 16px;
   font-weight: 500;

package/dist/components/Table/index.cjs

@@ -125,7 +125,7 @@ var TableRowContext_default = TableRowContext;
 
 // src/components/Table/TableCell.tsx
 var import_jsx_runtime3 = require("react/jsx-runtime");
-var TableCell = (props) => {
+var TableCell = import_react4.default.memo((props) => {
   const {
     children,
     align = "center",
@@ -180,7 +180,7 @@ var TableCell = (props) => {
       children
     }
   );
-};
+});
 TableCell.displayName = "TableCell";
 var TableCell_default = TableCell;
 
@@ -199,7 +199,7 @@ var TableHead_default = TableHead;
 // src/components/Table/TableRow.tsx
 var import_react5 = __toESM(require("react"), 1);
 var import_jsx_runtime5 = require("react/jsx-runtime");
-var TableRow = (props) => {
+var TableRow = import_react5.default.memo((props) => {
   const {
     children,
     type = "secondary",
@@ -227,7 +227,7 @@ var TableRow = (props) => {
       children
     }
   ) });
-};
+});
 TableRow.displayName = "TableRow";
 var TableRow_default = TableRow;
 // Annotate the CommonJS export names for ESM import in node:

package/dist/components/Table/index.css

@@ -1,5 +1,6 @@
 /* src/components/Table/table.scss */
 .lib-xplat-table-wrapper {
+  contain: content;
   width: 100%;
   position: relative;
 }

package/dist/components/Table/index.d.cts

@@ -27,7 +27,7 @@ interface TableCellProps {
     isSticky?: boolean;
     onClick?: (e: React.MouseEvent<HTMLTableCellElement>) => void;
 }
-declare const TableCell: React.FC<TableCellProps>;
+declare const TableCell: React.NamedExoticComponent<TableCellProps>;
 
 interface TableHeaderProps {
     children: React.ReactNode;
@@ -44,9 +44,6 @@ interface TableRowProps {
     isHover?: boolean;
     onClick?: (e: React.MouseEvent<HTMLTableRowElement>) => void;
 }
-declare const TableRow: {
-    (props: TableRowProps): react_jsx_runtime.JSX.Element;
-    displayName: string;
-};
+declare const TableRow: React.MemoExoticComponent<(props: TableRowProps) => react_jsx_runtime.JSX.Element>;
 
 export { Table, TableBody, TableCell, TableHead, TableRow };

package/dist/components/Table/index.d.ts

@@ -27,7 +27,7 @@ interface TableCellProps {
     isSticky?: boolean;
     onClick?: (e: React.MouseEvent<HTMLTableCellElement>) => void;
 }
-declare const TableCell: React.FC<TableCellProps>;
+declare const TableCell: React.NamedExoticComponent<TableCellProps>;
 
 interface TableHeaderProps {
     children: React.ReactNode;
@@ -44,9 +44,6 @@ interface TableRowProps {
     isHover?: boolean;
     onClick?: (e: React.MouseEvent<HTMLTableRowElement>) => void;
 }
-declare const TableRow: {
-    (props: TableRowProps): react_jsx_runtime.JSX.Element;
-    displayName: string;
-};
+declare const TableRow: React.MemoExoticComponent<(props: TableRowProps) => react_jsx_runtime.JSX.Element>;
 
 export { Table, TableBody, TableCell, TableHead, TableRow };

package/dist/components/Table/index.js

@@ -85,7 +85,7 @@ var TableRowContext_default = TableRowContext;
 
 // src/components/Table/TableCell.tsx
 import { jsx as jsx3 } from "react/jsx-runtime";
-var TableCell = (props) => {
+var TableCell = React4.memo((props) => {
   const {
     children,
     align = "center",
@@ -140,7 +140,7 @@ var TableCell = (props) => {
       children
     }
   );
-};
+});
 TableCell.displayName = "TableCell";
 var TableCell_default = TableCell;
 
@@ -159,7 +159,7 @@ var TableHead_default = TableHead;
 // src/components/Table/TableRow.tsx
 import React5 from "react";
 import { jsx as jsx5 } from "react/jsx-runtime";
-var TableRow = (props) => {
+var TableRow = React5.memo((props) => {
   const {
     children,
     type = "secondary",
@@ -187,7 +187,7 @@ var TableRow = (props) => {
       children
     }
   ) });
-};
+});
 TableRow.displayName = "TableRow";
 var TableRow_default = TableRow;
 export {