@selfdecode/sd-component-library 4.0.96 → 4.0.97

package/lib/sd-component-library261.js.map

@@ -1 +1 @@
-{"version":3,"file":"sd-component-library261.js","sources":["../src/components/page-selectors/page-selector/assets/next.svg"],"sourcesContent":["export default \"data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI3IiBoZWlnaHQ9IjEzIiB2aWV3Qm94PSIwIDAgNyAxMyI+CiAgPHBhdGggaWQ9IkZvcm1hXzFfY29weV8zIiBkYXRhLW5hbWU9IkZvcm1hIDEgY29weSAzIiBkPSJNODEwNS4yNyw1MjUxLjg4bDUuNi02LjA4YTAuNDM1LDAuNDM1LDAsMCwwLDAtLjZsLTUuNi02LjA4YTAuMzQ5LDAuMzQ5LDAsMCwwLS4yNy0wLjEzLDAuMzU0LDAuMzU0LDAsMCwwLS4yOC4xM2wtMC42LjY1YTAuNDM1LDAuNDM1LDAsMCwwLDAsLjZsNC43Miw1LjEzLTQuNzIsNS4xM2EwLjQyMywwLjQyMywwLDAsMC0uMTIuMywwLjQ0MSwwLjQ0MSwwLDAsMCwuMTIuM2wwLjYsMC42NWEwLjM1NCwwLjM1NCwwLDAsMCwuMjguMTNBMC4zNDksMC4zNDksMCwwLDAsODEwNS4yNyw1MjUxLjg4WiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTgxMDQgLTUyMzkpIi8+Cjwvc3ZnPgo=\""],"names":["SvgNext","props","React"],"mappings":";AACK,MAACA,IAAU,CAACC,MAA0B,gBAAAC,EAAM,cAAc,OAAO,EAAE,OAAO,8BAA8B,OAAO,GAAG,QAAQ,IAAI,SAAS,YAAY,GAAGD,EAAO,GAAkB,gBAAAC,EAAM,cAAc,QAAQ,EAAE,IAAI,kBAAkB,aAAa,kBAAkB,GAAG,0RAA0R,WAAW,yBAAwB,CAAE,CAAC;"}
+{"version":3,"file":"sd-component-library261.js","sources":["../src/components/pagination-bars/pagination-bar-mobile/partials/pagination-bar-button/pagination-bar-button.tsx"],"sourcesContent":["import React, { PropsWithChildren } from \"react\";\n\nimport { FlexCenter } from \"../../../../containers\";\nimport { PaginationBarButtonProps as Props } from \"./interfaces\";\n\nexport const PaginationBarButton: React.FC<PropsWithChildren<Props>> = ({\n  children,\n  disabled,\n  onClick,\n}) => {\n  const color = disabled ? \"cl_lightGrey\" : \"cl_blue\";\n  return (\n    <FlexCenter\n      height=\"100%\"\n      sx={{\n        borderWidth: \"2px\",\n        borderColor: color,\n        borderStyle: \"solid\",\n        borderRadius: \"5px\",\n        fill: color,\n      }}\n      onClick={disabled ? undefined : onClick}\n    >\n      {children}\n    </FlexCenter>\n  );\n};\n"],"names":["PaginationBarButton","children","disabled","onClick","color","jsx","FlexCenter"],"mappings":";;AAKO,MAAMA,IAA0D,CAAC;AAAA,EACtE,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,SAAAC;AACF,MAAM;AACE,QAAAC,IAAQF,IAAW,iBAAiB;AAExC,SAAAG,gBAAAA,EAAA;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,QAAO;AAAA,MACP,IAAI;AAAA,QACF,aAAa;AAAA,QACb,aAAaF;AAAA,QACb,aAAa;AAAA,QACb,cAAc;AAAA,QACd,MAAMA;AAAA,MACR;AAAA,MACA,SAASF,IAAW,SAAYC;AAAA,MAE/B,UAAAF;AAAA,IAAA;AAAA,EAAA;AAGP;"}

package/lib/sd-component-library262.js

@@ -1,28 +1,25 @@
-import { j as i } from "./sd-component-library197.js";
-import { FlexCenter as l } from "./sd-component-library35.js";
-const x = ({
-  children: t,
-  disabled: o,
-  onClick: e
-}) => {
-  const r = o ? "cl_lightGrey" : "cl_blue";
-  return /* @__PURE__ */ i.jsx(
-    l,
-    {
+import { j as r } from "./sd-component-library197.js";
+import { ResponsiveTextV2 as t } from "./sd-component-library151.js";
+const n = ({
+  children: e
+}) => /* @__PURE__ */ r.jsx(
+  t,
+  {
+    fontSizeWeight: [18, "regular"],
+    sx: {
+      display: "flex",
+      alignItems: "center",
+      justifyContent: "center",
       height: "100%",
-      sx: {
-        borderWidth: "2px",
-        borderColor: r,
-        borderStyle: "solid",
-        borderRadius: "5px",
-        fill: r
-      },
-      onClick: o ? void 0 : e,
-      children: t
-    }
-  );
-};
+      borderRadius: "5px",
+      borderWidth: "1px",
+      borderColor: "cl_lightGrey",
+      borderStyle: "solid"
+    },
+    children: e
+  }
+);
 export {
-  x as PaginationBarButton
+  n as PaginationBarCurrentPage
 };
 //# sourceMappingURL=sd-component-library262.js.map

