@popsure/dirty-swan 0.57.4 → 0.57.6

package/dist/esm/components/badge/index.js

@@ -19,7 +19,7 @@ var getVariantClassNames = function (variant) { return ({
 }[variant]); };
 var Badge = function (_a) {
     var _b = _a.className, className = _b === void 0 ? '' : _b, _c = _a.size, size = _c === void 0 ? 'medium' : _c, _d = _a.variant, variant = _d === void 0 ? 'information' : _d, children = _a.children;
-    return (jsx("div", { className: classNames(className, 'px16 br8 d-inline-block ai-center fw-bold p-p', { 'p-p--small': size === 'small' }, styles["badge--".concat(size)], getVariantClassNames(variant)), children: children }));
+    return (jsx("div", { role: "status", className: classNames(className, 'px16 br8 d-inline-block ai-center fw-bold p-p', { 'p-p--small': size === 'small' }, styles["badge--".concat(size)], getVariantClassNames(variant)), children: children }));
 };
 
 export { Badge };

package/dist/esm/components/badge/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../src/lib/components/badge/index.tsx"],"sourcesContent":["import { ReactNode } from 'react';\nimport classNames from 'classnames';\nimport styles from './style.module.scss';\n\ntype Variant = \n | 'warning'\n | 'error'\n | 'success'\n | 'information'\n | 'neutral'\n | 'neutral200'\n | 'neutral300'\n | 'primary'\n | 'primary900';\n\nexport interface BadgeProps {\n  className?: string;\n  variant?: Variant;\n  size?: 'small' | 'medium' | 'large';\n  children: ReactNode;\n}\n\nconst getVariantClassNames = (variant: Variant) => ({\n  information: 'bg-blue-100',\n  neutral: 'bg-white',\n  neutral200: 'bg-grey-200',\n  neutral300: 'bg-grey-300',\n  warning: 'bg-yellow-100',\n  error: 'bg-red-100',\n  success: 'bg-green-100',\n  primary: 'bg-purple-100',\n  primary900: 'bg-purple-900 tc-white',\n}[variant])\n\nconst Badge = ({\n  className = '',\n  size = 'medium',\n  variant = 'information',\n  children,\n}: BadgeProps) => (\n  <div\n    className={classNames(\n      className, \n      'px16 br8 d-inline-block ai-center fw-bold p-p', \n      { 'p-p--small': size === 'small' },\n      styles[`badge--${size}`],\n      getVariantClassNames(variant)\n    )}\n  >\n    {children}\n  </div>\n);\n\nexport { Badge };\n"],"names":["_jsx"],"mappings":";;;;;;;;AAsBA,IAAM,oBAAoB,GAAG,UAAC,OAAgB,IAAK,QAAC;IAClD,WAAW,EAAE,aAAa;IAC1B,OAAO,EAAE,UAAU;IACnB,UAAU,EAAE,aAAa;IACzB,UAAU,EAAE,aAAa;IACzB,OAAO,EAAE,eAAe;IACxB,KAAK,EAAE,YAAY;IACnB,OAAO,EAAE,cAAc;IACvB,OAAO,EAAE,eAAe;IACxB,UAAU,EAAE,wBAAwB;CACrC,CAAC,OAAO,CAAC,IAAC,CAAA;IAEL,KAAK,GAAG,UAAC,EAKF;QAJX,iBAAc,EAAd,SAAS,mBAAG,EAAE,KAAA,EACd,YAAe,EAAf,IAAI,mBAAG,QAAQ,KAAA,EACf,eAAuB,EAAvB,OAAO,mBAAG,aAAa,KAAA,EACvB,QAAQ,cAAA;IACQ,QAChBA,aACE,SAAS,EAAE,UAAU,CACnB,SAAS,EACT,+CAA+C,EAC/C,EAAE,YAAY,EAAE,IAAI,KAAK,OAAO,EAAE,EAClC,MAAM,CAAC,iBAAU,IAAI,CAAE,CAAC,EACxB,oBAAoB,CAAC,OAAO,CAAC,CAC9B,YAEA,QAAQ,GACL;AAXU;;;;"}
+{"version":3,"file":"index.js","sources":["../../../../../src/lib/components/badge/index.tsx"],"sourcesContent":["import { ReactNode } from 'react';\nimport classNames from 'classnames';\nimport styles from './style.module.scss';\n\ntype Variant = \n | 'warning'\n | 'error'\n | 'success'\n | 'information'\n | 'neutral'\n | 'neutral200'\n | 'neutral300'\n | 'primary'\n | 'primary900';\n\nexport interface BadgeProps {\n  className?: string;\n  variant?: Variant;\n  size?: 'small' | 'medium' | 'large';\n  children: ReactNode;\n}\n\nconst getVariantClassNames = (variant: Variant) => ({\n  information: 'bg-blue-100',\n  neutral: 'bg-white',\n  neutral200: 'bg-grey-200',\n  neutral300: 'bg-grey-300',\n  warning: 'bg-yellow-100',\n  error: 'bg-red-100',\n  success: 'bg-green-100',\n  primary: 'bg-purple-100',\n  primary900: 'bg-purple-900 tc-white',\n}[variant])\n\nconst Badge = ({\n  className = '',\n  size = 'medium',\n  variant = 'information',\n  children,\n}: BadgeProps) => (\n  <div\n    role=\"status\" \n    className={classNames(\n      className, \n      'px16 br8 d-inline-block ai-center fw-bold p-p', \n      { 'p-p--small': size === 'small' },\n      styles[`badge--${size}`],\n      getVariantClassNames(variant)\n    )}\n  >\n    {children}\n  </div>\n);\n\nexport { Badge };\n"],"names":["_jsx"],"mappings":";;;;;;;;AAsBA,IAAM,oBAAoB,GAAG,UAAC,OAAgB,IAAK,QAAC;IAClD,WAAW,EAAE,aAAa;IAC1B,OAAO,EAAE,UAAU;IACnB,UAAU,EAAE,aAAa;IACzB,UAAU,EAAE,aAAa;IACzB,OAAO,EAAE,eAAe;IACxB,KAAK,EAAE,YAAY;IACnB,OAAO,EAAE,cAAc;IACvB,OAAO,EAAE,eAAe;IACxB,UAAU,EAAE,wBAAwB;CACrC,CAAC,OAAO,CAAC,IAAC,CAAA;IAEL,KAAK,GAAG,UAAC,EAKF;QAJX,iBAAc,EAAd,SAAS,mBAAG,EAAE,KAAA,EACd,YAAe,EAAf,IAAI,mBAAG,QAAQ,KAAA,EACf,eAAuB,EAAvB,OAAO,mBAAG,aAAa,KAAA,EACvB,QAAQ,cAAA;IACQ,QAChBA,aACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,UAAU,CACnB,SAAS,EACT,+CAA+C,EAC/C,EAAE,YAAY,EAAE,IAAI,KAAK,OAAO,EAAE,EAClC,MAAM,CAAC,iBAAU,IAAI,CAAE,CAAC,EACxB,oBAAoB,CAAC,OAAO,CAAC,CAC9B,YAEA,QAAQ,GACL;AAZU;;;;"}

