@tipp/ui 2.3.9 → 2.3.11

package/dist/index.css

@@ -30893,17 +30893,87 @@ p.kg-collection-card-post-excerpt{
   height: 100%;
   display: grid;
   grid-template-rows: 1fr auto;
-  overflow-x: auto;
   scrollbar-width: none;
 }
+.expand-table-wrapper.card .tr{
+  background-color: var(--accent-2);
+  min-height: 44px;
+  border-radius: var(--radius-5);
+}
+.expand-table-wrapper.card .th,
+    .expand-table-wrapper.card .td{
+  padding: var(--space-3);
+}
+.expand-table-wrapper.card .tbody{
+  margin-top: var(--space-1);
+}
+.expand-table-wrapper.card .tr-wrapper{
+  border: 1px solid var(--gray-a4);
+  border-radius: var(--radius-6);
+  margin-bottom: var(--space-1);
+  background-color: var(--color-panel-solid);
+}
+.expand-table-wrapper.card .tr-wrapper.clickable:hover, .expand-table-wrapper.card .tr-wrapper.expandable:hover{
+  border: 1px solid var(--accent-a7);
+  background-color: var(--accent-a2);
+}
+.expand-table-wrapper.card button.tr{
+  border-radius: var(--radius-6);
+  border: none;
+  min-height: 64px;
+}
+.expand-table-wrapper.card .th button{
+  border: none;
+}
+.expand-table-wrapper.sprite .th *, .expand-table-wrapper.sprite-border .th *{
+  font-weight: 600;
+}
+.expand-table-wrapper.sprite .th,
+    .expand-table-wrapper.sprite-border .th,
+    .expand-table-wrapper.sprite .td,
+    .expand-table-wrapper.sprite-border .td{
+  padding: var(--space-3);
+}
+.expand-table-wrapper.sprite .th button, .expand-table-wrapper.sprite-border .th button{
+  padding: 0;
+  border: none;
+}
+.expand-table-wrapper.sprite .tr, .expand-table-wrapper.sprite-border .tr{
+  border: none;
+  padding: 0;
+  background-color: var(--color-panel-solid);
+}
+.expand-table-wrapper.sprite .tr-wrapper,
+    .expand-table-wrapper.sprite-border .tr-wrapper,
+    .expand-table-wrapper.sprite .thead .tr,
+    .expand-table-wrapper.sprite-border .thead .tr{
+  border-bottom: 1px solid var(--gray-a5);
+}
+.expand-table-wrapper.sprite .clickable:hover, .expand-table-wrapper.sprite-border .clickable:hover, .expand-table-wrapper.sprite .expandable:hover, .expand-table-wrapper.sprite-border .expandable:hover{
+  background-color: var(--gray-a1);
+}
+.expand-table-wrapper.sprite-border .expand-table{
+  border: 1px solid var(--gray-a5);
+  border-radius: var(--radius-6);
+}
+.expand-table-wrapper.sprite-border .tbody .tr-wrapper:last-child{
+  border-bottom: none;
+}
+.expand-table-wrapper.sprite-border .thead .tr{
+  background-color: var(--gray-2);
+}
 .expand-table-wrapper .expand-table{
   position: relative;
   min-width: -moz-fit-content;
   min-width: fit-content;
   width: 100%;
   height: 100%;
-  overflow-y: auto;
-  overflow-x: hidden;
+  display: grid;
+}
+.expand-table-wrapper .expand-table .tr{
+  min-width: -moz-fit-content;
+  min-width: fit-content;
+  background-color: var(--color-panel-solid);
 }
 .expand-table-wrapper .expand-table .thead{
   position: sticky;
@@ -30911,19 +30981,14 @@ p.kg-collection-card-post-excerpt{
   z-index: 10;
 }
 .expand-table-wrapper .expand-table .thead .tr{
-  background-color: var(--accent-2);
-  padding: var(--space-1) var(--space-5);
-  min-height: 44px;
   display: grid;
-  border-radius: var(--radius-5);
 }
 .expand-table-wrapper .expand-table .thead .tr .th{
   display: flex;
+  align-items: center;
 }
 .expand-table-wrapper .expand-table .thead .tr .th button{
-  padding: 0;
   background: transparent;
-  border: none;
   display: inline-block;
   display: flex;
   align-items: center;
@@ -30937,44 +31002,22 @@ p.kg-collection-card-post-excerpt{
 .expand-table-wrapper .expand-table .thead .tr .th.center{
   justify-content: center;
 }
-.expand-table-wrapper .expand-table .th,
-    .expand-table-wrapper .expand-table .td{
-  padding: var(--space-2);
-}
-.expand-table-wrapper .expand-table .th:first-child, .expand-table-wrapper .expand-table .td:first-child{
-  padding-left: 0;
-}
-.expand-table-wrapper .expand-table .th:last-child, .expand-table-wrapper .expand-table .td:last-child{
-  padding-right: 0;
-}
-.expand-table-wrapper .expand-table .tr{
-  min-width: -moz-fit-content;
-  min-width: fit-content;
-}
 .expand-table-wrapper .expand-table .tbody{
   width: 100%;
-  margin-top: var(--space-1);
+  height: 100%;
+  overflow-y: auto;
 }
 .expand-table-wrapper .expand-table .tbody .tr-wrapper{
   width: 100%;
   cursor: default;
-  border-radius: var(--radius-6);
-  border: 1px solid var(--gray-a4);
-  margin-bottom: var(--space-1);
-  background-color: var(--color-panel-solid);
   transition: 0.3s ease-in-out background-color border-color;
 }
-.expand-table-wrapper .expand-table .tbody .tr-wrapper.clickable:hover, .expand-table-wrapper .expand-table .tbody .tr-wrapper.expandable:hover{
-  border: 1px solid var(--accent-a7);
-  background-color: var(--accent-a2);
-}
 .expand-table-wrapper .expand-table .tbody .tr-wrapper.clickable button.tr, .expand-table-wrapper .expand-table .tbody .tr-wrapper.expandable button.tr{
   cursor: pointer;
 }
 .expand-table-wrapper .expand-table .tbody .tr-wrapper.expandable .expand-comp-wrapper{
   width: 100%;
   height: 100%;
-  border-top: 1px solid var(--gray-3);
 }
 .expand-table-wrapper .expand-table .tbody .tr-wrapper button.tr{
   -webkit-user-select: text;
@@ -30982,13 +31025,9 @@ p.kg-collection-card-post-excerpt{
           user-select: text;
   background: transparent;
   width: 100%;
-  padding: var(--space-3) var(--space-5);
-  min-height: 64px;
   display: grid;
   flex-direction: row;
   align-items: center;
-  border: none;
-  border-radius: var(--radius-6);
 }
 .expand-table-wrapper .expand-table .tbody .tr-wrapper button.tr .td{
   font-size: var(--font-size-2);
@@ -31005,7 +31044,7 @@ p.kg-collection-card-post-excerpt{
 .tipp-pagination .page-button{
   width: 40px;
   height: 40px;
-  border-radius: 50%;
+  border-radius: 8px;
   border: 0;
   background-color: transparent;
   transition: 0.5s background-color;

package/dist/index.js

@@ -2,16 +2,13 @@ import "./chunk-L5N6ITS7.js";
 import "./chunk-GSMBJMXJ.js";
 import "./chunk-NMLVUAFW.js";
 import "./chunk-6AVVI6B5.js";
-import {
-  useThemeContext
-} from "./chunk-MMGP4GEQ.js";
 import {
   uiProps
 } from "./chunk-NVKNDAIN.js";
-import "./chunk-JLAPJ7MX.js";
 import {
-  SessionUserInfoDetail
-} from "./chunk-5ZEQ33PC.js";
+  useThemeContext
+} from "./chunk-MMGP4GEQ.js";
+import "./chunk-JLAPJ7MX.js";
 import {
   CoachingCustomerInfo
 } from "./chunk-7ZMY4CAZ.js";
@@ -24,6 +21,9 @@ import {
 import {
   CoachingCustomerInfoMedium
 } from "./chunk-44VLRAHW.js";
+import {
+  SessionUserInfoDetail
+} from "./chunk-5ZEQ33PC.js";
 import "./chunk-JWAQUXGB.js";
 import {
   ReservationCard
@@ -62,27 +62,12 @@ import {
   CoachQuestionList
 } from "./chunk-3GGJWSFK.js";
 import "./chunk-QDXZVPRR.js";
-import {
-  ExpandTable,
-  createColumnHelper
-} from "./chunk-LAZUFZRZ.js";
-import "./chunk-JCG2AUFJ.js";
 import "./chunk-AS7ID74X.js";
 import {
   CurriculumBody
-} from "./chunk-27MOXAR2.js";
-import {
-  CurriculumSidebar
-} from "./chunk-EDDPJB52.js";
-import "./chunk-SZA3RAKD.js";
-import "./chunk-WS7IOHVK.js";
-import "./chunk-6L4OTKID.js";
-import "./chunk-SDEDXT7A.js";
-import "./chunk-4TST4UK5.js";
-import "./chunk-LHKGSKKG.js";
-import "./chunk-43FK4CS3.js";
-import "./chunk-ZDMAVBNK.js";
-import "./chunk-JNYTH4BZ.js";
+} from "./chunk-6V47NXW5.js";
+import "./chunk-GFBHPXDF.js";
+import "./chunk-OX3N37YY.js";
 import "./chunk-W3TY3SYU.js";
 import "./chunk-QIRUYN3K.js";
 import "./chunk-BUZDDAS6.js";
@@ -94,8 +79,29 @@ import "./chunk-AQVIQODP.js";
 import "./chunk-WHZZKXOD.js";
 import "./chunk-YT4LGWIY.js";
 import "./chunk-PYGTM7ML.js";
+import "./chunk-JNYTH4BZ.js";
 import "./chunk-GMKRNFH5.js";
 import "./chunk-QGKQ3IX7.js";
+import {
+  CurriculumSidebar
+} from "./chunk-Y724ZBAT.js";
+import "./chunk-KTUCYAG7.js";
+import "./chunk-4TST4UK5.js";
+import "./chunk-WS7IOHVK.js";
+import "./chunk-6L4OTKID.js";
+import "./chunk-SDEDXT7A.js";
+import {
+  ExpandTable,
+  createColumnHelper
+} from "./chunk-ZBZ7IGBT.js";
+import "./chunk-JCG2AUFJ.js";
+import "./chunk-LHKGSKKG.js";
+import {
+  DatePickerButton
+} from "./chunk-I46J2XHG.js";
+import {
+  DatePicker
+} from "./chunk-FVTBDVT4.js";
 import {
   CurriculumSubNav
 } from "./chunk-OUJ7TDIH.js";
@@ -106,12 +112,6 @@ import {
 import {
   CurriculumV2Layout
 } from "./chunk-CQSM6JCO.js";
-import {
-  DatePickerButton
-} from "./chunk-I46J2XHG.js";
-import {
-  DatePicker
-} from "./chunk-FVTBDVT4.js";
 import "./chunk-JF7JAMOQ.js";
 import {
   RadioButtonCard
@@ -126,9 +126,6 @@ import {
   TimeSelect
 } from "./chunk-7PF6I4RN.js";
 import "./chunk-V2DF2GUE.js";
-import {
-  scrollTo
-} from "./chunk-BXX3B3E4.js";
 import {
   getColumnMeta
 } from "./chunk-NRPDVI76.js";
@@ -140,6 +137,9 @@ import {
   getTimeOptions,
   parseTimeOption
 } from "./chunk-NWJSLIQ3.js";
+import {
+  scrollTo
+} from "./chunk-BXX3B3E4.js";
 import {
   DynamicFormResponseItem
 } from "./chunk-QTQKJ4A2.js";
@@ -243,7 +243,7 @@ import {
 } from "./chunk-WV2HN6H4.js";
 import {
   Pagination
-} from "./chunk-JAMNT4FG.js";
+} from "./chunk-SBJOKO35.js";
 import {
   Popover
 } from "./chunk-5AVBYDPB.js";

package/dist/molecules/curriculumV2/CurriculumContents/CurriculumReviewSteps/index.js

@@ -1,7 +1,6 @@
 import {
   CurriculumReviewSteps_default
-} from "../../../../chunk-ZDMAVBNK.js";
-import "../../../../chunk-JNYTH4BZ.js";
+} from "../../../../chunk-OX3N37YY.js";
 import "../../../../chunk-W3TY3SYU.js";
 import "../../../../chunk-QIRUYN3K.js";
 import "../../../../chunk-BUZDDAS6.js";
@@ -13,6 +12,7 @@ import "../../../../chunk-AQVIQODP.js";
 import "../../../../chunk-WHZZKXOD.js";
 import "../../../../chunk-YT4LGWIY.js";
 import "../../../../chunk-PYGTM7ML.js";
+import "../../../../chunk-JNYTH4BZ.js";
 import "../../../../chunk-GMKRNFH5.js";
 import "../../../../chunk-JF7JAMOQ.js";
 import "../../../../chunk-CSKNBWPB.js";

package/dist/molecules/curriculumV2/CurriculumContents/curriculum-review.js

@@ -1,8 +1,7 @@
 import {
   curriculum_review_default
-} from "../../../chunk-43FK4CS3.js";
-import "../../../chunk-ZDMAVBNK.js";
-import "../../../chunk-JNYTH4BZ.js";
+} from "../../../chunk-GFBHPXDF.js";
+import "../../../chunk-OX3N37YY.js";
 import "../../../chunk-W3TY3SYU.js";
 import "../../../chunk-QIRUYN3K.js";
 import "../../../chunk-BUZDDAS6.js";
@@ -14,6 +13,7 @@ import "../../../chunk-AQVIQODP.js";
 import "../../../chunk-WHZZKXOD.js";
 import "../../../chunk-YT4LGWIY.js";
 import "../../../chunk-PYGTM7ML.js";
+import "../../../chunk-JNYTH4BZ.js";
 import "../../../chunk-GMKRNFH5.js";
 import "../../../chunk-IYQJIEVM.js";
 import "../../../chunk-JF7JAMOQ.js";

package/dist/molecules/curriculumV2/CurriculumContents/index.js

@@ -1,10 +1,8 @@
 import {
   CurriculumBody
-} from "../../../chunk-27MOXAR2.js";
-import "../../../chunk-LHKGSKKG.js";
-import "../../../chunk-43FK4CS3.js";
-import "../../../chunk-ZDMAVBNK.js";
-import "../../../chunk-JNYTH4BZ.js";
+} from "../../../chunk-6V47NXW5.js";
+import "../../../chunk-GFBHPXDF.js";
+import "../../../chunk-OX3N37YY.js";
 import "../../../chunk-W3TY3SYU.js";
 import "../../../chunk-QIRUYN3K.js";
 import "../../../chunk-BUZDDAS6.js";
@@ -16,8 +14,10 @@ import "../../../chunk-AQVIQODP.js";
 import "../../../chunk-WHZZKXOD.js";
 import "../../../chunk-YT4LGWIY.js";
 import "../../../chunk-PYGTM7ML.js";
+import "../../../chunk-JNYTH4BZ.js";
 import "../../../chunk-GMKRNFH5.js";
 import "../../../chunk-QGKQ3IX7.js";
+import "../../../chunk-LHKGSKKG.js";
 import "../../../chunk-IYQJIEVM.js";
 import "../../../chunk-JF7JAMOQ.js";
 import "../../../chunk-CSKNBWPB.js";

package/dist/molecules/curriculumV2/CurriculumSidebar/index.js

@@ -1,11 +1,11 @@
 import {
   CurriculumSidebar
-} from "../../../chunk-EDDPJB52.js";
-import "../../../chunk-SZA3RAKD.js";
+} from "../../../chunk-Y724ZBAT.js";
+import "../../../chunk-KTUCYAG7.js";
+import "../../../chunk-4TST4UK5.js";
 import "../../../chunk-WS7IOHVK.js";
 import "../../../chunk-6L4OTKID.js";
 import "../../../chunk-SDEDXT7A.js";
-import "../../../chunk-4TST4UK5.js";
 import "../../../chunk-IYQJIEVM.js";
 import "../../../chunk-JF7JAMOQ.js";
 import "../../../chunk-5ZITU5L7.js";

package/dist/molecules/curriculumV2/CurriculumSidebar/sidebar-item.js

@@ -1,10 +1,10 @@
 import {
   sidebar_item_default
-} from "../../../chunk-SZA3RAKD.js";
+} from "../../../chunk-KTUCYAG7.js";
+import "../../../chunk-4TST4UK5.js";
 import "../../../chunk-WS7IOHVK.js";
 import "../../../chunk-6L4OTKID.js";
 import "../../../chunk-SDEDXT7A.js";
-import "../../../chunk-4TST4UK5.js";
 import "../../../chunk-JF7JAMOQ.js";
 import "../../../chunk-HYITAA4J.js";
 import "../../../chunk-EGEQY3KT.js";

package/dist/molecules/curriculumV2/index.js

@@ -1,19 +1,9 @@
 import "../../chunk-AS7ID74X.js";
 import {
   CurriculumBody
-} from "../../chunk-27MOXAR2.js";
-import {
-  CurriculumSidebar
-} from "../../chunk-EDDPJB52.js";
-import "../../chunk-SZA3RAKD.js";
-import "../../chunk-WS7IOHVK.js";
-import "../../chunk-6L4OTKID.js";
-import "../../chunk-SDEDXT7A.js";
-import "../../chunk-4TST4UK5.js";
-import "../../chunk-LHKGSKKG.js";
-import "../../chunk-43FK4CS3.js";
-import "../../chunk-ZDMAVBNK.js";
-import "../../chunk-JNYTH4BZ.js";
+} from "../../chunk-6V47NXW5.js";
+import "../../chunk-GFBHPXDF.js";
+import "../../chunk-OX3N37YY.js";
 import "../../chunk-W3TY3SYU.js";
 import "../../chunk-QIRUYN3K.js";
 import "../../chunk-BUZDDAS6.js";
@@ -25,8 +15,18 @@ import "../../chunk-AQVIQODP.js";
 import "../../chunk-WHZZKXOD.js";
 import "../../chunk-YT4LGWIY.js";
 import "../../chunk-PYGTM7ML.js";
+import "../../chunk-JNYTH4BZ.js";
 import "../../chunk-GMKRNFH5.js";
 import "../../chunk-QGKQ3IX7.js";
+import {
+  CurriculumSidebar
+} from "../../chunk-Y724ZBAT.js";
+import "../../chunk-KTUCYAG7.js";
+import "../../chunk-4TST4UK5.js";
+import "../../chunk-WS7IOHVK.js";
+import "../../chunk-6L4OTKID.js";
+import "../../chunk-SDEDXT7A.js";
+import "../../chunk-LHKGSKKG.js";
 import {
   CurriculumSubNav
 } from "../../chunk-OUJ7TDIH.js";

package/dist/molecules/expand-table/index.cjs

@@ -735,7 +735,7 @@ function Pagination(props) {
     size: "large",
     style: { borderRadius: "50%" }
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_themes.Flex, { align: "center", className: "tipp-pagination", gap: "4", children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_themes.Flex, { align: "center", className: "tipp-pagination", children: [
     /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
       IconButton,
       __spreadProps(__spreadValues({
@@ -866,7 +866,24 @@ function Row(props) {
 }
 
 // src/molecules/expand-table/index.tsx
+var import_themes5 = require("@radix-ui/themes");
 var import_jsx_runtime19 = require("react/jsx-runtime");
+var sortButtonColorMapper = {
+  card: {
+    selected: "var(--iris-10)",
+    unselected: "var(--iris-6)"
+  },
+  sprite: {
+    // selected: 'var(--gray-a12)',
+    // unselected: 'var(--gray-a6)',
+    selected: "var(--iris-10)",
+    unselected: "var(--iris-6)"
+  },
+  "sprite-border": {
+    selected: "var(--iris-10)",
+    unselected: "var(--iris-6)"
+  }
+};
 function ExpandTable(props) {
   const {
     data,
@@ -881,7 +898,8 @@ function ExpandTable(props) {
     pageSize = 10,
     siblingCount = 2,
     getRowStyle,
-    getCellStyle
+    getCellStyle,
+    variant = "card"
   } = props;
   const defaultAlign = "left";
   const [pagination, setPagination] = (0, import_react6.useState)({
@@ -942,7 +960,7 @@ function ExpandTable(props) {
     if (!data) return 0;
     return Math.ceil(data.length / pageSize);
   }, [data, pageSize]);
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "expand-table-wrapper", children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: `expand-table-wrapper ${variant}`, children: [
     /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "expand-table", style: tableStyle, children: [
       /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "thead", children: getHeaderGroups().map((headerGroup) => /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
         "div",
@@ -972,16 +990,22 @@ function ExpandTable(props) {
                         direction: "column",
                         style: { marginLeft: "var(--space-2)" },
                         children: [
-                          /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+                          sortedState === false && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+                            TriangleArrowDownIcon,
+                            {
+                              color: sortButtonColorMapper[variant].unselected
+                            }
+                          ),
+                          sortedState === "asc" && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
                             TriangleArrowUpIcon,
                             {
-                              color: sortedState === "asc" ? "var(--iris-10)" : "var(--iris-6)"
+                              color: sortButtonColorMapper[variant].selected
                             }
                           ),
-                          /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+                          sortedState === "desc" && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
                             TriangleArrowDownIcon,
                             {
-                              color: sortedState === "desc" ? "var(--iris-10)" : "var(--iris-6)"
+                              color: sortButtonColorMapper[variant].selected
                             }
                           )
                         ]
@@ -991,15 +1015,15 @@ function ExpandTable(props) {
                 }
               ) }, header.id);
             }
-            return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: `${justifyContent} th`, children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { style: { cursor: "default" }, children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(Typo, { as: "div", variant: "body", children: (0, import_react_table2.flexRender)(
+            return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: `${justifyContent} th`, children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(Typo, { as: "div", variant: "body", children: (0, import_react_table2.flexRender)(
               header.column.columnDef.header,
               header.getContext()
-            ) }) }) }, header.id);
+            ) }) }, header.id);
           })
         },
         headerGroup.id
       )) }),
-      /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "tbody", children: helpCompRender(rowModels.rows.length) || rowModels.rows.map((row) => {
+      /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_themes5.ScrollArea, { className: "tbody", children: helpCompRender(rowModels.rows.length) || rowModels.rows.map((row) => {
         return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
           Row,
           {
@@ -1015,7 +1039,7 @@ function ExpandTable(props) {
         );
       }) })
     ] }),
-    showPagination ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_themes.Flex, { justify: "end", pt: "3", width: "100%", children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+    showPagination ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_themes.Flex, { justify: "end", pt: "4", width: "100%", children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
       Pagination,
       {
         count: pageCount,