package/lib/sd-component-library262.js.map

@@ -1 +1 @@
-{"version":3,"file":"sd-component-library262.js","sources":["../src/components/pagination-bars/pagination-bar-mobile/partials/pagination-bar-button/pagination-bar-button.tsx"],"sourcesContent":["import React, { PropsWithChildren } from \"react\";\n\nimport { FlexCenter } from \"../../../../containers\";\nimport { PaginationBarButtonProps as Props } from \"./interfaces\";\n\nexport const PaginationBarButton: React.FC<PropsWithChildren<Props>> = ({\n  children,\n  disabled,\n  onClick,\n}) => {\n  const color = disabled ? \"cl_lightGrey\" : \"cl_blue\";\n  return (\n    <FlexCenter\n      height=\"100%\"\n      sx={{\n        borderWidth: \"2px\",\n        borderColor: color,\n        borderStyle: \"solid\",\n        borderRadius: \"5px\",\n        fill: color,\n      }}\n      onClick={disabled ? undefined : onClick}\n    >\n      {children}\n    </FlexCenter>\n  );\n};\n"],"names":["PaginationBarButton","children","disabled","onClick","color","jsx","FlexCenter"],"mappings":";;AAKO,MAAMA,IAA0D,CAAC;AAAA,EACtE,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,SAAAC;AACF,MAAM;AACE,QAAAC,IAAQF,IAAW,iBAAiB;AAExC,SAAAG,gBAAAA,EAAA;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,QAAO;AAAA,MACP,IAAI;AAAA,QACF,aAAa;AAAA,QACb,aAAaF;AAAA,QACb,aAAa;AAAA,QACb,cAAc;AAAA,QACd,MAAMA;AAAA,MACR;AAAA,MACA,SAASF,IAAW,SAAYC;AAAA,MAE/B,UAAAF;AAAA,IAAA;AAAA,EAAA;AAGP;"}
+{"version":3,"file":"sd-component-library262.js","sources":["../src/components/pagination-bars/pagination-bar-mobile/partials/pagination-bar-current-page/pagination-bar-current-page.tsx"],"sourcesContent":["import React, { PropsWithChildren } from \"react\";\n\nimport { ResponsiveTextV2 } from \"../../../../texts\";\n\nexport const PaginationBarCurrentPage: React.FC<PropsWithChildren<{}>> = ({\n  children,\n}) => {\n  return (\n    <ResponsiveTextV2\n      fontSizeWeight={[18, \"regular\"]}\n      sx={{\n        display: \"flex\",\n        alignItems: \"center\",\n        justifyContent: \"center\",\n        height: \"100%\",\n        borderRadius: \"5px\",\n        borderWidth: \"1px\",\n        borderColor: \"cl_lightGrey\",\n        borderStyle: \"solid\",\n      }}\n    >\n      {children}\n    </ResponsiveTextV2>\n  );\n};\n"],"names":["PaginationBarCurrentPage","children","jsx","ResponsiveTextV2"],"mappings":";;AAIO,MAAMA,IAA4D,CAAC;AAAA,EACxE,UAAAC;AACF,MAEIC,gBAAAA,EAAA;AAAA,EAACC;AAAA,EAAA;AAAA,IACC,gBAAgB,CAAC,IAAI,SAAS;AAAA,IAC9B,IAAI;AAAA,MACF,SAAS;AAAA,MACT,YAAY;AAAA,MACZ,gBAAgB;AAAA,MAChB,QAAQ;AAAA,MACR,cAAc;AAAA,MACd,aAAa;AAAA,MACb,aAAa;AAAA,MACb,aAAa;AAAA,IACf;AAAA,IAEC,UAAAF;AAAA,EAAA;AAAA;"}

package/lib/sd-component-library263.js

@@ -1,25 +1,33 @@
-import { j as r } from "./sd-component-library197.js";
+import { j as e } from "./sd-component-library197.js";
+import { FlexCenterSpaceBetween as p } from "./sd-component-library35.js";
 import { ResponsiveTextV2 as t } from "./sd-component-library151.js";