package/dist/esm/components/dateSelector/index.js

@@ -52,7 +52,7 @@ function isoStringtoCalendarDate(input) {
     return { year: year, month: month + 1, day: day };
 }
 
-var css_248z = ".style-module_container__3bJf5 {\n  display: flex;\n}\n@media (max-width: 34rem) {\n  .style-module_container__3bJf5 {\n    flex-direction: column;\n  }\n}\n\n.style-module_dayInput__1OBNv,\n.style-module_monthInput__2L_7o {\n  width: 88px;\n  flex: 1;\n}\n\n.style-module_yearInput__2C_H8 {\n  width: 104px;\n}\n@media (max-width: 34rem) {\n  .style-module_yearInput__2C_H8 {\n    width: 100%;\n  }\n}";
+var css_248z = ".style-module_container__3bJf5 {\n  display: flex;\n}\n@media (max-width: 34rem) {\n  .style-module_container__3bJf5 {\n    width: 100%;\n    flex-direction: column;\n  }\n}\n\n.style-module_dayInput__1OBNv,\n.style-module_monthInput__2L_7o {\n  width: 88px;\n  flex: 1;\n}\n\n.style-module_yearInput__2C_H8 {\n  width: 104px;\n}\n@media (max-width: 34rem) {\n  .style-module_yearInput__2C_H8 {\n    width: 100%;\n  }\n}";
 var styles = {"container":"style-module_container__3bJf5","dayInput":"style-module_dayInput__1OBNv","monthInput":"style-module_monthInput__2L_7o","yearInput":"style-module_yearInput__2C_H8"};
 styleInject(css_248z);
 

package/dist/esm/components/modal/bottomModal/index.js

