@selfdecode/sd-component-library 4.0.95 → 4.0.97

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

@@ -1 +1 @@
-{"version":3,"file":"sd-component-library.js","sources":["../src/index.tsx"],"sourcesContent":["// Type imports before exporting\n// Wrapper export\nimport Wrapper from \"./components/wrapper\";\n\nexport const ComponentLibThemeProvider = Wrapper;\n\n// Accordion exports\nexport * from \"./components/accordions\";\n\n// Badge exports\nexport * from \"./components/badges\";\n\n// Boxes exports\nexport * from \"./components/boxes\";\n\n// Breadcrumb exports\nexport * from \"./components/breadcrumbs\";\n\n// Button exports\nexport * from \"./components/buttons\";\n\n// Card exports\nexport * from \"./components/cards\";\n\n//Checkboxes exports\nexport * from \"./components/checkboxes\";\n\n// Container exports\nexport * from \"./components/containers\";\n\n// Custom Scrollbar Box exports\nexport * from \"./components/custom-scrollbar-box\";\n\n// Divider components exports\nexport * from \"./components/dividers\";\n\n// Feature explanation component export\nexport * from \"./components/feature-explanation\";\n\n// Feedback exports\nexport * from \"./components/boolean-feedback\";\nexport * from \"./components/feedback\";\n\nexport * from \"./components/forms-v2\";\n\n// Input exports\nexport * from \"./components/inputs\";\n\n// Links components exports\nexport * from \"./components/links\";\n\n// Lists components exports\nexport * from \"./components/lists\";\n\n// Menus\nexport * from \"./components/menus\";\n\n// Meters\nexport * from \"./components/meters\";\n\n// Modals\nexport * from \"./components/modals\";\n\n// Page selector exports\nexport * from \"./components/page-selectors\";\n\n// Pagination bars exports\nexport * from \"./components/pagination-bars\";\n\n// Progress bar exports\nexport * from \"./components/progress-bars\";\n\n// Progress steps components exports\nexport * from \"./components/progress-steps\";\n\n// Selector exports\nexport * from \"./components/selectors\";\n\n// Switch exports\nexport * from \"./components/switches\";\n\n// Tabs\nexport * from \"./components/tabs\";\n\n// Text components exports\nexport * from \"./components/texts\";\n\n// Tooltips\nexport * from \"./components/tooltips\";\n\n// Util components exports\nexport * from \"./components/utils\";\n\n// Custom hooks\nexport {\n  useResize,\n  useBodyScrollLock,\n  useElementCoordinates,\n  useBoundingClientRect,\n  useIntersectionObserver,\n} from \"./core/custom-hooks\";\n\nexport * from \"./core/functions\";\n\n// Icons\nexport * from \"./components/icons\";\n"],"names":["ComponentLibThemeProvider","Wrapper"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAIO,MAAMA,IAA4BC;"}
+{"version":3,"file":"sd-component-library.js","sources":["../src/index.tsx"],"sourcesContent":["// Type imports before exporting\n// Wrapper export\nimport Wrapper from \"./components/wrapper\";\n\nexport const ComponentLibThemeProvider = Wrapper;\n\n// Accordion exports\nexport * from \"./components/accordions\";\n\n// Badge exports\nexport * from \"./components/badges\";\n\n// Boxes exports\nexport * from \"./components/boxes\";\n\n// Breadcrumb exports\nexport * from \"./components/breadcrumbs\";\n\n// Button exports\nexport * from \"./components/buttons\";\n\n// Card exports\nexport * from \"./components/cards\";\n\n//Checkboxes exports\nexport * from \"./components/checkboxes\";\n\n// Container exports\nexport * from \"./components/containers\";\n\n// Custom Scrollbar Box exports\nexport * from \"./components/custom-scrollbar-box\";\n\n// Divider components exports\nexport * from \"./components/dividers\";\n\n// Feature explanation component export\nexport * from \"./components/feature-explanation\";\n\n// Feedback exports\nexport * from \"./components/boolean-feedback\";\nexport * from \"./components/feedback\";\n\nexport * from \"./components/forms-v2\";\n\n// Input exports\nexport * from \"./components/inputs\";\n\n// Links components exports\nexport * from \"./components/links\";\n\n// Lists components exports\nexport * from \"./components/lists\";\n\n// Menus\nexport * from \"./components/menus\";\n\n// Meters\nexport * from \"./components/meters\";\n\n// Modals\nexport * from \"./components/modals\";\n\n// Page selector exports\nexport * from \"./components/page-selectors\";\n\n// Pagination bars exports\nexport * from \"./components/pagination-bars\";\n\n// Progress bar exports\nexport * from \"./components/progress-bars\";\n\n// Progress steps components exports\nexport * from \"./components/progress-steps\";\n\n// Selector exports\nexport * from \"./components/selectors\";\n\n// Switch exports\nexport * from \"./components/switches\";\n\n// Tabs\nexport * from \"./components/tabs\";\n\n// Text components exports\nexport * from \"./components/texts\";\n\n// Tooltips\nexport * from \"./components/tooltips\";\n\n// Util components exports\nexport * from \"./components/utils\";\n\n// Custom hooks\nexport {\n  useResize,\n  useBodyScrollLock,\n  useElementCoordinates,\n  useBoundingClientRect,\n  useIntersectionObserver,\n} from \"./core/custom-hooks\";\n\nexport * from \"./core/functions\";\n\n// Icons\nexport * from \"./components/icons\";\n"],"names":["ComponentLibThemeProvider","Wrapper"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAIO,MAAMA,IAA4BC;"}

package/lib/sd-component-library10.js

@@ -1,4 +1,4 @@
-import { j as t } from "./sd-component-library196.js";
+import { j as t } from "./sd-component-library197.js";
 import { Box as n } from "rebass";
 const x = (o) => {
   const { children: r, ...s } = o;

package/lib/sd-component-library100.js

@@ -1,7 +1,7 @@
-import { j as n } from "./sd-component-library196.js";
-import { areSegmentsValid as h } from "./sd-component-library247.js";
-import { CompactDonutGaugeSegment as x } from "./sd-component-library248.js";
-import { CompactDonutGaugeValueIndicator as f } from "./sd-component-library249.js";
+import { j as n } from "./sd-component-library197.js";
+import { areSegmentsValid as h } from "./sd-component-library248.js";
+import { CompactDonutGaugeSegment as x } from "./sd-component-library250.js";
+import { CompactDonutGaugeValueIndicator as f } from "./sd-component-library251.js";
 const C = ({
   segments: e,
   size: r = 70,

package/lib/sd-component-library101.js

@@ -1,6 +1,6 @@
-import { j as r } from "./sd-component-library196.js";
-import { LinearGaugeSegment as c } from "./sd-component-library250.js";
-import { LinearGaugeLabel as d } from "./sd-component-library251.js";
+import { j as r } from "./sd-component-library197.js";
+import { LinearGaugeSegment as c } from "./sd-component-library252.js";
+import { LinearGaugeLabel as d } from "./sd-component-library253.js";
 import { GridCenter as f } from "./sd-component-library42.js";
 import { GridContainerV2 as h } from "./sd-component-library39.js";
 function $(l) {

package/lib/sd-component-library102.js

@@ -1,9 +1,9 @@
-import { j as e } from "./sd-component-library196.js";
-import { isMatchingRange as u } from "./sd-component-library255.js";
+import { j as e } from "./sd-component-library197.js";
+import { isMatchingRange as u } from "./sd-component-library254.js";
 import { GridCenter as c } from "./sd-component-library42.js";
 import { GridContainerV2 as f } from "./sd-component-library39.js";
-import { LinearGaugeSegment as d } from "./sd-component-library250.js";
-import { LinearGaugeLabel as j } from "./sd-component-library251.js";
+import { LinearGaugeSegment as d } from "./sd-component-library252.js";
+import { LinearGaugeLabel as j } from "./sd-component-library253.js";
 const M = ({
   gap: i = 3,
   segmentHeight: l = 8,

package/lib/sd-component-library103.js

@@ -1,11 +1,11 @@
-import { j as t } from "./sd-component-library196.js";
+import { j as t } from "./sd-component-library197.js";
 import { useRef as B, useState as I, useEffect as R } from "react";
 import { Box as s } from "rebass";
 import { useBodyScrollLock as E } from "./sd-component-library3.js";
 import { isIOS as F, isPDFFlow as T } from "./sd-component-library4.js";
-import X from "./sd-component-library252.js";
+import X from "./sd-component-library255.js";
 import { OutsideClickBox as P } from "./sd-component-library11.js";
-import { ReactComponent as z } from "./sd-component-library253.js";
+import { ReactComponent as z } from "./sd-component-library256.js";
 import { FlexCenter as A } from "./sd-component-library35.js";
 import { Button as D } from "./sd-component-library25.js";
 const r = 500, J = (d) => {

package/lib/sd-component-library104.js

@@ -1,7 +1,7 @@
-import { j as t } from "./sd-component-library196.js";
+import { j as t } from "./sd-component-library197.js";
 import { Modal as o } from "./sd-component-library103.js";
-import { EighteenRegular as a } from "./sd-component-library142.js";
-import { TwentyFourBold as e } from "./sd-component-library161.js";
+import { EighteenRegular as a } from "./sd-component-library143.js";
+import { TwentyFourBold as e } from "./sd-component-library162.js";
 const n = (r) => /* @__PURE__ */ t.jsxs(o, { ...r, variant: "primary", "data-test": "primary-modal", children: [
   /* @__PURE__ */ t.jsx(e, { color: "cl_darkGrey", mb: ["40px"], children: r.heading }),
   /* @__PURE__ */ t.jsx(

package/lib/sd-component-library105.js

@@ -1,4 +1,4 @@
-import { j as r } from "./sd-component-library196.js";
+import { j as r } from "./sd-component-library197.js";
 import { useDependantState as j } from "./sd-component-library3.js";
 import { SquareButton as g } from "./sd-component-library257.js";
 import { ReactComponent as P } from "./sd-component-library258.js";

package/lib/sd-component-library106.js

@@ -1,7 +1,7 @@
-import { j as t } from "./sd-component-library196.js";
+import { j as t } from "./sd-component-library197.js";
 import { Flex as p } from "rebass";
 import { MaxWidthContainer as l } from "./sd-component-library45.js";
-import { TwelveSb as x } from "./sd-component-library160.js";
+import { TwelveSb as x } from "./sd-component-library161.js";
 import { PageSelector as c } from "./sd-component-library105.js";
 const S = ({
   currentPage: e,

package/lib/sd-component-library107.js

@@ -1,10 +1,10 @@
-import { j as e } from "./sd-component-library196.js";
+import { j as e } from "./sd-component-library197.js";
 import { PaginationBarButton as i } from "./sd-component-library261.js";
 import { ReactComponent as h } from "./sd-component-library258.js";
 import { PaginationBarCurrentPage as u } from "./sd-component-library262.js";
 import { ReactComponent as f } from "./sd-component-library260.js";
 import { GridContainerV2 as s } from "./sd-component-library39.js";
-import { ResponsiveTextV2 as j } from "./sd-component-library150.js";
+import { ResponsiveTextV2 as j } from "./sd-component-library151.js";
 const k = (a) => {
   const {
     currentPage: t,

package/lib/sd-component-library108.js

@@ -1,4 +1,4 @@
-import { j as r } from "./sd-component-library196.js";
+import { j as r } from "./sd-component-library197.js";
 import { ProgressBar as e } from "./sd-component-library109.js";
 const o = (t) => /* @__PURE__ */ r.jsx(
   e,

package/lib/sd-component-library109.js

@@ -1,4 +1,4 @@
-import { j as s } from "./sd-component-library196.js";
+import { j as s } from "./sd-component-library197.js";
 import { Flex as i, Box as t } from "rebass";
 const g = ({
   totalSteps: e,

package/lib/sd-component-library11.js

@@ -1,4 +1,4 @@
-import { j as u } from "./sd-component-library196.js";
+import { j as u } from "./sd-component-library197.js";
 import { useRef as a, useEffect as i } from "react";
 import { Box as f } from "rebass";
 const p = ({

package/lib/sd-component-library110.js

@@ -1,4 +1,4 @@
-import { j as s } from "./sd-component-library196.js";
+import { j as s } from "./sd-component-library197.js";
 import { Box as i } from "rebass";
 const c = ({
   currentStep: e,

package/lib/sd-component-library111.js

@@ -1,4 +1,4 @@
-import { j as o } from "./sd-component-library196.js";
+import { j as o } from "./sd-component-library197.js";
 import { Box as n } from "rebass";
 import { ProgressBar as a } from "./sd-component-library109.js";
 const c = (r) => {

package/lib/sd-component-library112.js

@@ -1,6 +1,6 @@
-import { j as i } from "./sd-component-library196.js";
+import { j as i } from "./sd-component-library197.js";
 import { Flex as n } from "rebass";
-import { ProgressStep as x } from "./sd-component-library199.js";
+import { ProgressStep as x } from "./sd-component-library200.js";
 const g = ({
   height: t,
   steps: s,

package/lib/sd-component-library113.js

@@ -1,11 +1,11 @@
-import { j as e } from "./sd-component-library196.js";
+import { j as e } from "./sd-component-library197.js";
 import { useMemo as P } from "react";
 import { Select as Z } from "@rebass/forms";
 import { Box as q } from "rebass";
 import { useDependantState as G } from "./sd-component-library3.js";
-import { BaseLabel as J } from "./sd-component-library226.js";
+import { BaseLabel as J } from "./sd-component-library227.js";
 import { MaxMaxContainer as K } from "./sd-component-library41.js";
-import { ResponsiveTextV2 as Q } from "./sd-component-library150.js";
+import { ResponsiveTextV2 as Q } from "./sd-component-library151.js";
 const U = (s, r, t, d, a, n) => {
   const m = d.find(
     (p) => p[r].trim() === s

package/lib/sd-component-library114.js

@@ -1,4 +1,4 @@
-import { j as t } from "./sd-component-library196.js";
+import { j as t } from "./sd-component-library197.js";
 import { Selector as o } from "./sd-component-library113.js";
 const i = (r) => /* @__PURE__ */ t.jsx(
   o,

package/lib/sd-component-library115.js

@@ -1,4 +1,4 @@
-import { j as t } from "./sd-component-library196.js";
+import { j as t } from "./sd-component-library197.js";
 import { Selector as e } from "./sd-component-library113.js";
 const m = (r) => /* @__PURE__ */ t.jsx(e, { ...r, variant: "primary", "data-test": "primary-selector" });
 export {

package/lib/sd-component-library116.js

@@ -1,4 +1,4 @@
-import { j as o } from "./sd-component-library196.js";
+import { j as o } from "./sd-component-library197.js";
 import { Selector as a } from "./sd-component-library113.js";
 const s = (r) => {
   const { labelMargin: t = ["0px"], gap: e = ["3px"] } = r;

package/lib/sd-component-library117.js

@@ -1,4 +1,4 @@
-import { j as r } from "./sd-component-library196.js";
+import { j as r } from "./sd-component-library197.js";
 import { Selector as o } from "./sd-component-library113.js";
 const m = (t) => /* @__PURE__ */ r.jsx(
   o,

package/lib/sd-component-library118.js

@@ -1,11 +1,11 @@
-import { j as o } from "./sd-component-library196.js";
+import { j as o } from "./sd-component-library197.js";
 import u, { useState as h, useMemo as f } from "react";
 import { Box as g } from "rebass";
 import { OutsideClickBox as b } from "./sd-component-library11.js";
-import { ReactComponent as j } from "./sd-component-library187.js";
-import { CustomOptionBox as C } from "./sd-component-library264.js";
+import { ReactComponent as j } from "./sd-component-library188.js";
+import { CustomOptionBox as C } from "./sd-component-library263.js";
 import { GridCenter as S } from "./sd-component-library42.js";
-import { EighteenRegular as d } from "./sd-component-library142.js";
+import { EighteenRegular as d } from "./sd-component-library143.js";
 import { HorizontalDivider as _ } from "./sd-component-library49.js";
 const z = ({
   value: e,

package/lib/sd-component-library119.js

@@ -1,11 +1,11 @@
-import { j as o } from "./sd-component-library196.js";
+import { j as o } from "./sd-component-library197.js";
 import { useState as x } from "react";
-import { BaseLabel as f } from "./sd-component-library226.js";
+import { BaseLabel as f } from "./sd-component-library227.js";
 import { OutsideClickBox as u } from "./sd-component-library11.js";
-import { ReactComponent as h } from "./sd-component-library187.js";
-import { SecondaryCustomSelectorOptionsBox as S } from "./sd-component-library263.js";
+import { ReactComponent as h } from "./sd-component-library188.js";
+import { SecondaryCustomSelectorOptionsBox as S } from "./sd-component-library264.js";
 import { GridContainerV2 as g } from "./sd-component-library39.js";
-import { ResponsiveTextV2 as C } from "./sd-component-library150.js";
+import { ResponsiveTextV2 as C } from "./sd-component-library151.js";
 import { FlexCenter as j } from "./sd-component-library35.js";
 const R = ({
   value: l,

package/lib/sd-component-library12.js

@@ -1,4 +1,4 @@
-import { j as m } from "./sd-component-library196.js";
+import { j as m } from "./sd-component-library197.js";
 import { Box as n } from "rebass";
 const c = ({
   url: o,

package/lib/sd-component-library120.js

@@ -1,4 +1,4 @@
-import { j as t } from "./sd-component-library196.js";
+import { j as t } from "./sd-component-library197.js";
 import { SecondaryCustomSelector as o } from "./sd-component-library119.js";
 const s = (r) => /* @__PURE__ */ t.jsx(o, { ...r, variant: "customTertiary" });
 export {

package/lib/sd-component-library121.js

@@ -1,11 +1,11 @@
-import { j as o } from "./sd-component-library196.js";
+import { j as o } from "./sd-component-library197.js";
 import { useState as d } from "react";
 import { OutsideClickBox as a } from "./sd-component-library11.js";
-import { ReactComponent as x } from "./sd-component-library187.js";
-import { ResponsiveTextV2 as f } from "./sd-component-library150.js";
-import { BaseTextV2 as u } from "./sd-component-library138.js";
+import { ReactComponent as x } from "./sd-component-library188.js";
+import { ResponsiveTextV2 as f } from "./sd-component-library151.js";
+import { BaseTextV2 as u } from "./sd-component-library139.js";
 import { FlexCenter as h } from "./sd-component-library35.js";
-import { SecondaryCustomSelectorOptionsBox as g } from "./sd-component-library263.js";
+import { SecondaryCustomSelectorOptionsBox as g } from "./sd-component-library264.js";
 const k = ({
   width: l,
   options: r,

package/lib/sd-component-library122.js

@@ -1,4 +1,4 @@
-import { j as i } from "./sd-component-library196.js";
+import { j as i } from "./sd-component-library197.js";
 import { useMemo as S, useCallback as p } from "react";
 import { BaseSelectorV2 as u } from "./sd-component-library265.js";
 const g = ({

package/lib/sd-component-library123.js

@@ -1,4 +1,4 @@
-import { j as r } from "./sd-component-library196.js";
+import { j as r } from "./sd-component-library197.js";
 import { SelectorV2 as e } from "./sd-component-library122.js";
 const i = (t) => /* @__PURE__ */ r.jsx(
   e,

package/lib/sd-component-library124.js

@@ -1,4 +1,4 @@
-import { j as e } from "./sd-component-library196.js";
+import { j as e } from "./sd-component-library197.js";
 import { SelectorV2 as o } from "./sd-component-library122.js";
 const s = (t) => {
   const { gap: r = "8px" } = t;

package/lib/sd-component-library125.js

@@ -1,4 +1,4 @@
-import { j as t } from "./sd-component-library196.js";
+import { j as t } from "./sd-component-library197.js";
 import { SelectorV2 as e } from "./sd-component-library122.js";
 const i = (r) => /* @__PURE__ */ t.jsx(
   e,

package/lib/sd-component-library126.js

@@ -1,8 +1,8 @@
-import { j as e } from "./sd-component-library196.js";
+import { j as e } from "./sd-component-library197.js";
 import { useState as n, useCallback as c } from "react";
 import { Box as d } from "rebass";
 import { SelectorV2 as m } from "./sd-component-library122.js";
-import { ResponsiveTextV2 as p } from "./sd-component-library150.js";
+import { ResponsiveTextV2 as p } from "./sd-component-library151.js";
 const g = ({
   selectorLabel: o,
   gap: r = 5,

package/lib/sd-component-library127.js

@@ -1,11 +1,11 @@
-import { j as o } from "./sd-component-library196.js";
+import { j as o } from "./sd-component-library197.js";
 import { useState as x } from "react";
-import { BaseLabel as f } from "./sd-component-library226.js";
-import { ReactComponent as u } from "./sd-component-library187.js";
-import { CustomScrollableOptionsBox as h } from "./sd-component-library266.js";
+import { BaseLabel as f } from "./sd-component-library227.js";
+import { ReactComponent as u } from "./sd-component-library188.js";
+import { CustomScrollableOptionsBox as h } from "./sd-component-library267.js";
 import { GridContainerV2 as S } from "./sd-component-library39.js";
 import { OutsideClickBox as b } from "./sd-component-library11.js";
-import { ResponsiveTextV2 as C } from "./sd-component-library150.js";
+import { ResponsiveTextV2 as C } from "./sd-component-library151.js";
 import { FlexCenter as g } from "./sd-component-library35.js";
 const G = (l) => {
   const { value: n, onChange: c, options: r, width: p, label: a, containerSx: m } = l, [e, i] = x(!1), s = r.find((t) => t.id === n.id), d = () => i(!1);

package/lib/sd-component-library128.js

@@ -1,11 +1,11 @@
-import { j as o } from "./sd-component-library196.js";
+import { j as o } from "./sd-component-library197.js";
 import { useState as x } from "react";
 import { Flex as i } from "rebass";
 import { OutsideClickBox as d } from "./sd-component-library11.js";
-import { BaseLabel as u } from "./sd-component-library226.js";
-import { ReactComponent as f } from "./sd-component-library187.js";
-import { CustomScrollableOptionsBox as h } from "./sd-component-library267.js";
-import { ResponsiveTextV2 as b } from "./sd-component-library150.js";
+import { BaseLabel as u } from "./sd-component-library227.js";
+import { ReactComponent as f } from "./sd-component-library188.js";
+import { CustomScrollableOptionsBox as h } from "./sd-component-library266.js";
+import { ResponsiveTextV2 as b } from "./sd-component-library151.js";
 const w = (t) => {
   const { leftSlot: s, label: l, value: n, width: c } = t, [e, r] = x(!1), p = () => r(!1), a = () => r((m) => !m);
   return /* @__PURE__ */ o.jsxs(

package/lib/sd-component-library129.js

@@ -1,4 +1,4 @@
-import { j as e } from "./sd-component-library196.js";
+import { j as e } from "./sd-component-library197.js";
 import { SelectorV2 as r } from "./sd-component-library122.js";
 const d = (t) => /* @__PURE__ */ e.jsx(
   r,

package/lib/sd-component-library13.js

@@ -1,4 +1,4 @@
-import { j as a } from "./sd-component-library196.js";
+import { j as a } from "./sd-component-library197.js";
 import { Breadcrumb as m } from "./sd-component-library15.js";
 const o = (r) => /* @__PURE__ */ a.jsx(m, { ...r, variant: "primary", "data-testid": "primary-breadcrumb" });
 export {

package/lib/sd-component-library130.js

@@ -1,7 +1,7 @@
-import { j as t } from "./sd-component-library196.js";
+import { j as t } from "./sd-component-library197.js";
 import { IconButton as s } from "./sd-component-library22.js";
-import { ReactComponent as c } from "./sd-component-library254.js";
-import { EighteenBold as p } from "./sd-component-library141.js";
+import { ReactComponent as c } from "./sd-component-library204.js";
+import { EighteenBold as p } from "./sd-component-library142.js";
 import { GridCenter as g } from "./sd-component-library42.js";
 const C = ({
   currentSelection: o,

package/lib/sd-component-library131.js

@@ -1,92 +1,43 @@
-import { j as r } from "./sd-component-library196.js";
-import { useState as g, useEffect as v } from "react";
-import { Flex as b, Box as a } from "rebass";
-const R = (t) => {
-  const { value: e } = t, [o, n] = g(e || "left");
-  v(() => {
-    e && n(e);
-  }, [e]);
+import { j as n } from "./sd-component-library197.js";
+import { Box as t } from "rebass";
+const s = 200, c = "40px", i = "3px", p = "20px", a = `calc(${p} - 2 * ${i})`, e = ({
+  value: r,
+  setValue: o,
+  inactiveColor: x = "cl_lightGrey",
+  activeColor: m = "cl_purple"
+}) => {
   const l = () => {
-    n("left"), t.leftActive();
-  }, x = () => {
-    n("right"), t.rightActive();
-  }, u = {
-    color: t.activeTextColor || "#fff",
-    border: "none",
-    backgroundColor: "transparent"
-  }, h = {
-    color: t.unactiveTextColor,
-    border: "1px solid",
-    borderColor: t.unactiveTextColor,
-    backgroundColor: t.unactiveBGColor || "transparent"
-  }, d = (f) => f === o ? u : h, i = t.borderRadius || "3px", s = `${i} 0 0 ${i}`, c = `0 ${i} ${i} 0`;
-  return /* @__PURE__ */ r.jsxs(
-    b,
+    o == null || o(!r);
+  };
+  return /* @__PURE__ */ n.jsx(
+    t,
     {
-      ...t,
-      width: t.width || "280px",
+      bg: r ? m : x,
       sx: {
-        position: "relative",
-        cursor: "pointer"
+        borderRadius: 100,
+        cursor: "pointer",
+        transition: `all ${s}ms`
       },
-      "data-testid": "text-switch",
-      children: [
-        /* @__PURE__ */ r.jsx(
-          a,
-          {
-            sx: {
-              backgroundColor: t.activeBGColor,
-              height: "100%",
-              width: "50%",
-              position: "absolute",
-              transform: o === "left" ? "translateX(0)" : "translateX(100%)",
-              transitionProperty: "transform",
-              transitionTimingFunction: "ease-out",
-              transitionDuration: "0.1s",
-              borderRadius: o === "left" ? s : c
-            },
-            "data-testid": "toggle"
+      width: c,
+      p: i,
+      height: p,
+      onClick: l,
+      children: /* @__PURE__ */ n.jsx(
+        t,
+        {
+          size: a,
+          bg: "white",
+          sx: {
+            borderRadius: "50%",
+            transform: `translateX(${r ? `calc(${c} - 2 * ${i} - ${a})` : 0})`,
+            transition: `all ${s}ms`
           }
-        ),
-        /* @__PURE__ */ r.jsx(
-          a,
-          {
-            onClick: l,
-            width: "50%",
-            variant: "_switches.textSwitch.side",
-            py: t.sidePy,
-            px: t.sidePx,
-            sx: {
-              borderRadius: s,
-              ...d("left"),
-              borderRight: "none !important"
-            },
-            "data-testid": "left",
-            children: t.leftText
-          }
-        ),
-        /* @__PURE__ */ r.jsx(
-          a,
-          {
-            onClick: x,
-            width: "50%",
-            variant: "_switches.textSwitch.side",
-            py: t.sidePy,
-            px: t.sidePx,
-            sx: {
-              borderRadius: c,
-              ...d("right"),
-              borderLeft: "none !important"
-            },
-            "data-testid": "right",
-            children: t.rightText
-          }
-        )
-      ]
+        }
+      )
     }
   );
 };
 export {
-  R as TextSwitch
+  e as PrimaryToggleSwitch
 };
 //# sourceMappingURL=sd-component-library131.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"sd-component-library131.js","sources":["../src/components/switches/text-switch/text-switch.tsx"],"sourcesContent":["import React, { useEffect, useState } from \"react\";\n\nimport { Box, Flex } from \"rebass\";\n\nimport { Sides, TextSwitchProps } from \"./interfaces\";\n\nexport const TextSwitch: React.FC<TextSwitchProps> = (props) => {\n  const { value } = props;\n  const [activeSide, setActiveSide] = useState<Sides>(value || \"left\");\n\n  useEffect(() => {\n    value && setActiveSide(value);\n  }, [value]);\n\n  const leftClicked = () => {\n    setActiveSide(\"left\");\n    props.leftActive();\n  };\n\n  const rightClicked = () => {\n    setActiveSide(\"right\");\n    props.rightActive();\n  };\n\n  const activeStyle = {\n    color: props.activeTextColor || \"#fff\",\n    border: \"none\",\n    backgroundColor: \"transparent\",\n  };\n\n  const unactiveStyle = {\n    color: props.unactiveTextColor,\n    border: \"1px solid\",\n    borderColor: props.unactiveTextColor,\n    backgroundColor: props.unactiveBGColor || \"transparent\",\n  };\n\n  const currentStyle = (side: Sides) =>\n    side === activeSide ? activeStyle : unactiveStyle;\n\n  const borderRadius = props.borderRadius || \"3px\";\n  const leftBorderRadius = `${borderRadius} 0 0 ${borderRadius}`;\n  const rightBorderRadius = `0 ${borderRadius} ${borderRadius} 0`;\n\n  return (\n    <Flex\n      {...props}\n      width={props.width || \"280px\"}\n      sx={{\n        position: \"relative\",\n        cursor: \"pointer\",\n      }}\n      data-testid=\"text-switch\"\n    >\n      <Box\n        sx={{\n          backgroundColor: props.activeBGColor,\n          height: \"100%\",\n          width: \"50%\",\n          position: \"absolute\",\n          transform:\n            activeSide === \"left\" ? \"translateX(0)\" : \"translateX(100%)\",\n          transitionProperty: \"transform\",\n          transitionTimingFunction: \"ease-out\",\n          transitionDuration: \"0.1s\",\n          borderRadius:\n            activeSide === \"left\" ? leftBorderRadius : rightBorderRadius,\n        }}\n        data-testid=\"toggle\"\n      />\n      <Box\n        onClick={leftClicked}\n        width=\"50%\"\n        variant=\"_switches.textSwitch.side\"\n        py={props.sidePy}\n        px={props.sidePx}\n        sx={{\n          borderRadius: leftBorderRadius,\n          ...currentStyle(\"left\"),\n          borderRight: \"none !important\",\n        }}\n        data-testid=\"left\"\n      >\n        {props.leftText}\n      </Box>\n      <Box\n        onClick={rightClicked}\n        width=\"50%\"\n        variant=\"_switches.textSwitch.side\"\n        py={props.sidePy}\n        px={props.sidePx}\n        sx={{\n          borderRadius: rightBorderRadius,\n          ...currentStyle(\"right\"),\n          borderLeft: \"none !important\",\n        }}\n        data-testid=\"right\"\n      >\n        {props.rightText}\n      </Box>\n    </Flex>\n  );\n};\n"],"names":["TextSwitch","props","value","activeSide","setActiveSide","useState","useEffect","leftClicked","rightClicked","activeStyle","unactiveStyle","currentStyle","side","borderRadius","leftBorderRadius","rightBorderRadius","jsxs","Flex","jsx","Box"],"mappings":";;;AAMa,MAAAA,IAAwC,CAACC,MAAU;AACxD,QAAA,EAAE,OAAAC,EAAU,IAAAD,GACZ,CAACE,GAAYC,CAAa,IAAIC,EAAgBH,KAAS,MAAM;AAEnE,EAAAI,EAAU,MAAM;AACd,IAAAJ,KAASE,EAAcF,CAAK;AAAA,EAAA,GAC3B,CAACA,CAAK,CAAC;AAEV,QAAMK,IAAc,MAAM;AACxB,IAAAH,EAAc,MAAM,GACpBH,EAAM,WAAW;AAAA,EAAA,GAGbO,IAAe,MAAM;AACzB,IAAAJ,EAAc,OAAO,GACrBH,EAAM,YAAY;AAAA,EAAA,GAGdQ,IAAc;AAAA,IAClB,OAAOR,EAAM,mBAAmB;AAAA,IAChC,QAAQ;AAAA,IACR,iBAAiB;AAAA,EAAA,GAGbS,IAAgB;AAAA,IACpB,OAAOT,EAAM;AAAA,IACb,QAAQ;AAAA,IACR,aAAaA,EAAM;AAAA,IACnB,iBAAiBA,EAAM,mBAAmB;AAAA,EAAA,GAGtCU,IAAe,CAACC,MACpBA,MAAST,IAAaM,IAAcC,GAEhCG,IAAeZ,EAAM,gBAAgB,OACrCa,IAAmB,GAAGD,CAAY,QAAQA,CAAY,IACtDE,IAAoB,KAAKF,CAAY,IAAIA,CAAY;AAGzD,SAAAG,gBAAAA,EAAA;AAAA,IAACC;AAAA,IAAA;AAAA,MACE,GAAGhB;AAAA,MACJ,OAAOA,EAAM,SAAS;AAAA,MACtB,IAAI;AAAA,QACF,UAAU;AAAA,QACV,QAAQ;AAAA,MACV;AAAA,MACA,eAAY;AAAA,MAEZ,UAAA;AAAA,QAAAiB,gBAAAA,EAAA;AAAA,UAACC;AAAA,UAAA;AAAA,YACC,IAAI;AAAA,cACF,iBAAiBlB,EAAM;AAAA,cACvB,QAAQ;AAAA,cACR,OAAO;AAAA,cACP,UAAU;AAAA,cACV,WACEE,MAAe,SAAS,kBAAkB;AAAA,cAC5C,oBAAoB;AAAA,cACpB,0BAA0B;AAAA,cAC1B,oBAAoB;AAAA,cACpB,cACEA,MAAe,SAASW,IAAmBC;AAAA,YAC/C;AAAA,YACA,eAAY;AAAA,UAAA;AAAA,QACd;AAAA,QACAG,gBAAAA,EAAA;AAAA,UAACC;AAAA,UAAA;AAAA,YACC,SAASZ;AAAA,YACT,OAAM;AAAA,YACN,SAAQ;AAAA,YACR,IAAIN,EAAM;AAAA,YACV,IAAIA,EAAM;AAAA,YACV,IAAI;AAAA,cACF,cAAca;AAAA,cACd,GAAGH,EAAa,MAAM;AAAA,cACtB,aAAa;AAAA,YACf;AAAA,YACA,eAAY;AAAA,YAEX,UAAMV,EAAA;AAAA,UAAA;AAAA,QACT;AAAA,QACAiB,gBAAAA,EAAA;AAAA,UAACC;AAAA,UAAA;AAAA,YACC,SAASX;AAAA,YACT,OAAM;AAAA,YACN,SAAQ;AAAA,YACR,IAAIP,EAAM;AAAA,YACV,IAAIA,EAAM;AAAA,YACV,IAAI;AAAA,cACF,cAAcc;AAAA,cACd,GAAGJ,EAAa,OAAO;AAAA,cACvB,YAAY;AAAA,YACd;AAAA,YACA,eAAY;AAAA,YAEX,UAAMV,EAAA;AAAA,UAAA;AAAA,QACT;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN;"}
+{"version":3,"file":"sd-component-library131.js","sources":["../src/components/switches/primary-toggle-switch/primary-toggle-switch.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { Box } from \"rebass\";\n\nimport { PrimaryToggleSwitchProps as Props } from \"./interfaces\";\n\nconst animationDuration = 200;\nconst width = \"40px\";\nconst p = \"3px\";\nconst height = \"20px\";\nconst innerSize = `calc(${height} - 2 * ${p})`;\n\nexport const PrimaryToggleSwitch: React.FC<Props> = ({\n  value,\n  setValue,\n  inactiveColor = \"cl_lightGrey\",\n  activeColor = \"cl_purple\",\n}) => {\n  const onBadgeClick = () => {\n    setValue?.(!value);\n  };\n\n  return (\n    <Box\n      bg={value ? activeColor : inactiveColor}\n      sx={{\n        borderRadius: 100,\n        cursor: \"pointer\",\n        transition: `all ${animationDuration}ms`,\n      }}\n      {...{ width, p, height }}\n      onClick={onBadgeClick}\n    >\n      <Box\n        size={innerSize}\n        bg=\"white\"\n        sx={{\n          borderRadius: \"50%\",\n          transform: `translateX(${\n            value ? `calc(${width} - 2 * ${p} - ${innerSize})` : 0\n          })`,\n          transition: `all ${animationDuration}ms`,\n        }}\n      />\n    </Box>\n  );\n};\n"],"names":["animationDuration","width","p","height","innerSize","PrimaryToggleSwitch","value","setValue","inactiveColor","activeColor","onBadgeClick","jsx","Box"],"mappings":";;AAMA,MAAMA,IAAoB,KACpBC,IAAQ,QACRC,IAAI,OACJC,IAAS,QACTC,IAAY,QAAQD,CAAM,UAAUD,CAAC,KAE9BG,IAAuC,CAAC;AAAA,EACnD,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,eAAAC,IAAgB;AAAA,EAChB,aAAAC,IAAc;AAChB,MAAM;AACJ,QAAMC,IAAe,MAAM;AACzB,IAAAH,KAAA,QAAAA,EAAW,CAACD;AAAA,EAAK;AAIjB,SAAAK,gBAAAA,EAAA;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,IAAIN,IAAQG,IAAcD;AAAA,MAC1B,IAAI;AAAA,QACF,cAAc;AAAA,QACd,QAAQ;AAAA,QACR,YAAY,OAAOR,CAAiB;AAAA,MACtC;AAAA,MACM,OAAAC;AAAA,MAAO,GAAAC;AAAA,MAAG,QAAAC;AAAA,MAChB,SAASO;AAAA,MAET,UAAAC,gBAAAA,EAAA;AAAA,QAACC;AAAA,QAAA;AAAA,UACC,MAAMR;AAAA,UACN,IAAG;AAAA,UACH,IAAI;AAAA,YACF,cAAc;AAAA,YACd,WAAW,cACTE,IAAQ,QAAQL,CAAK,UAAUC,CAAC,MAAME,CAAS,MAAM,CACvD;AAAA,YACA,YAAY,OAAOJ,CAAiB;AAAA,UACtC;AAAA,QAAA;AAAA,MACF;AAAA,IAAA;AAAA,EAAA;AAGN;"}