-const n = ({
-  children: e
-}) => /* @__PURE__ */ r.jsx(
-  t,
+const h = ({
+  title: i,
+  secondaryText: r,
+  textTransform: o,
+  ...n
+}) => /* @__PURE__ */ e.jsxs(
+  p,
   {
-    fontSizeWeight: [18, "regular"],
-    sx: {
-      display: "flex",
-      alignItems: "center",
-      justifyContent: "center",
-      height: "100%",
-      borderRadius: "5px",
-      borderWidth: "1px",
-      borderColor: "cl_lightGrey",
-      borderStyle: "solid"
-    },
-    children: e
+    width: "100%",
+    p: "12px 16px",
+    bg: "white",
+    sx: { cursor: "pointer" },
+    ...n,
+    children: [
+      /* @__PURE__ */ e.jsx(
+        t,
+        {
+          fontSizeWeight: [16, "regular"],
+          textTransform: o,
+          children: i
+        }
+      ),
+      r && /* @__PURE__ */ e.jsx(t, { fontSizeWeight: [14, "regular"], children: r })
+    ]
   }
 );
 export {
-  n as PaginationBarCurrentPage
+  h as CustomOptionBox
 };
 //# sourceMappingURL=sd-component-library263.js.map

package/lib/sd-component-library263.js.map

@@ -1 +1 @@
-{"version":3,"file":"sd-component-library263.js","sources":["../src/components/pagination-bars/pagination-bar-mobile/partials/pagination-bar-current-page/pagination-bar-current-page.tsx"],"sourcesContent":["import React, { PropsWithChildren } from \"react\";\n\nimport { ResponsiveTextV2 } from \"../../../../texts\";\n\nexport const PaginationBarCurrentPage: React.FC<PropsWithChildren<{}>> = ({\n  children,\n}) => {\n  return (\n    <ResponsiveTextV2\n      fontSizeWeight={[18, \"regular\"]}\n      sx={{\n        display: \"flex\",\n        alignItems: \"center\",\n        justifyContent: \"center\",\n        height: \"100%\",\n        borderRadius: \"5px\",\n        borderWidth: \"1px\",\n        borderColor: \"cl_lightGrey\",\n        borderStyle: \"solid\",\n      }}\n    >\n      {children}\n    </ResponsiveTextV2>\n  );\n};\n"],"names":["PaginationBarCurrentPage","children","jsx","ResponsiveTextV2"],"mappings":";;AAIO,MAAMA,IAA4D,CAAC;AAAA,EACxE,UAAAC;AACF,MAEIC,gBAAAA,EAAA;AAAA,EAACC;AAAA,EAAA;AAAA,IACC,gBAAgB,CAAC,IAAI,SAAS;AAAA,IAC9B,IAAI;AAAA,MACF,SAAS;AAAA,MACT,YAAY;AAAA,MACZ,gBAAgB;AAAA,MAChB,QAAQ;AAAA,MACR,cAAc;AAAA,MACd,aAAa;AAAA,MACb,aAAa;AAAA,MACb,aAAa;AAAA,IACf;AAAA,IAEC,UAAAF;AAAA,EAAA;AAAA;"}
+{"version":3,"file":"sd-component-library263.js","sources":["../src/components/selectors/custom-selector/partials/custom-option-box/custom-option-box.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { FlexCenterSpaceBetween } from \"../../../../containers\";\nimport { ResponsiveTextV2 } from \"../../../../texts\";\nimport { CustomOptionBoxProps as Props } from \"./interfaces\";\n\nexport const CustomOptionBox: React.FC<Props> = ({\n  title,\n  secondaryText,\n  textTransform,\n  ...props\n}) => {\n  return (\n    <FlexCenterSpaceBetween\n      width=\"100%\"\n      p=\"12px 16px\"\n      bg=\"white\"\n      sx={{ cursor: \"pointer\" }}\n      {...props}\n    >\n      <ResponsiveTextV2\n        fontSizeWeight={[16, \"regular\"]}\n        textTransform={textTransform}\n      >\n        {title}\n      </ResponsiveTextV2>\n\n      {secondaryText && (\n        <ResponsiveTextV2 fontSizeWeight={[14, \"regular\"]}>\n          {secondaryText}\n        </ResponsiveTextV2>\n      )}\n    </FlexCenterSpaceBetween>\n  );\n};\n"],"names":["CustomOptionBox","title","secondaryText","textTransform","props","jsxs","FlexCenterSpaceBetween","jsx","ResponsiveTextV2"],"mappings":";;;AAMO,MAAMA,IAAmC,CAAC;AAAA,EAC/C,OAAAC;AAAA,EACA,eAAAC;AAAA,EACA,eAAAC;AAAA,EACA,GAAGC;AACL,MAEIC,gBAAAA,EAAA;AAAA,EAACC;AAAA,EAAA;AAAA,IACC,OAAM;AAAA,IACN,GAAE;AAAA,IACF,IAAG;AAAA,IACH,IAAI,EAAE,QAAQ,UAAU;AAAA,IACvB,GAAGF;AAAA,IAEJ,UAAA;AAAA,MAAAG,gBAAAA,EAAA;AAAA,QAACC;AAAA,QAAA;AAAA,UACC,gBAAgB,CAAC,IAAI,SAAS;AAAA,UAC9B,eAAAL;AAAA,UAEC,UAAAF;AAAA,QAAA;AAAA,MACH;AAAA,MAECC,2BACEM,GAAiB,EAAA,gBAAgB,CAAC,IAAI,SAAS,GAC7C,UACHN,GAAA;AAAA,IAAA;AAAA,EAAA;AAAA;"}

package/lib/sd-component-library264.js

@@ -1,33 +1,54 @@
-import { j as e } from "./sd-component-library197.js";
-import { FlexCenterSpaceBetween as p } from "./sd-component-library35.js";
-import { ResponsiveTextV2 as t } from "./sd-component-library151.js";
-const h = ({
-  title: i,
-  secondaryText: r,
-  textTransform: o,
-  ...n
-}) => /* @__PURE__ */ e.jsxs(
-  p,
-  {
-    width: "100%",
-    p: "12px 16px",
-    bg: "white",
-    sx: { cursor: "pointer" },
-    ...n,
-    children: [
-      /* @__PURE__ */ e.jsx(
-        t,
-        {
-          fontSizeWeight: [16, "regular"],
-          textTransform: o,
-          children: i
-        }
-      ),
-      r && /* @__PURE__ */ e.jsx(t, { fontSizeWeight: [14, "regular"], children: r })
-    ]
-  }
-);
+import { j as r } from "./sd-component-library197.js";
+import s from "react";
+import { Box as n } from "rebass";
+import { TriangularPointerIcon as m } from "./sd-component-library191.js";
+import { SecondaryCustomSelectorOptionRow as x } from "./sd-component-library325.js";
+import { HorizontalDivider as i } from "./sd-component-library49.js";
+const f = ({
+  options: t,
+  onSelect: l
+}) => {
+  const c = (o) => () => l(o);
+  return /* @__PURE__ */ r.jsxs(
+    n,
+    {
+      sx: {
+        position: "absolute",
+        right: "-16px",
+        top: "calc(100% - 12px)",
+        minWidth: "calc(100% + 16px)",
+        zIndex: 1
+      },
+      children: [
+        /* @__PURE__ */ r.jsx(m, { direction: "top", mr: "15px", ml: "auto" }),
+        /* @__PURE__ */ r.jsx(i, { height: "2px", color: "cl_purple" }),
+        t.map((o, e) => /* @__PURE__ */ r.jsxs(s.Fragment, { children: [
+          e !== 0 && /* @__PURE__ */ r.jsx(
+            i,
+            {
+              color: "cl_headerLine",
+              sx: {
+                borderStyle: "none solid",
+                borderColor: "cl_lightGrey",
+                borderWidth: "1px"
+              }
+            }
+          ),
+          /* @__PURE__ */ r.jsx(
+            x,
+            {
+              title: o.title,
+              onClick: c(o),
+              isLast: e === t.length - 1
+            },
+            o.id
+          )
+        ] }, o.id))
+      ]
+    }
+  );
+};
 export {
-  h as CustomOptionBox
+  f as SecondaryCustomSelectorOptionsBox
 };
 //# sourceMappingURL=sd-component-library264.js.map

package/lib/sd-component-library264.js.map

@@ -1 +1 @@
-{"version":3,"file":"sd-component-library264.js","sources":["../src/components/selectors/custom-selector/partials/custom-option-box/custom-option-box.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { FlexCenterSpaceBetween } from \"../../../../containers\";\nimport { ResponsiveTextV2 } from \"../../../../texts\";\nimport { CustomOptionBoxProps as Props } from \"./interfaces\";\n\nexport const CustomOptionBox: React.FC<Props> = ({\n  title,\n  secondaryText,\n  textTransform,\n  ...props\n}) => {\n  return (\n    <FlexCenterSpaceBetween\n      width=\"100%\"\n      p=\"12px 16px\"\n      bg=\"white\"\n      sx={{ cursor: \"pointer\" }}\n      {...props}\n    >\n      <ResponsiveTextV2\n        fontSizeWeight={[16, \"regular\"]}\n        textTransform={textTransform}\n      >\n        {title}\n      </ResponsiveTextV2>\n\n      {secondaryText && (\n        <ResponsiveTextV2 fontSizeWeight={[14, \"regular\"]}>\n          {secondaryText}\n        </ResponsiveTextV2>\n      )}\n    </FlexCenterSpaceBetween>\n  );\n};\n"],"names":["CustomOptionBox","title","secondaryText","textTransform","props","jsxs","FlexCenterSpaceBetween","jsx","ResponsiveTextV2"],"mappings":";;;AAMO,MAAMA,IAAmC,CAAC;AAAA,EAC/C,OAAAC;AAAA,EACA,eAAAC;AAAA,EACA,eAAAC;AAAA,EACA,GAAGC;AACL,MAEIC,gBAAAA,EAAA;AAAA,EAACC;AAAA,EAAA;AAAA,IACC,OAAM;AAAA,IACN,GAAE;AAAA,IACF,IAAG;AAAA,IACH,IAAI,EAAE,QAAQ,UAAU;AAAA,IACvB,GAAGF;AAAA,IAEJ,UAAA;AAAA,MAAAG,gBAAAA,EAAA;AAAA,QAACC;AAAA,QAAA;AAAA,UACC,gBAAgB,CAAC,IAAI,SAAS;AAAA,UAC9B,eAAAL;AAAA,UAEC,UAAAF;AAAA,QAAA;AAAA,MACH;AAAA,MAECC,2BACEM,GAAiB,EAAA,gBAAgB,CAAC,IAAI,SAAS,GAC7C,UACHN,GAAA;AAAA,IAAA;AAAA,EAAA;AAAA;"}
+{"version":3,"file":"sd-component-library264.js","sources":["../src/components/selectors/secondary-custom-selector/partials/secondary-custom-selector-options-box/secondary-custom-selector-options-box.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { Box } from \"rebass\";\n\nimport { HorizontalDivider } from \"../../../../dividers\";\nimport { TriangularPointerIcon } from \"../../../../icons\";\nimport { SelectorOptionV2 } from \"../../../selector-v2\";\nimport { SecondaryCustomSelectorOptionRow } from \"../secondary-custom-selector-option-row\";\nimport { SecondaryCustomSelectorOptionsBoxProps as Props } from \"./interfaces\";\n\nexport const SecondaryCustomSelectorOptionsBox = <T extends string = string>({\n  options,\n  onSelect,\n}: Props<T>) => {\n  const onClick = (option: SelectorOptionV2<T>) => () => onSelect(option);\n\n  return (\n    <Box\n      sx={{\n        position: \"absolute\",\n        right: \"-16px\",\n        top: \"calc(100% - 12px)\",\n        minWidth: \"calc(100% + 16px)\",\n        zIndex: 1,\n      }}\n    >\n      <TriangularPointerIcon direction=\"top\" mr=\"15px\" ml=\"auto\" />\n\n      <HorizontalDivider height=\"2px\" color=\"cl_purple\" />\n\n      {options.map((option, idx) => (\n        <React.Fragment key={option.id}>\n          {idx !== 0 && (\n            <HorizontalDivider\n              color=\"cl_headerLine\"\n              sx={{\n                borderStyle: \"none solid\",\n                borderColor: \"cl_lightGrey\",\n                borderWidth: \"1px\",\n              }}\n            />\n          )}\n\n          <SecondaryCustomSelectorOptionRow\n            key={option.id}\n            title={option.title}\n            onClick={onClick(option)}\n            isLast={idx === options.length - 1}\n          />\n        </React.Fragment>\n      ))}\n    </Box>\n  );\n};\n"],"names":["SecondaryCustomSelectorOptionsBox","options","onSelect","onClick","option","jsxs","Box","jsx","TriangularPointerIcon","HorizontalDivider","idx","React","SecondaryCustomSelectorOptionRow"],"mappings":";;;;;;AAUO,MAAMA,IAAoC,CAA4B;AAAA,EAC3E,SAAAC;AAAA,EACA,UAAAC;AACF,MAAgB;AACd,QAAMC,IAAU,CAACC,MAAgC,MAAMF,EAASE,CAAM;AAGpE,SAAAC,gBAAAA,EAAA;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,IAAI;AAAA,QACF,UAAU;AAAA,QACV,OAAO;AAAA,QACP,KAAK;AAAA,QACL,UAAU;AAAA,QACV,QAAQ;AAAA,MACV;AAAA,MAEA,UAAA;AAAA,QAAAC,gBAAAA,MAACC,KAAsB,WAAU,OAAM,IAAG,QAAO,IAAG,QAAO;AAAA,QAE1DD,gBAAAA,EAAA,IAAAE,GAAA,EAAkB,QAAO,OAAM,OAAM,aAAY;AAAA,QAEjDR,EAAQ,IAAI,CAACG,GAAQM,MACnBL,gBAAAA,EAAAA,KAAAM,EAAM,UAAN,EACE,UAAA;AAAA,UAAAD,MAAQ,KACPH,gBAAAA,EAAA;AAAA,YAACE;AAAA,YAAA;AAAA,cACC,OAAM;AAAA,cACN,IAAI;AAAA,gBACF,aAAa;AAAA,gBACb,aAAa;AAAA,gBACb,aAAa;AAAA,cACf;AAAA,YAAA;AAAA,UACF;AAAA,UAGFF,gBAAAA,EAAA;AAAA,YAACK;AAAA,YAAA;AAAA,cAEC,OAAOR,EAAO;AAAA,cACd,SAASD,EAAQC,CAAM;AAAA,cACvB,QAAQM,MAAQT,EAAQ,SAAS;AAAA,YAAA;AAAA,YAH5BG,EAAO;AAAA,UAId;AAAA,QAAA,KAjBmBA,EAAO,EAkB5B,CACD;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGP;"}

package/lib/sd-component-library265.js

@@ -1,54 +1,134 @@
-import { j as r } from "./sd-component-library197.js";
-import s from "react";
-import { Box as n } from "rebass";
-import { TriangularPointerIcon as m } from "./sd-component-library191.js";
-import { SecondaryCustomSelectorOptionRow as x } from "./sd-component-library326.js";
-import { HorizontalDivider as i } from "./sd-component-library49.js";
-const f = ({
-  options: t,
-  onSelect: l
+import { j as t } from "./sd-component-library197.js";
+import { Select as A } from "@rebass/forms";
+import { Box as T } from "rebass";
+import { getNoTranslateClass as p } from "./sd-component-library113.js";
+import { BaseLabel as Z } from "./sd-component-library227.js";
+import { MaxMaxContainer as q } from "./sd-component-library41.js";
+import { ResponsiveTextV2 as D } from "./sd-component-library151.js";
+const X = ({
+  variant: r,
+  options: u,
+  width: f,
+  m: g,
+  mt: h,
+  mr: C,
+  mb: j,
+  ml: v,
+  gap: $,
+  selectorLabel: i,
+  secondLabel: e,
+  errorMessage: m,
+  disabledTextValue: n,
+  hideDefaultOnSelect: y,
+  labelMargin: b,
+  selectElementHeight: F,
+  defaultOptionColor: c,
+  textTransform: N,
+  onSelect: S,
+  noOptionsToSelect: a,
+  name: o,
+  selection: l,
+  hasDefaultValue: B,
+  onFocus: E,
+  errorBackground: M,
+  labelContainerAlignItems: V,
+  translateSelect: d = !0,
+  translateDefaultOption: x,
+  containerVariant: _,
+  disabled: z,
+  pl: I
 }) => {
-  const c = (o) => () => l(o);
-  return /* @__PURE__ */ r.jsxs(
-    n,
+  const R = !r || !["compact", "tertiary", "secondaryV2", "updatedSecondary"].includes(
+    r
+  ), W = navigator.userAgent.toLowerCase().indexOf("firefox") > -1, k = p(
+    x !== !0 && !d || x === !1
+  ), w = p(!d);
+  return /* @__PURE__ */ t.jsxs(
+    T,
     {
+      variant: `_containers.selectors.${_ || r}`,
       sx: {
-        position: "absolute",
-        right: "-16px",
-        top: "calc(100% - 12px)",
-        minWidth: "calc(100% + 16px)",
-        zIndex: 1
+        width: f,
+        m: g,
+        mt: h,
+        mr: C,
+        mb: j,
+        ml: v,
+        position: "relative",
+        ...R ? {
+          svg: {
+            transform: `translate(-2px,${W ? 0 : 5}px) scale(.78)`,
+            fill: "#4568F8"
+          }
+        } : {},
+        path: {
+          d: "path('M12,8.6L6.72,3.29C6.32,2.9,5.68,2.9,5.29,3.29C4.90,3.69,4.9,4.33,5.29,4.73L11.23,10.7C11.44,10.91,11.72,11.01,12,11C12.27,11.01,12.55,10.91,12.76,10.7L18.7,4.73C19.09,4.33,19.09,3.69,18.7,3.29C18.31,2.9,17.67,2.9,17.27,3.29Z M12,8.6')"
+        },
+        gap: $
       },
+      "data-testid": "base-selector-v2",
       children: [
-        /* @__PURE__ */ r.jsx(m, { direction: "top", mr: "15px", ml: "auto" }),
-        /* @__PURE__ */ r.jsx(i, { height: "2px", color: "cl_purple" }),
-        t.map((o, e) => /* @__PURE__ */ r.jsxs(s.Fragment, { children: [
-          e !== 0 && /* @__PURE__ */ r.jsx(
-            i,
+        i && /* @__PURE__ */ t.jsxs(q, { gap: "0px", alignItems: V, children: [
+          /* @__PURE__ */ t.jsx(
+            Z,
             {
-              color: "cl_headerLine",
-              sx: {
-                borderStyle: "none solid",
-                borderColor: "cl_lightGrey",
-                borderWidth: "1px"
-              }
+              htmlFor: o,
+              variant: `selectors.${r}${m ? "Error" : ""}`,
+              label: i,
+              m: b,
+              "data-testid": "selector-label"
             }
           ),
-          /* @__PURE__ */ r.jsx(
-            x,
+          e && /* @__PURE__ */ t.jsx(
+            D,
             {
-              title: o.title,
-              onClick: c(o),
-              isLast: e === t.length - 1
-            },
-            o.id
+              letterSpacing: "1px",
+              textTransform: "uppercase",
+              mt: e.mt,
+              ml: e.ml || "3px",
+              color: e.color || "cl_grey",
+              fontSizeWeight: e.fontSizeWeight || [10, "semi-bold"],
+              "data-testid": "second-label",
+              children: e.text
+            }
           )
-        ] }, o.id))
+        ] }),
+        /* @__PURE__ */ t.jsx(
+          A,
+          {
+            id: o,
+            name: o,
+            height: F,
+            value: a ? n : l.title.trim(),
+            variant: `_selectors.${r}${m ? "Error" : ""}`,
+            onChange: (s) => S(s.target.value),
+            onFocus: E,
+            backgroundColor: M ? "rgba(255, 0, 0, 0.05)" : "",
+            sx: {
+              textTransform: N,
+              ...c && l.value === null ? { color: c } : {},
+              pl: I
+            },
+            disabled: z || a,
+            children: a ? /* @__PURE__ */ t.jsx("option", { "data-test": "disabled-option", children: n }, "disabledTextValue") : /* @__PURE__ */ t.jsx(t.Fragment, { children: u.slice(
+              // should default option be hidden?
+              B && y && l.value !== null ? 1 : 0
+            ).map((s) => /* @__PURE__ */ t.jsx(
+              "option",
+              {
+                "data-testid": "selector-option",
+                className: s.value === null ? k : w,
+                children: s.title
+              },
+              s.id
+            )) })
+          }
+        )
       ]
     }
   );
 };
 export {
-  f as SecondaryCustomSelectorOptionsBox
+  X as BaseSelectorV2
 };
 //# sourceMappingURL=sd-component-library265.js.map

package/lib/sd-component-library265.js.map

@@ -1 +1 @@
-{"version":3,"file":"sd-component-library265.js","sources":["../src/components/selectors/secondary-custom-selector/partials/secondary-custom-selector-options-box/secondary-custom-selector-options-box.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { Box } from \"rebass\";\n\nimport { HorizontalDivider } from \"../../../../dividers\";\nimport { TriangularPointerIcon } from \"../../../../icons\";\nimport { SelectorOptionV2 } from \"../../../selector-v2\";\nimport { SecondaryCustomSelectorOptionRow } from \"../secondary-custom-selector-option-row\";\nimport { SecondaryCustomSelectorOptionsBoxProps as Props } from \"./interfaces\";\n\nexport const SecondaryCustomSelectorOptionsBox = <T extends string = string>({\n  options,\n  onSelect,\n}: Props<T>) => {\n  const onClick = (option: SelectorOptionV2<T>) => () => onSelect(option);\n\n  return (\n    <Box\n      sx={{\n        position: \"absolute\",\n        right: \"-16px\",\n        top: \"calc(100% - 12px)\",\n        minWidth: \"calc(100% + 16px)\",\n        zIndex: 1,\n      }}\n    >\n      <TriangularPointerIcon direction=\"top\" mr=\"15px\" ml=\"auto\" />\n\n      <HorizontalDivider height=\"2px\" color=\"cl_purple\" />\n\n      {options.map((option, idx) => (\n        <React.Fragment key={option.id}>\n          {idx !== 0 && (\n            <HorizontalDivider\n              color=\"cl_headerLine\"\n              sx={{\n                borderStyle: \"none solid\",\n                borderColor: \"cl_lightGrey\",\n                borderWidth: \"1px\",\n              }}\n            />\n          )}\n\n          <SecondaryCustomSelectorOptionRow\n            key={option.id}\n            title={option.title}\n            onClick={onClick(option)}\n            isLast={idx === options.length - 1}\n          />\n        </React.Fragment>\n      ))}\n    </Box>\n  );\n};\n"],"names":["SecondaryCustomSelectorOptionsBox","options","onSelect","onClick","option","jsxs","Box","jsx","TriangularPointerIcon","HorizontalDivider","idx","React","SecondaryCustomSelectorOptionRow"],"mappings":";;;;;;AAUO,MAAMA,IAAoC,CAA4B;AAAA,EAC3E,SAAAC;AAAA,EACA,UAAAC;AACF,MAAgB;AACd,QAAMC,IAAU,CAACC,MAAgC,MAAMF,EAASE,CAAM;AAGpE,SAAAC,gBAAAA,EAAA;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,IAAI;AAAA,QACF,UAAU;AAAA,QACV,OAAO;AAAA,QACP,KAAK;AAAA,QACL,UAAU;AAAA,QACV,QAAQ;AAAA,MACV;AAAA,MAEA,UAAA;AAAA,QAAAC,gBAAAA,MAACC,KAAsB,WAAU,OAAM,IAAG,QAAO,IAAG,QAAO;AAAA,QAE1DD,gBAAAA,EAAA,IAAAE,GAAA,EAAkB,QAAO,OAAM,OAAM,aAAY;AAAA,QAEjDR,EAAQ,IAAI,CAACG,GAAQM,MACnBL,gBAAAA,EAAAA,KAAAM,EAAM,UAAN,EACE,UAAA;AAAA,UAAAD,MAAQ,KACPH,gBAAAA,EAAA;AAAA,YAACE;AAAA,YAAA;AAAA,cACC,OAAM;AAAA,cACN,IAAI;AAAA,gBACF,aAAa;AAAA,gBACb,aAAa;AAAA,gBACb,aAAa;AAAA,cACf;AAAA,YAAA;AAAA,UACF;AAAA,UAGFF,gBAAAA,EAAA;AAAA,YAACK;AAAA,YAAA;AAAA,cAEC,OAAOR,EAAO;AAAA,cACd,SAASD,EAAQC,CAAM;AAAA,cACvB,QAAQM,MAAQT,EAAQ,SAAS;AAAA,YAAA;AAAA,YAH5BG,EAAO;AAAA,UAId;AAAA,QAAA,KAjBmBA,EAAO,EAkB5B,CACD;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGP;"}
+{"version":3,"file":"sd-component-library265.js","sources":["../src/components/selectors/selector-v2/partials/base-selector-v2/base-selector-v2.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { Select } from \"@rebass/forms\";\nimport { Box } from \"rebass\";\n\nimport { MaxMaxContainer } from \"../../../../containers\";\nimport { BaseLabel } from \"../../../../labels/base-label\";\nimport { ResponsiveTextV2 } from \"../../../../texts\";\nimport { getNoTranslateClass } from \"../../../selector/selector\";\nimport { BaseSelectorV2Props as Props } from \"./interfaces\";\n\nexport const BaseSelectorV2 = <T extends string = string>({\n  variant,\n  options,\n  width,\n  m,\n  mt,\n  mr,\n  mb,\n  ml,\n  gap,\n  selectorLabel,\n  secondLabel,\n  errorMessage,\n  disabledTextValue,\n  hideDefaultOnSelect,\n  labelMargin,\n  selectElementHeight,\n  defaultOptionColor,\n  textTransform,\n  onSelect,\n  noOptionsToSelect,\n  name,\n  selection,\n  hasDefaultValue,\n  onFocus,\n  errorBackground,\n  labelContainerAlignItems,\n  translateSelect = true,\n  translateDefaultOption,\n  containerVariant,\n  disabled,\n  pl,\n}: Props<T>) => {\n  const useDefaultIconStyles =\n    !variant ||\n    ![\"compact\", \"tertiary\", \"secondaryV2\", \"updatedSecondary\"].includes(\n      variant\n    );\n  const isFirefox = navigator.userAgent.toLowerCase().indexOf(\"firefox\") > -1;\n\n  const defaultOptionClassName = getNoTranslateClass(\n    (translateDefaultOption !== true && !translateSelect) ||\n      translateDefaultOption === false\n  );\n  const regularOptionClassName = getNoTranslateClass(!translateSelect);\n\n  return (\n    <Box\n      variant={`_containers.selectors.${containerVariant || variant}`}\n      sx={{\n        width,\n        m,\n        mt,\n        mr,\n        mb,\n        ml,\n        position: \"relative\",\n        ...(useDefaultIconStyles\n          ? {\n              svg: {\n                transform: `translate(-2px,${isFirefox ? 0 : 5}px) scale(.78)`,\n                fill: \"#4568F8\",\n              },\n            }\n          : {}),\n        path: {\n          d: \"path('M12,8.6L6.72,3.29C6.32,2.9,5.68,2.9,5.29,3.29C4.90,3.69,4.9,4.33,5.29,4.73L11.23,10.7C11.44,10.91,11.72,11.01,12,11C12.27,11.01,12.55,10.91,12.76,10.7L18.7,4.73C19.09,4.33,19.09,3.69,18.7,3.29C18.31,2.9,17.67,2.9,17.27,3.29Z M12,8.6')\",\n        },\n        gap,\n      }}\n      data-testid=\"base-selector-v2\"\n    >\n      {selectorLabel && (\n        <MaxMaxContainer gap=\"0px\" alignItems={labelContainerAlignItems}>\n          <BaseLabel\n            htmlFor={name}\n            variant={`selectors.${variant}${errorMessage ? \"Error\" : \"\"}`}\n            label={selectorLabel}\n            m={labelMargin}\n            data-testid=\"selector-label\"\n          />\n\n          {secondLabel && (\n            <ResponsiveTextV2\n              letterSpacing=\"1px\"\n              textTransform=\"uppercase\"\n              mt={secondLabel.mt}\n              ml={secondLabel.ml || \"3px\"}\n              color={secondLabel.color || \"cl_grey\"}\n              fontSizeWeight={secondLabel.fontSizeWeight || [10, \"semi-bold\"]}\n              data-testid=\"second-label\"\n            >\n              {secondLabel.text}\n            </ResponsiveTextV2>\n          )}\n        </MaxMaxContainer>\n      )}\n\n      <Select\n        id={name}\n        name={name}\n        height={selectElementHeight}\n        value={noOptionsToSelect ? disabledTextValue : selection.title.trim()}\n        variant={`_selectors.${variant}${errorMessage ? \"Error\" : \"\"}`}\n        onChange={(event) => onSelect(event.target.value)}\n        onFocus={onFocus}\n        backgroundColor={errorBackground ? \"rgba(255, 0, 0, 0.05)\" : \"\"}\n        sx={{\n          textTransform,\n          ...(defaultOptionColor && selection.value === null\n            ? { color: defaultOptionColor }\n            : {}),\n          pl,\n        }}\n        disabled={disabled || noOptionsToSelect}\n      >\n        {noOptionsToSelect ? (\n          <option key=\"disabledTextValue\" data-test=\"disabled-option\">\n            {disabledTextValue}\n          </option>\n        ) : (\n          <>\n            {options\n              .slice(\n                // should default option be hidden?\n                hasDefaultValue &&\n                  hideDefaultOnSelect &&\n                  selection.value !== null\n                  ? 1\n                  : 0\n              )\n              .map((option) => (\n                <option\n                  key={option.id}\n                  data-testid=\"selector-option\"\n                  className={\n                    option.value === null\n                      ? defaultOptionClassName\n                      : regularOptionClassName\n                  }\n                >\n                  {option.title}\n                </option>\n              ))}\n          </>\n        )}\n      </Select>\n    </Box>\n  );\n};\n"],"names":["BaseSelectorV2","variant","options","width","m","mt","mr","mb","ml","gap","selectorLabel","secondLabel","errorMessage","disabledTextValue","hideDefaultOnSelect","labelMargin","selectElementHeight","defaultOptionColor","textTransform","onSelect","noOptionsToSelect","name","selection","hasDefaultValue","onFocus","errorBackground","labelContainerAlignItems","translateSelect","translateDefaultOption","containerVariant","disabled","pl","useDefaultIconStyles","isFirefox","defaultOptionClassName","getNoTranslateClass","regularOptionClassName","jsxs","Box","MaxMaxContainer","jsx","BaseLabel","ResponsiveTextV2","Select","event","Fragment","option"],"mappings":"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"}