@@ -16,7 +16,7 @@ styleInject(css_248z);
 
 var BottomModal = function (_a) {
     var className = _a.className, classNames$1 = _a.classNames, rest = __rest(_a, ["className", "classNames"]);
-    return (jsx(GenericModal, __assign({ titleSize: "small", classNames: __assign(__assign({}, classNames$1), { wrapper: classNames('w100', styles.wrapper, classNames$1 === null || classNames$1 === void 0 ? void 0 : classNames$1.wrapper), container: function (_a) {
+    return (jsx(GenericModal, __assign({ titleSize: "default", classNames: __assign(__assign({}, classNames$1), { wrapper: classNames('w100', styles.wrapper, classNames$1 === null || classNames$1 === void 0 ? void 0 : classNames$1.wrapper), container: function (_a) {
                 var _b;
                 var isClosing = _a.isClosing;
                 return classNames('bg-white d-flex fd-column w100', className, styles.container, classNames$1 === null || classNames$1 === void 0 ? void 0 : classNames$1.container, (_b = {},

package/dist/esm/components/modal/bottomModal/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../../src/lib/components/modal/bottomModal/index.tsx"],"sourcesContent":["import { Props } from '..';\nimport styles from './style.module.scss';\nimport classNamesUtil from 'classnames';\nimport { GenericModal } from '../genericModal';\n\nconst BottomModal = ({ className, classNames, ...rest }: Props) => (\n  <GenericModal\n    titleSize=\"small\"\n    classNames={{\n      ...classNames,\n      wrapper: classNamesUtil('w100', styles.wrapper, classNames?.wrapper),\n      container: ({ isClosing }) =>\n        classNamesUtil(\n          'bg-white d-flex fd-column w100',\n          className,\n          styles.container,\n          classNames?.container,\n          {\n            [styles.containerClose]: isClosing,\n          }\n        ),\n      body: classNamesUtil(styles.body, classNames?.body),\n    }}\n    {...rest}\n  />\n);\n\nexport { BottomModal };\n"],"names":["classNames","_jsx","classNamesUtil"],"mappings":";;;;;;;;;;;;;;;;IAKM,WAAW,GAAG,UAAC,EAAyC;IAAvC,IAAA,SAAS,eAAA,EAAEA,YAAU,gBAAA,EAAK,IAAI,cAAhC,2BAAkC,CAAF;IAAc,QACjEC,IAAC,YAAY,aACX,SAAS,EAAC,OAAO,EACjB,UAAU,wBACLD,YAAU,KACb,OAAO,EAAEE,UAAc,CAAC,MAAM,EAAE,MAAM,CAAC,OAAO,EAAEF,YAAU,aAAVA,YAAU,uBAAVA,YAAU,CAAE,OAAO,CAAC,EACpE,SAAS,EAAE,UAAC,EAAa;;oBAAX,SAAS,eAAA;gBACrB,OAAAE,UAAc,CACZ,gCAAgC,EAChC,SAAS,EACT,MAAM,CAAC,SAAS,EAChBF,YAAU,aAAVA,YAAU,uBAAVA,YAAU,CAAE,SAAS;oBAEnB,GAAC,MAAM,CAAC,cAAc,IAAG,SAAS;wBAErC;aAAA,EACH,IAAI,EAAEE,UAAc,CAAC,MAAM,CAAC,IAAI,EAAEF,YAAU,aAAVA,YAAU,uBAAVA,YAAU,CAAE,IAAI,CAAC,OAEjD,IAAI,EACR,EACH;;;;;"}
+{"version":3,"file":"index.js","sources":["../../../../../../src/lib/components/modal/bottomModal/index.tsx"],"sourcesContent":["import { Props } from '..';\nimport styles from './style.module.scss';\nimport classNamesUtil from 'classnames';\nimport { GenericModal } from '../genericModal';\n\nconst BottomModal = ({ className, classNames, ...rest }: Props) => (\n  <GenericModal\n    titleSize=\"default\"\n    classNames={{\n      ...classNames,\n      wrapper: classNamesUtil('w100', styles.wrapper, classNames?.wrapper),\n      container: ({ isClosing }) =>\n        classNamesUtil(\n          'bg-white d-flex fd-column w100',\n          className,\n          styles.container,\n          classNames?.container,\n          {\n            [styles.containerClose]: isClosing,\n          }\n        ),\n      body: classNamesUtil(styles.body, classNames?.body),\n    }}\n    {...rest}\n  />\n);\n\nexport { BottomModal };\n"],"names":["classNames","_jsx","classNamesUtil"],"mappings":";;;;;;;;;;;;;;;;IAKM,WAAW,GAAG,UAAC,EAAyC;IAAvC,IAAA,SAAS,eAAA,EAAEA,YAAU,gBAAA,EAAK,IAAI,cAAhC,2BAAkC,CAAF;IAAc,QACjEC,IAAC,YAAY,aACX,SAAS,EAAC,SAAS,EACnB,UAAU,wBACLD,YAAU,KACb,OAAO,EAAEE,UAAc,CAAC,MAAM,EAAE,MAAM,CAAC,OAAO,EAAEF,YAAU,aAAVA,YAAU,uBAAVA,YAAU,CAAE,OAAO,CAAC,EACpE,SAAS,EAAE,UAAC,EAAa;;oBAAX,SAAS,eAAA;gBACrB,OAAAE,UAAc,CACZ,gCAAgC,EAChC,SAAS,EACT,MAAM,CAAC,SAAS,EAChBF,YAAU,aAAVA,YAAU,uBAAVA,YAAU,CAAE,SAAS;oBAEnB,GAAC,MAAM,CAAC,cAAc,IAAG,SAAS;wBAErC;aAAA,EACH,IAAI,EAAEE,UAAc,CAAC,MAAM,CAAC,IAAI,EAAEF,YAAU,aAAVA,YAAU,uBAAVA,YAAU,CAAE,IAAI,CAAC,OAEjD,IAAI,EACR,EACH;;;;;"}

package/dist/esm/components/segmentedControl/index.js

@@ -2,7 +2,7 @@ import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { useState, useRef, useEffect } from 'react';
 import { s as styleInject } from '../../style-inject.es-1f59c1d0.js';
 
-var css_248z = ".style-module_background-container__2Gjka {\n  position: relative;\n  display: inline-block;\n  background-color: var(--ds-primary-100);\n  border-radius: 8px;\n  padding: 0 8px;\n}\n\n.style-module_chip-container__7XeKn {\n  display: flex;\n  align-items: center;\n}\n\n.style-module_chip__3rgLT {\n  cursor: pointer;\n  z-index: 2;\n  padding-left: 16px;\n  padding-right: 16px;\n}\n\n.style-module_select-chip-background__YCAyw {\n  position: absolute;\n  background-color: white;\n  border-radius: 8px;\n  top: 8px;\n  z-index: 1;\n  transition: width 0.3s, left 0.3s;\n}";
+var css_248z = ".style-module_background-container__2Gjka {\n  position: relative;\n  display: inline-block;\n  background-color: var(--ds-primary-100);\n  border-radius: 8px;\n  padding: 0 8px;\n}\n\n.style-module_chip-container__7XeKn {\n  display: flex;\n  align-items: center;\n}\n\n.style-module_chip__3rgLT {\n  cursor: pointer;\n  z-index: 2;\n  padding-left: 16px;\n  padding-right: 16px;\n}\n.style-module_chip__3rgLT:focus {\n  outline-color: var(--ds-primary-500);\n  outline-offset: 2px;\n}\n\n.style-module_select-chip-background__YCAyw {\n  position: absolute;\n  background-color: white;\n  border-radius: 8px;\n  top: 8px;\n  z-index: 1;\n  transition: width 0.3s, left 0.3s;\n}";
 var styles = {"background-container":"style-module_background-container__2Gjka","chip-container":"style-module_chip-container__7XeKn","chip":"style-module_chip__3rgLT","select-chip-background":"style-module_select-chip-background__YCAyw"};
 styleInject(css_248z);
 
@@ -20,7 +20,7 @@ var SegmentedControl = function (_a) {
     }, [selectedIndex]);
     return (jsx("div", { className: className, children: jsxs("div", { className: styles['background-container'], children: [jsx("div", { ref: chipContainer, className: styles['chip-container'], style: { height: "".concat(height, "px") }, children: values.map(function (value, index) {
                         return (jsx("div", { role: "button", tabIndex: 0, onKeyDown: function (e) {
-                                if (e.key === 'Enter') {
+                                if (e.key === 'Enter' || e.code === 'Space') {
                                     onChange(index);
                                 }
                             }, onClick: function () {

package/dist/esm/components/segmentedControl/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../src/lib/components/segmentedControl/index.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from 'react';\nimport styles from './style.module.scss';\n\ninterface TitleWithSubtitle {\n  title: string;\n  subtitle: string;\n}\n\nexport interface SegmentedControlProps {\n  className?: string;\n  values: Array<TitleWithSubtitle> | Array<string>;\n  selectedIndex: number;\n  onChange: (selectedIndex: number) => void;\n}\n\nconst SegmentedControl = ({\n  className = '',\n  values,\n  selectedIndex,\n  onChange,\n}: SegmentedControlProps) => {\n  const [selectedChipBackgroundWidthLeft, setSelectedChipBackgroundWidthLeft] =\n    useState<{\n      left: number;\n      width: number;\n    }>({ left: 0, width: 0 });\n  const chipContainer = useRef<HTMLDivElement | null>(null);\n  const height = typeof values[0] === 'string' ? 48 : 66;\n\n  useEffect(() => {\n    const selectedChip = chipContainer.current?.children[\n      selectedIndex\n    ] as HTMLDivElement;\n    const left = selectedChip.offsetLeft;\n    const width = selectedChip.offsetWidth;\n    setSelectedChipBackgroundWidthLeft({ left, width });\n  }, [selectedIndex]);\n\n  return (\n    <div className={className}>\n      <div className={styles['background-container']}>\n        <div\n          ref={chipContainer}\n          className={styles['chip-container']}\n          style={{ height: `${height}px` }}\n        >\n          {values.map((value: TitleWithSubtitle | string, index: number) => {\n            return (\n              <div\n                role=\"button\"\n                tabIndex={0}\n                onKeyDown={(e) => {\n                  if (e.key === 'Enter') {\n                    onChange(index);\n                  }\n                }}\n                onClick={() => {\n                  onChange(index);\n                }}\n                className={styles.chip}\n                key={typeof value === 'string' ? value : value.title}\n              >\n                {typeof value === 'string' ? (\n                  <div\n                    className={`p-h4 ta-center ${\n                      selectedIndex === index ? '' : 'tc-primary-500'\n                    }`}\n                  >\n                    {value}\n                  </div>\n                ) : (\n                  <>\n                    <div\n                      className={`p-h4 ta-center ${\n                        selectedIndex === index ? '' : 'tc-primary-500'\n                      }`}\n                    >\n                      {value.title}\n                    </div>\n                    <div\n                      className={`p-p--small ta-center ${\n                        selectedIndex === index\n                          ? 'tc-grey-500'\n                          : 'tc-primary-500'\n                      }`}\n                    >\n                      {value.subtitle}\n                    </div>\n                  </>\n                )}\n              </div>\n            );\n          })}\n        </div>\n        <div\n          className={styles['select-chip-background']}\n          style={{\n            width: `${selectedChipBackgroundWidthLeft.width}px`,\n            height: `${height - 16}px`,\n            left: `${selectedChipBackgroundWidthLeft.left}px`,\n          }}\n        />\n      </div>\n    </div>\n  );\n};\n\nexport { SegmentedControl };\n"],"names":["_jsx","_jsxs"],"mappings":";;;;;;;;IAeM,gBAAgB,GAAG,UAAC,EAKF;QAJtB,iBAAc,EAAd,SAAS,mBAAG,EAAE,KAAA,EACd,MAAM,YAAA,EACN,aAAa,mBAAA,EACb,QAAQ,cAAA;IAEF,IAAA,KACJ,QAAQ,CAGL,EAAE,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,CAAC,EAJpB,+BAA+B,QAAA,EAAE,kCAAkC,QAI/C,CAAC;IAC5B,IAAM,aAAa,GAAG,MAAM,CAAwB,IAAI,CAAC,CAAC;IAC1D,IAAM,MAAM,GAAG,OAAO,MAAM,CAAC,CAAC,CAAC,KAAK,QAAQ,GAAG,EAAE,GAAG,EAAE,CAAC;IAEvD,SAAS,CAAC;;QACR,IAAM,YAAY,GAAG,MAAA,aAAa,CAAC,OAAO,0CAAE,QAAQ,CAClD,aAAa,CACI,CAAC;QACpB,IAAM,IAAI,GAAG,YAAY,CAAC,UAAU,CAAC;QACrC,IAAM,KAAK,GAAG,YAAY,CAAC,WAAW,CAAC;QACvC,kCAAkC,CAAC,EAAE,IAAI,MAAA,EAAE,KAAK,OAAA,EAAE,CAAC,CAAC;KACrD,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC;IAEpB,QACEA,aAAK,SAAS,EAAE,SAAS,YACvBC,cAAK,SAAS,EAAE,MAAM,CAAC,sBAAsB,CAAC,aAC5CD,aACE,GAAG,EAAE,aAAa,EAClB,SAAS,EAAE,MAAM,CAAC,gBAAgB,CAAC,EACnC,KAAK,EAAE,EAAE,MAAM,EAAE,UAAG,MAAM,OAAI,EAAE,YAE/B,MAAM,CAAC,GAAG,CAAC,UAAC,KAAiC,EAAE,KAAa;wBAC3D,QACEA,aACE,IAAI,EAAC,QAAQ,EACb,QAAQ,EAAE,CAAC,EACX,SAAS,EAAE,UAAC,CAAC;gCACX,IAAI,CAAC,CAAC,GAAG,KAAK,OAAO,EAAE;oCACrB,QAAQ,CAAC,KAAK,CAAC,CAAC;iCACjB;6BACF,EACD,OAAO,EAAE;gCACP,QAAQ,CAAC,KAAK,CAAC,CAAC;6BACjB,EACD,SAAS,EAAE,MAAM,CAAC,IAAI,YAGrB,OAAO,KAAK,KAAK,QAAQ,IACxBA,aACE,SAAS,EAAE,yBACT,aAAa,KAAK,KAAK,GAAG,EAAE,GAAG,gBAAgB,CAC/C,YAED,KAAK,GACF,KAENC,4BACED,aACE,SAAS,EAAE,yBACT,aAAa,KAAK,KAAK,GAAG,EAAE,GAAG,gBAAgB,CAC/C,YAED,KAAK,CAAC,KAAK,GACR,EACNA,aACE,SAAS,EAAE,+BACT,aAAa,KAAK,KAAK;8CACnB,aAAa;8CACb,gBAAgB,CACpB,YAED,KAAK,CAAC,QAAQ,GACX,IACL,CACJ,IA7BI,OAAO,KAAK,KAAK,QAAQ,GAAG,KAAK,GAAG,KAAK,CAAC,KAAK,CA8BhD,EACN;qBACH,CAAC,GACE,EACNA,aACE,SAAS,EAAE,MAAM,CAAC,wBAAwB,CAAC,EAC3C,KAAK,EAAE;wBACL,KAAK,EAAE,UAAG,+BAA+B,CAAC,KAAK,OAAI;wBACnD,MAAM,EAAE,UAAG,MAAM,GAAG,EAAE,OAAI;wBAC1B,IAAI,EAAE,UAAG,+BAA+B,CAAC,IAAI,OAAI;qBAClD,GACD,IACE,GACF,EACN;AACJ;;;;"}
+{"version":3,"file":"index.js","sources":["../../../../../src/lib/components/segmentedControl/index.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from 'react';\nimport styles from './style.module.scss';\n\ninterface TitleWithSubtitle {\n  title: string;\n  subtitle: string;\n}\n\nexport interface SegmentedControlProps {\n  className?: string;\n  values: Array<TitleWithSubtitle> | Array<string>;\n  selectedIndex: number;\n  onChange: (selectedIndex: number) => void;\n}\n\nconst SegmentedControl = ({\n  className = '',\n  values,\n  selectedIndex,\n  onChange,\n}: SegmentedControlProps) => {\n  const [selectedChipBackgroundWidthLeft, setSelectedChipBackgroundWidthLeft] =\n    useState<{\n      left: number;\n      width: number;\n    }>({ left: 0, width: 0 });\n  const chipContainer = useRef<HTMLDivElement | null>(null);\n  const height = typeof values[0] === 'string' ? 48 : 66;\n\n  useEffect(() => {\n    const selectedChip = chipContainer.current?.children[\n      selectedIndex\n    ] as HTMLDivElement;\n    const left = selectedChip.offsetLeft;\n    const width = selectedChip.offsetWidth;\n    setSelectedChipBackgroundWidthLeft({ left, width });\n  }, [selectedIndex]);\n\n  return (\n    <div className={className}>\n      <div className={styles['background-container']}>\n        <div\n          ref={chipContainer}\n          className={styles['chip-container']}\n          style={{ height: `${height}px` }}\n        >\n          {values.map((value: TitleWithSubtitle | string, index: number) => {\n            return (\n              <div\n                role=\"button\"\n                tabIndex={0}\n                onKeyDown={(e) => {\n                  if (e.key === 'Enter' || e.code === 'Space') {\n                    onChange(index);\n                  }\n                }}\n                onClick={() => {\n                  onChange(index);\n                }}\n                className={styles.chip}\n                key={typeof value === 'string' ? value : value.title}\n              >\n                {typeof value === 'string' ? (\n                  <div\n                    className={`p-h4 ta-center ${\n                      selectedIndex === index ? '' : 'tc-primary-500'\n                    }`}\n                  >\n                    {value}\n                  </div>\n                ) : (\n                  <>\n                    <div\n                      className={`p-h4 ta-center ${\n                        selectedIndex === index ? '' : 'tc-primary-500'\n                      }`}\n                    >\n                      {value.title}\n                    </div>\n                    <div\n                      className={`p-p--small ta-center ${\n                        selectedIndex === index\n                          ? 'tc-grey-500'\n                          : 'tc-primary-500'\n                      }`}\n                    >\n                      {value.subtitle}\n                    </div>\n                  </>\n                )}\n              </div>\n            );\n          })}\n        </div>\n        <div\n          className={styles['select-chip-background']}\n          style={{\n            width: `${selectedChipBackgroundWidthLeft.width}px`,\n            height: `${height - 16}px`,\n            left: `${selectedChipBackgroundWidthLeft.left}px`,\n          }}\n        />\n      </div>\n    </div>\n  );\n};\n\nexport { SegmentedControl };\n"],"names":["_jsx","_jsxs"],"mappings":";;;;;;;;IAeM,gBAAgB,GAAG,UAAC,EAKF;QAJtB,iBAAc,EAAd,SAAS,mBAAG,EAAE,KAAA,EACd,MAAM,YAAA,EACN,aAAa,mBAAA,EACb,QAAQ,cAAA;IAEF,IAAA,KACJ,QAAQ,CAGL,EAAE,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,CAAC,EAJpB,+BAA+B,QAAA,EAAE,kCAAkC,QAI/C,CAAC;IAC5B,IAAM,aAAa,GAAG,MAAM,CAAwB,IAAI,CAAC,CAAC;IAC1D,IAAM,MAAM,GAAG,OAAO,MAAM,CAAC,CAAC,CAAC,KAAK,QAAQ,GAAG,EAAE,GAAG,EAAE,CAAC;IAEvD,SAAS,CAAC;;QACR,IAAM,YAAY,GAAG,MAAA,aAAa,CAAC,OAAO,0CAAE,QAAQ,CAClD,aAAa,CACI,CAAC;QACpB,IAAM,IAAI,GAAG,YAAY,CAAC,UAAU,CAAC;QACrC,IAAM,KAAK,GAAG,YAAY,CAAC,WAAW,CAAC;QACvC,kCAAkC,CAAC,EAAE,IAAI,MAAA,EAAE,KAAK,OAAA,EAAE,CAAC,CAAC;KACrD,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC;IAEpB,QACEA,aAAK,SAAS,EAAE,SAAS,YACvBC,cAAK,SAAS,EAAE,MAAM,CAAC,sBAAsB,CAAC,aAC5CD,aACE,GAAG,EAAE,aAAa,EAClB,SAAS,EAAE,MAAM,CAAC,gBAAgB,CAAC,EACnC,KAAK,EAAE,EAAE,MAAM,EAAE,UAAG,MAAM,OAAI,EAAE,YAE/B,MAAM,CAAC,GAAG,CAAC,UAAC,KAAiC,EAAE,KAAa;wBAC3D,QACEA,aACE,IAAI,EAAC,QAAQ,EACb,QAAQ,EAAE,CAAC,EACX,SAAS,EAAE,UAAC,CAAC;gCACX,IAAI,CAAC,CAAC,GAAG,KAAK,OAAO,IAAI,CAAC,CAAC,IAAI,KAAK,OAAO,EAAE;oCAC3C,QAAQ,CAAC,KAAK,CAAC,CAAC;iCACjB;6BACF,EACD,OAAO,EAAE;gCACP,QAAQ,CAAC,KAAK,CAAC,CAAC;6BACjB,EACD,SAAS,EAAE,MAAM,CAAC,IAAI,YAGrB,OAAO,KAAK,KAAK,QAAQ,IACxBA,aACE,SAAS,EAAE,yBACT,aAAa,KAAK,KAAK,GAAG,EAAE,GAAG,gBAAgB,CAC/C,YAED,KAAK,GACF,KAENC,4BACED,aACE,SAAS,EAAE,yBACT,aAAa,KAAK,KAAK,GAAG,EAAE,GAAG,gBAAgB,CAC/C,YAED,KAAK,CAAC,KAAK,GACR,EACNA,aACE,SAAS,EAAE,+BACT,aAAa,KAAK,KAAK;8CACnB,aAAa;8CACb,gBAAgB,CACpB,YAED,KAAK,CAAC,QAAQ,GACX,IACL,CACJ,IA7BI,OAAO,KAAK,KAAK,QAAQ,GAAG,KAAK,GAAG,KAAK,CAAC,KAAK,CA8BhD,EACN;qBACH,CAAC,GACE,EACNA,aACE,SAAS,EAAE,MAAM,CAAC,wBAAwB,CAAC,EAC3C,KAAK,EAAE;wBACL,KAAK,EAAE,UAAG,+BAA+B,CAAC,KAAK,OAAI;wBACnD,MAAM,EAAE,UAAG,MAAM,GAAG,EAAE,OAAI;wBAC1B,IAAI,EAAE,UAAG,+BAA+B,CAAC,IAAI,OAAI;qBAClD,GACD,IACE,GACF,EACN;AACJ;;;;"}

package/dist/esm/components/spinner/index.js

@@ -3,7 +3,7 @@ import { c as classNames } from '../../index-6ea95111.js';
 
 var Spinner = function (_a) {
     var _b = _a.size, size = _b === void 0 ? 's' : _b;
-    return (jsx("div", { className: classNames('ds-spinner', "ds-spinner__".concat(size)), "data-testid": "ds-spinner" }));
+    return (jsx("div", { "aria-live": 'polite', className: classNames('ds-spinner', "ds-spinner__".concat(size)), "data-testid": "ds-spinner" }));
 };
 
 export { Spinner };

package/dist/esm/components/spinner/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../src/lib/components/spinner/index.tsx"],"sourcesContent":["import classNames from 'classnames';\n\nexport interface SpinnerProps {\n  size?: 's' | 'm' | 'l';\n}\n\nconst Spinner = ({ size = 's' }: SpinnerProps) => (\n  <div\n    className={classNames('ds-spinner', `ds-spinner__${size}`)}\n    data-testid=\"ds-spinner\"\n  ></div>\n);\n\nexport { Spinner };\n"],"names":["_jsx"],"mappings":";;;IAMM,OAAO,GAAG,UAAC,EAA4B;QAA1B,YAAU,EAAV,IAAI,mBAAG,GAAG,KAAA;IAAqB,QAChDA,aACE,SAAS,EAAE,UAAU,CAAC,YAAY,EAAE,sBAAe,IAAI,CAAE,CAAC,iBAC9C,YAAY,GACnB;AAJyC;;;;"}
+{"version":3,"file":"index.js","sources":["../../../../../src/lib/components/spinner/index.tsx"],"sourcesContent":["import classNames from 'classnames';\n\nexport interface SpinnerProps {\n  size?: 's' | 'm' | 'l';\n}\n\nconst Spinner = ({ size = 's' }: SpinnerProps) => (\n  <div\n    aria-live='polite'\n    className={classNames('ds-spinner', `ds-spinner__${size}`)}\n    data-testid=\"ds-spinner\"\n  ></div>\n);\n\nexport { Spinner };\n"],"names":["_jsx"],"mappings":";;;IAMM,OAAO,GAAG,UAAC,EAA4B;QAA1B,YAAU,EAAV,IAAI,mBAAG,GAAG,KAAA;IAAqB,QAChDA,0BACY,QAAQ,EAClB,SAAS,EAAE,UAAU,CAAC,YAAY,EAAE,sBAAe,IAAI,CAAE,CAAC,iBAC9C,YAAY,GACnB;AALyC;;;;"}

package/dist/esm/lib/components/autocompleteAddress/index.d.ts

@@ -31,6 +31,7 @@ export interface AutocompleteAddressProps {
     manualAddressEntryTexts?: {
         preText?: string;
         cta?: string;
+        ctaSearch?: string;
     };
     countryCode?: string;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@popsure/dirty-swan",
-  "version": "0.57.4",
+  "version": "0.57.6",
   "author": "Vincent Audoire <vincent@getpopsure.com>",
   "license": "MIT",
   "private": false,

package/src/lib/components/autocompleteAddress/index.tsx

@@ -80,6 +80,7 @@ export interface AutocompleteAddressProps {
   manualAddressEntryTexts?: {
     preText?: string;
     cta?: string;
+    ctaSearch?: string;
   };
   countryCode?: string;
 }
@@ -250,7 +251,7 @@ const AutocompleteAddress = ({
           [styles['map-container--hidden']]: place === null,
         })}
       >
-        <div className={styles.map} id="map" />
+        <div className={styles.map} id="map" aria-hidden="true" />
         {isLoading && (
           <div className={styles['loading-spinner']}>
             <div className="ds-spinner ds-spinner__m" />
@@ -258,7 +259,7 @@ const AutocompleteAddress = ({
         )}
       </div>
       <div className={`wmx8`}>
-        {manualAddressEntry === false ? (
+        {!manualAddressEntry ? (
           <div style={{ position: 'relative' }}>
             <Input
               className="w100"
@@ -343,18 +344,20 @@ const AutocompleteAddress = ({
           </>
         )}
       </div>
-      {manualAddressEntry === false && (
-        <div className="p-p mt8">
-          {manualAddressEntryTexts?.preText || 'Or '}
-          <button
-            className={'p-a p-p fw-bold c-pointer bg-transparent'}
-            onClick={handleEnterAddressManually}
-            type="button"
-          >
-            {manualAddressEntryTexts?.cta || 'enter address manually'}
-          </button>
-        </div>
-      )}
+      <div className="p-p mt8">
+        {manualAddressEntryTexts?.preText || 'Or '}
+        <button
+          className={'p-a p-p fw-bold c-pointer bg-transparent'}
+          onClick={() => {
+            manualAddressEntry ? setManualAddressEntry(false) : handleEnterAddressManually();
+          }}
+          type="button"
+        >
+          {manualAddressEntry
+            ? manualAddressEntryTexts?.ctaSearch || 'search for address'
+            : manualAddressEntryTexts?.cta || 'enter address manually'}
+        </button>
+      </div>
     </>
   );
 };

package/src/lib/components/badge/index.tsx

@@ -39,6 +39,7 @@ const Badge = ({
   children,
 }: BadgeProps) => (
   <div
+    role="status" 
     className={classNames(
       className, 
       'px16 br8 d-inline-block ai-center fw-bold p-p', 

package/src/lib/components/dateSelector/style.module.scss

@@ -4,6 +4,7 @@
   display: flex;
 
   @include p-size-mobile {
+    width: 100%;
     flex-direction: column;
   }
 }

package/src/lib/components/modal/bottomModal/index.tsx

@@ -5,7 +5,7 @@ import { GenericModal } from '../genericModal';
 
 const BottomModal = ({ className, classNames, ...rest }: Props) => (
   <GenericModal
-    titleSize="small"
+    titleSize="default"
     classNames={{
       ...classNames,
       wrapper: classNamesUtil('w100', styles.wrapper, classNames?.wrapper),

package/src/lib/components/segmentedControl/index.tsx

@@ -50,7 +50,7 @@ const SegmentedControl = ({
                 role="button"
                 tabIndex={0}
                 onKeyDown={(e) => {
-                  if (e.key === 'Enter') {
+                  if (e.key === 'Enter' || e.code === 'Space') {
                     onChange(index);
                   }
                 }}

package/src/lib/components/segmentedControl/style.module.scss

@@ -20,6 +20,11 @@
 
   padding-left: 16px;
   padding-right: 16px;
+
+  &:focus {
+    outline-color: var(--ds-primary-500);
+    outline-offset: 2px;
+  }
 }
 
 .select-chip-background {

package/src/lib/components/spinner/index.tsx

@@ -6,6 +6,7 @@ export interface SpinnerProps {
 
 const Spinner = ({ size = 's' }: SpinnerProps) => (
   <div
+    aria-live='polite'
     className={classNames('ds-spinner', `ds-spinner__${size}`)}
     data-testid="ds-spinner"
   ></div>