@cleartrip/ct-design-chip-dropdown 4.0.0-TEST.3 → 4.1.0-SNAPSHOT-native-main.1

package/README.md

@@ -0,0 +1,80 @@
+# ChipDropdown
+
+A dropdown component styled as a chip for space-efficient selection.
+
+---
+
+## Installation
+
+```bash
+npm install @cleartrip/ct-design-chip-dropdown
+# or
+pnpm add @cleartrip/ct-design-chip-dropdown
+```
+
+### Peer dependencies
+
+```bash
+# Required for all targets
+npm install react
+
+# Web only
+npm install react-dom
+
+# React Native only
+npm install react-native
+```
+
+---
+
+## Usage
+
+### Basic
+
+```tsx
+import { ChipDropdown } from '@cleartrip/ct-design-chip-dropdown';
+
+function Example() {
+  return (
+    <ChipDropdown>
+      {/* Basic usage */}
+    </ChipDropdown>
+  );
+}
+```
+
+---
+
+## Props
+
+| Prop | Type | Default | Required | Description |
+|------|------|---------|----------|-------------|
+| `width` | `number` | — | Yes | width property |
+| `isDefaultOptionSelected` | `boolean` | — | No | isDefaultOptionSelected property |
+| `defaultChipLabel` | `string` | — | No | defaultChipLabel property |
+| `optionList` | `DropdownProps['itemList']` | — | Yes | optionList property |
+| `selectedOption` | `string` | — | No | selectedOption property |
+| `showDropdown` | `boolean` | — | No | showDropdown property |
+| `onClick` | `(key: string) => void` | — | No | onClick property |
+| `dropdownHeight` | `number` | — | No | dropdownHeight property |
+| `chipArrowDownIconProps` | `SVGProps<SVGSVGElement>` | — | No | chipArrowDownIconProps property |
+| `styleConfig` | `IChipDropdownStyleConfig` | — | No | styleConfig property |
+
+---
+
+## Accessibility
+
+- The component follows accessibility best practices
+- Ensure proper ARIA attributes are provided where needed
+- Test with screen readers to ensure usability
+
+---
+
+## Migration
+
+If migrating from a previous version:
+
+```diff
+- import { ChipDropdown } from 'yagami/core/components';
++ import { ChipDropdown } from '@cleartrip/ct-design-chip-dropdown';
+```

package/dist/ChipDropdown.d.ts

@@ -1,5 +1,5 @@
-import React from 'react';
-import { ChipDropdownProps } from './type';
-declare const ChipDropdown: React.FC<ChipDropdownProps>;
+import { FC } from 'react';
+import { IChipDropdownProps } from './type';
+declare const ChipDropdown: FC<IChipDropdownProps>;
 export default ChipDropdown;
 //# sourceMappingURL=ChipDropdown.d.ts.map

package/dist/ChipDropdown.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ChipDropdown.d.ts","sourceRoot":"","sources":["../packages/components/ChipDropdown/src/ChipDropdown.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsC,MAAM,OAAO,CAAC;AAI3D,OAAO,EAAE,iBAAiB,EAAE,MAAM,QAAQ,CAAC;AAM3C,QAAA,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CA2F7C,CAAC;AAEF,eAAe,YAAY,CAAC"}
+{"version":3,"file":"ChipDropdown.d.ts","sourceRoot":"","sources":["../packages/components/ChipDropdown/src/ChipDropdown.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAA+B,MAAM,OAAO,CAAC;AAWxD,OAAO,EAAE,kBAAkB,EAAE,MAAM,QAAQ,CAAC;AAG5C,QAAA,MAAM,YAAY,EAAE,EAAE,CAAC,kBAAkB,CAqGxC,CAAC;AAGF,eAAe,YAAY,CAAC"}

package/dist/ChipDropdown.native.d.ts

@@ -0,0 +1,5 @@
+import { FC } from 'react';
+import { IChipDropdownProps } from './type';
+declare const ChipDropdown: FC<IChipDropdownProps>;
+export default ChipDropdown;
+//# sourceMappingURL=ChipDropdown.native.d.ts.map

package/dist/ChipDropdown.native.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChipDropdown.native.d.ts","sourceRoot":"","sources":["../packages/components/ChipDropdown/src/ChipDropdown.native.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAA+B,MAAM,OAAO,CAAC;AAUxD,OAAO,EAAE,kBAAkB,EAAE,MAAM,QAAQ,CAAC;AAS5C,QAAA,MAAM,YAAY,EAAE,EAAE,CAAC,kBAAkB,CAgGxC,CAAC;AAGF,eAAe,YAAY,CAAC"}

package/dist/ct-design-chip-dropdown.browser.cjs.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("tslib"),i=require("react/jsx-runtime"),r=require("react"),n=require("@cleartrip/ct-design-container"),t=require("@cleartrip/ct-design-chip"),o=require("@cleartrip/ct-design-theme"),s=require("@cleartrip/ct-design-dropdown"),c=require("@cleartrip/ct-design-outside-click-handler"),l=require("styled-components"),a=require("@cleartrip/ct-design-icons");function d(e){return e&&e.__esModule?e:{default:e}}var u=d(l).default.div((function(i){var r=i.transform,n=i.css,t=void 0===n?{}:n;return function(i){var r=i.transform,n=e.__rest(i,["transform"]);return e.__assign({display:"flex",transform:r},n)}(e.__assign({transform:r},t))}));exports.ChipDropdown=function(l){var d=l.optionList,p=l.isDefaultOptionSelected,f=void 0===p||p,h=l.defaultChipLabel,g=void 0===h?"":h,v=l.selectedOption,w=void 0===v?"":v,_=l.showDropdown,C=void 0!==_&&_,m=l.width,x=void 0===m?"":m,k=l.onClick,q=l.dropdownHeight,j=void 0===q?"500px":q,D=l.styleConfig,b=void 0===D?{}:D,y=r.useRef(!1),O=r.useState(!0),S=O[0],N=O[1],I=r.useState(C),A=I[0],L=I[1],H=o.useTheme(),R=b.root,T=b.chip,z=b.dropdownContainer,E=b.dropdown,M=b.chipArrowDownIcon,P=b.chipArrowWrapper,U=function(){for(var e=0,i=d;e<i.length;e++){var r=i[e],n=r.key,t=r.label;if(n===w)return t}return""};f||A||U();return r.useEffect((function(){if(y.current){var e=f||A||""!==U();N(e)}else N(f),y.current=!0}),[f,A]),i.jsx(n.Container,e.__assign({position:"relative",width:"fit-content",className:null==R?void 0:R.className,css:null==R?void 0:R.css},{children:i.jsxs(c.OutsideClickHandler,e.__assign({onOutsideClick:function(){L(!1)}},{children:[i.jsx(t.Chip,{showIcon:!0,Icon:i.jsx(u,e.__assign({transform:A?"rotate(180deg)":"rotate(0deg)"},P,{children:i.jsx(a.ChipArrowDownSmall,e.__assign({color:S?H.color.background.link2:H.color.background.defaultDarkest},M))})),iconPosition:"right",label:U()||g,isSelected:S,onClick:function(){L(!A)},styleConfig:T}),A&&i.jsx(n.Container,e.__assign({position:"absolute",left:"0",zIndex:1,top:"40px",className:null==z?void 0:z.className,css:null==z?void 0:z.css},{children:i.jsx(s.Dropdown,{optionList:d,width:x,selectedOption:w,onClick:function(e,i){null==k||k(e),L(!A)},icon:i.jsx(a.Tick,{}),varient:s.DropdownVarient.ROUND,height:j,isChipSelection:!0,styleConfig:E})}))]}))}))};
+"use strict";var e=require("react/jsx-runtime"),r=require("react"),o=require("@cleartrip/ct-design-container"),t=require("@cleartrip/ct-design-chip"),i=require("@cleartrip/ct-design-dropdown"),n=require("@cleartrip/ct-design-outside-click-handler"),s=require("@cleartrip/ct-design-style-manager"),c=require("@cleartrip/ct-design-theme"),l=require("@cleartrip/ct-design-icons"),a=require("@cleartrip/ct-design-types");const p=s.makeStyles(()=>({root:{position:"relative",alignSelf:"flex-start"},dropdownContainer:{position:"absolute",left:0,top:40,zIndex:1},chipArrowWrapper:{display:"flex",alignItems:"center",justifyContent:"center"}}));const d=({optionList:d,isDefaultOptionSelected:u=!0,defaultChipLabel:h="",selectedOption:g="",showDropdown:w=!1,onClick:C,dropdownHeight:f=500,chipArrowDownIconProps:y,styleConfig:x})=>{const k=r.useRef(!1),[m,j]=r.useState(!0),[q,D]=r.useState(w),S=c.useTheme(),{root:b=[],chip:I,dropdownContainer:A=[],dropdown:O,chipArrowWrapper:W=[]}=x||{},v=s.useStyles(()=>{return{chipArrowWrapper:(e=q,{transform:e?"rotate(180deg)":"rotate(0deg)"})};var e},[q]),H=(()=>{for(const e of d){const{key:r,label:o}=e;if(r===g)return o}return""})(),L=u||q||""!==H;return r.useEffect(()=>{k.current?j(L):(j(u),k.current=!0)},[u,q,H]),e.jsx(o.Container,{styleConfig:{root:[p.root,...b]},children:e.jsxs(n.OutsideClickHandler,{onOutsideClick:()=>{D(!1)},children:[e.jsx(t.Chip,{showIcon:!0,Icon:e.jsx(o.Container,{styleConfig:{root:[p.chipArrowWrapper,v.chipArrowWrapper,...W]},children:e.jsx(l.ChipArrowDownSmall,Object.assign({color:m?S.color.background.link2:S.color.background.defaultDarkest},y||{}))}),iconPosition:a.IconPosition.RIGHT,label:H||h,isSelected:m,onClick:()=>{D(e=>!e)},styleConfig:I}),q&&e.jsx(o.Container,{styleConfig:{root:[p.dropdownContainer,...A]},children:e.jsx(i.Dropdown,{itemList:d,dropDownValue:g,onItemSelect:e=>{null==C||C(e.label),D(e=>!e)},height:f,styleConfig:O})})]})})};d.displayName="ChipDropdown",exports.ChipDropdown=d;
 //# sourceMappingURL=ct-design-chip-dropdown.browser.cjs.js.map

package/dist/ct-design-chip-dropdown.browser.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"ct-design-chip-dropdown.browser.cjs.js","sources":["../packages/components/ChipDropdown/src/StyledChipArrow/StyledChipArrow.tsx","../packages/components/ChipDropdown/src/ChipDropdown.tsx"],"sourcesContent":[null,null],"names":["StyledChipArrow","default","div","_a","transform","_b","css","rest","__rest","__assign","display","getStyledChipArrowStyles","optionList","isDefaultOptionSelected","_c","defaultChipLabel","_d","selectedOption","_e","showDropdown","_f","width","onClick","_g","dropdownHeight","_h","styleConfig","chipRef","useRef","_j","useState","isActiveChip","setIsActiveChip","_k","isDropdownOpen","setIsDropdownOpen","theme","useTheme","root","chip","dropdownContainer","dropdown","chipArrowDownIcon","chipArrowWrapper","chipLabel","optionList_1","_i","length","optionItem","key","label","useEffect","current","isChipActive_1","_jsx","Container","position","className","children","_jsxs","jsxs","OutsideClickHandler","onOutsideClick","Chip","showIcon","Icon","ChipArrowDownSmall","color","background","link2","defaultDarkest","iconPosition","isSelected","jsx","left","zIndex","top","Dropdown","icon","Tick","varient","DropdownVarient","ROUND","height","isChipSelection"],"mappings":"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"}
+{"version":3,"file":"ct-design-chip-dropdown.browser.cjs.js","sources":["../packages/components/ChipDropdown/src/style.ts","../packages/components/ChipDropdown/src/ChipDropdown.tsx"],"sourcesContent":[null,null],"names":["staticStyles","makeStyles","root","position","alignSelf","dropdownContainer","left","top","zIndex","chipArrowWrapper","display","alignItems","justifyContent","ChipDropdown","optionList","isDefaultOptionSelected","defaultChipLabel","selectedOption","showDropdown","onClick","dropdownHeight","chipArrowDownIconProps","styleConfig","chipRef","useRef","isActiveChip","setIsActiveChip","useState","isDropdownOpen","setIsDropdownOpen","theme","useTheme","rootStyles","chip","chipStyleConfig","dropdownContainerStyles","dropdown","dropdownStyleConfig","chipArrowWrapperStyles","dynamicStyles","useStyles","isOpen","transform","chipLabel","optionItem","key","label","getChipLabel","isChipActive","useEffect","current","_jsx","jsx","Container","children","_jsxs","OutsideClickHandler","onOutsideClick","Chip","showIcon","Icon","ChipArrowDownSmall","Object","assign","color","background","link2","defaultDarkest","iconPosition","IconPosition","RIGHT","isSelected","open","Dropdown","itemList","dropDownValue","onItemSelect","item","height","displayName"],"mappings":"iaAQA,MAAMA,EAAeC,EAAUA,WAAC,KAAO,CACrCC,KAAM,CACJC,SAAU,WAGVC,UAAW,cAEbC,kBAAmB,CACjBF,SAAU,WACVG,KAAM,EACNC,IAAK,GACLC,OAAQ,GAEVC,iBAAkB,CAChBC,QAAS,OACTC,WAAY,SACZC,eAAgB,aCVpB,MAAMC,EAAuC,EAC3CC,aACAC,2BAA0B,EAC1BC,mBAAmB,GACnBC,iBAAiB,GACjBC,gBAAe,EACfC,UACAC,iBAAiB,IACjBC,yBACAC,kBAEA,MAAMC,EAAUC,UAAO,IAChBC,EAAcC,GAAmBC,EAAQA,UAAC,IAC1CC,EAAgBC,GAAqBF,EAAQA,SAACT,GAC/CY,EAAQC,EAAAA,YAGZ7B,KAAM8B,EAAa,GACnBC,KAAMC,EACN7B,kBAAmB8B,EAA0B,GAC7CC,SAAUC,EACV5B,iBAAkB6B,EAAyB,IACzChB,GAAe,GAEbiB,EAAgBC,EAAAA,UACpB,KAAO,OACL/B,kBDRkCgC,ECQQb,EDPvC,CACLc,UAAWD,EAAS,iBAAmB,kBAFrC,IAAkCA,GCUpC,CAACb,IAkBGe,EARe,MACnB,IAAK,MAAMC,KAAc9B,EAAY,CACnC,MAAM+B,IAAEA,EAAGC,MAAEA,GAAUF,EACvB,GAAIC,IAAQ5B,EAAgB,OAAO6B,CACpC,CACD,MAAO,IAGSC,GACZC,EAAejC,GAA2Ba,GAAgC,KAAde,EAiBlE,OAVAM,EAAAA,UAAU,KACJ1B,EAAQ2B,QACVxB,EAAgBsB,IAEhBtB,EAAgBX,GAChBQ,EAAQ2B,SAAU,IAGnB,CAACnC,EAAyBa,EAAgBe,IAG3CQ,EAACC,IAAAC,EAASA,UAAC,CAAA/B,YAAa,CAAEpB,KAAM,CAACF,EAAaE,QAAS8B,IACrDsB,SAAAC,EAAAA,KAACC,EAAAA,oBAAoB,CAAAC,eAhCJ,KACnB5B,GAAkB,cAgCdsB,EAAAA,IAACO,EAAAA,KACC,CAAAC,YACAC,KACET,EAAAA,IAACE,EAASA,UAAA,CACR/B,YAAa,CACXpB,KAAM,CAACF,EAAaS,iBAAkB8B,EAAc9B,oBAAqB6B,IAG3EgB,SAAAH,EAAAA,IAACU,EAAAA,mBAAkBC,OAAAC,OAAA,CACjBC,MAAOvC,EAAeK,EAAMkC,MAAMC,WAAWC,MAAQpC,EAAMkC,MAAMC,WAAWE,gBACvE9C,GAA0B,CAAA,MAIrC+C,aAAcC,EAAAA,aAAaC,MAC3BxB,MAAOH,GAAa3B,EACpBuD,WAAY9C,EACZN,QArDgB,KACtBU,EAAmB2C,IAAUA,IAqDvBlD,YAAaY,IAEdN,GACCuB,EAAAA,IAACE,EAAAA,UAAS,CAAC/B,YAAa,CAAEpB,KAAM,CAACF,EAAaK,qBAAsB8B,IAClEmB,SAAAH,EAAAA,IAACsB,EAAAA,SACC,CAAAC,SAAU5D,EACV6D,cAAe1D,EACf2D,aA3CeC,IACzB1D,SAAAA,EAAU0D,EAAK/B,OACfjB,EAAmB2C,IAAUA,IA0CnBM,OAAQ1D,EACRE,YAAae,YAS3BxB,EAAakE,YAAc"}

package/dist/ct-design-chip-dropdown.browser.esm.js

@@ -1,2 +1,2 @@
-import{__assign as o,__rest as i}from"tslib";import{jsx as r,jsxs as t}from"react/jsx-runtime";import{useRef as n,useState as e,useEffect as c}from"react";import{Container as l}from"@cleartrip/ct-design-container";import{Chip as s}from"@cleartrip/ct-design-chip";import{useTheme as d}from"@cleartrip/ct-design-theme";import{Dropdown as a,DropdownVarient as p}from"@cleartrip/ct-design-dropdown";import{OutsideClickHandler as f}from"@cleartrip/ct-design-outside-click-handler";import m from"styled-components";import{ChipArrowDownSmall as u,Tick as h}from"@cleartrip/ct-design-icons";var v=m.div((function(r){var t=r.transform,n=r.css;return function(r){var t=r.transform,n=i(r,["transform"]);return o({display:"flex",transform:t},n)}(o({transform:t},void 0===n?{}:n))})),g=function(i){var m=i.optionList,g=i.isDefaultOptionSelected,w=void 0===g||g,k=i.defaultChipLabel,C=void 0===k?"":k,b=i.selectedOption,x=void 0===b?"":b,y=i.showDropdown,D=void 0!==y&&y,N=i.width,O=void 0===N?"":N,I=i.onClick,L=i.dropdownHeight,S=void 0===L?"500px":L,A=i.styleConfig,j=void 0===A?{}:A,z=n(!1),H=e(!0),P=H[0],R=H[1],U=e(D),W=U[0],q=U[1],B=d(),E=j.root,F=j.chip,G=j.dropdownContainer,J=j.dropdown,K=j.chipArrowDownIcon,M=j.chipArrowWrapper,Q=function(){for(var o=0,i=m;o<i.length;o++){var r=i[o],t=r.key,n=r.label;if(t===x)return n}return""};w||W||Q();return c((function(){if(z.current){var o=w||W||""!==Q();R(o)}else R(w),z.current=!0}),[w,W]),r(l,o({position:"relative",width:"fit-content",className:null==E?void 0:E.className,css:null==E?void 0:E.css},{children:t(f,o({onOutsideClick:function(){q(!1)}},{children:[r(s,{showIcon:!0,Icon:r(v,o({transform:W?"rotate(180deg)":"rotate(0deg)"},M,{children:r(u,o({color:P?B.color.background.link2:B.color.background.defaultDarkest},K))})),iconPosition:"right",label:Q()||C,isSelected:P,onClick:function(){q(!W)},styleConfig:F}),W&&r(l,o({position:"absolute",left:"0",zIndex:1,top:"40px",className:null==G?void 0:G.className,css:null==G?void 0:G.css},{children:r(a,{optionList:m,width:O,selectedOption:x,onClick:function(o,i){null==I||I(o),q(!W)},icon:r(h,{}),varient:p.ROUND,height:S,isChipSelection:!0,styleConfig:J})}))]}))}))};export{g as ChipDropdown};
+import{jsx as r,jsxs as o}from"react/jsx-runtime";import{useRef as t,useState as e,useEffect as i}from"react";import{Container as n}from"@cleartrip/ct-design-container";import{Chip as c}from"@cleartrip/ct-design-chip";import{Dropdown as p}from"@cleartrip/ct-design-dropdown";import{OutsideClickHandler as l}from"@cleartrip/ct-design-outside-click-handler";import{makeStyles as a,useStyles as s}from"@cleartrip/ct-design-style-manager";import{useTheme as d}from"@cleartrip/ct-design-theme";import{ChipArrowDownSmall as f}from"@cleartrip/ct-design-icons";import{IconPosition as m}from"@cleartrip/ct-design-types";const g=a(()=>({root:{position:"relative",alignSelf:"flex-start"},dropdownContainer:{position:"absolute",left:0,top:40,zIndex:1},chipArrowWrapper:{display:"flex",alignItems:"center",justifyContent:"center"}}));const h=({optionList:a,isDefaultOptionSelected:h=!0,defaultChipLabel:u="",selectedOption:w="",showDropdown:C=!1,onClick:y,dropdownHeight:k=500,chipArrowDownIconProps:b,styleConfig:I})=>{const A=t(!1),[D,x]=e(!0),[W,O]=e(C),S=d(),{root:j=[],chip:L,dropdownContainer:v=[],dropdown:H,chipArrowWrapper:P=[]}=I||{},z=s(()=>{return{chipArrowWrapper:(r=W,{transform:r?"rotate(180deg)":"rotate(0deg)"})};var r},[W]),G=(()=>{for(const r of a){const{key:o,label:t}=r;if(o===w)return t}return""})(),N=h||W||""!==G;return i(()=>{A.current?x(N):(x(h),A.current=!0)},[h,W,G]),r(n,{styleConfig:{root:[g.root,...j]},children:o(l,{onOutsideClick:()=>{O(!1)},children:[r(c,{showIcon:!0,Icon:r(n,{styleConfig:{root:[g.chipArrowWrapper,z.chipArrowWrapper,...P]},children:r(f,Object.assign({color:D?S.color.background.link2:S.color.background.defaultDarkest},b||{}))}),iconPosition:m.RIGHT,label:G||u,isSelected:D,onClick:()=>{O(r=>!r)},styleConfig:L}),W&&r(n,{styleConfig:{root:[g.dropdownContainer,...v]},children:r(p,{itemList:a,dropDownValue:w,onItemSelect:r=>{null==y||y(r.label),O(r=>!r)},height:k,styleConfig:H})})]})})};h.displayName="ChipDropdown";export{h as ChipDropdown};
 //# sourceMappingURL=ct-design-chip-dropdown.browser.esm.js.map

package/dist/ct-design-chip-dropdown.browser.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"ct-design-chip-dropdown.browser.esm.js","sources":["../packages/components/ChipDropdown/src/StyledChipArrow/StyledChipArrow.tsx","../packages/components/ChipDropdown/src/ChipDropdown.tsx"],"sourcesContent":[null,null],"names":["StyledChipArrow","styled","div","_a","transform","_b","css","rest","__rest","__assign","display","getStyledChipArrowStyles","ChipDropdown","optionList","isDefaultOptionSelected","_c","defaultChipLabel","_d","selectedOption","_e","showDropdown","_f","width","onClick","_g","dropdownHeight","_h","styleConfig","chipRef","useRef","_j","useState","isActiveChip","setIsActiveChip","_k","isDropdownOpen","setIsDropdownOpen","theme","useTheme","root","chip","dropdownContainer","dropdown","chipArrowDownIcon","chipArrowWrapper","chipLabel","optionList_1","_i","length","optionItem","key","label","useEffect","current","isChipActive_1","_jsx","Container","position","className","children","_jsxs","OutsideClickHandler","onOutsideClick","Chip","showIcon","Icon","ChipArrowDownSmall","color","background","link2","defaultDarkest","iconPosition","isSelected","left","zIndex","top","Dropdown","icon","Tick","varient","DropdownVarient","ROUND","height","isChipSelection"],"mappings":"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"}
+{"version":3,"file":"ct-design-chip-dropdown.browser.esm.js","sources":["../packages/components/ChipDropdown/src/style.ts","../packages/components/ChipDropdown/src/ChipDropdown.tsx"],"sourcesContent":[null,null],"names":["staticStyles","makeStyles","root","position","alignSelf","dropdownContainer","left","top","zIndex","chipArrowWrapper","display","alignItems","justifyContent","ChipDropdown","optionList","isDefaultOptionSelected","defaultChipLabel","selectedOption","showDropdown","onClick","dropdownHeight","chipArrowDownIconProps","styleConfig","chipRef","useRef","isActiveChip","setIsActiveChip","useState","isDropdownOpen","setIsDropdownOpen","theme","useTheme","rootStyles","chip","chipStyleConfig","dropdownContainerStyles","dropdown","dropdownStyleConfig","chipArrowWrapperStyles","dynamicStyles","useStyles","isOpen","transform","chipLabel","optionItem","key","label","getChipLabel","isChipActive","useEffect","current","_jsx","Container","children","_jsxs","OutsideClickHandler","onOutsideClick","Chip","showIcon","Icon","ChipArrowDownSmall","Object","assign","color","background","link2","defaultDarkest","iconPosition","IconPosition","RIGHT","isSelected","open","Dropdown","itemList","dropDownValue","onItemSelect","item","height","displayName"],"mappings":"mmBAQA,MAAMA,EAAeC,EAAW,KAAO,CACrCC,KAAM,CACJC,SAAU,WAGVC,UAAW,cAEbC,kBAAmB,CACjBF,SAAU,WACVG,KAAM,EACNC,IAAK,GACLC,OAAQ,GAEVC,iBAAkB,CAChBC,QAAS,OACTC,WAAY,SACZC,eAAgB,aCVpB,MAAMC,EAAuC,EAC3CC,aACAC,2BAA0B,EAC1BC,mBAAmB,GACnBC,iBAAiB,GACjBC,gBAAe,EACfC,UACAC,iBAAiB,IACjBC,yBACAC,kBAEA,MAAMC,EAAUC,GAAO,IAChBC,EAAcC,GAAmBC,GAAS,IAC1CC,EAAgBC,GAAqBF,EAAST,GAC/CY,EAAQC,KAGZ7B,KAAM8B,EAAa,GACnBC,KAAMC,EACN7B,kBAAmB8B,EAA0B,GAC7CC,SAAUC,EACV5B,iBAAkB6B,EAAyB,IACzChB,GAAe,GAEbiB,EAAgBC,EACpB,KAAO,OACL/B,kBDRkCgC,ECQQb,EDPvC,CACLc,UAAWD,EAAS,iBAAmB,kBAFrC,IAAkCA,GCUpC,CAACb,IAkBGe,EARe,MACnB,IAAK,MAAMC,KAAc9B,EAAY,CACnC,MAAM+B,IAAEA,EAAGC,MAAEA,GAAUF,EACvB,GAAIC,IAAQ5B,EAAgB,OAAO6B,CACpC,CACD,MAAO,IAGSC,GACZC,EAAejC,GAA2Ba,GAAgC,KAAde,EAiBlE,OAVAM,EAAU,KACJ1B,EAAQ2B,QACVxB,EAAgBsB,IAEhBtB,EAAgBX,GAChBQ,EAAQ2B,SAAU,IAGnB,CAACnC,EAAyBa,EAAgBe,IAG3CQ,EAACC,EAAU,CAAA9B,YAAa,CAAEpB,KAAM,CAACF,EAAaE,QAAS8B,IACrDqB,SAAAC,EAACC,EAAoB,CAAAC,eAhCJ,KACnB3B,GAAkB,cAgCdsB,EAACM,EACC,CAAAC,YACAC,KACER,EAACC,EAAS,CACR9B,YAAa,CACXpB,KAAM,CAACF,EAAaS,iBAAkB8B,EAAc9B,oBAAqB6B,IAG3Ee,SAAAF,EAACS,EAAkBC,OAAAC,OAAA,CACjBC,MAAOtC,EAAeK,EAAMiC,MAAMC,WAAWC,MAAQnC,EAAMiC,MAAMC,WAAWE,gBACvE7C,GAA0B,CAAA,MAIrC8C,aAAcC,EAAaC,MAC3BvB,MAAOH,GAAa3B,EACpBsD,WAAY7C,EACZN,QArDgB,KACtBU,EAAmB0C,IAAUA,IAqDvBjD,YAAaY,IAEdN,GACCuB,EAACC,EAAS,CAAC9B,YAAa,CAAEpB,KAAM,CAACF,EAAaK,qBAAsB8B,IAClEkB,SAAAF,EAACqB,EACC,CAAAC,SAAU3D,EACV4D,cAAezD,EACf0D,aA3CeC,IACzBzD,SAAAA,EAAUyD,EAAK9B,OACfjB,EAAmB0C,IAAUA,IA0CnBM,OAAQzD,EACRE,YAAae,YAS3BxB,EAAaiE,YAAc"}

package/dist/ct-design-chip-dropdown.cjs.js

@@ -1,68 +1,82 @@
 'use strict';
 
-var tslib = require('tslib');
 var jsxRuntime = require('react/jsx-runtime');
 var react = require('react');
 var ctDesignContainer = require('@cleartrip/ct-design-container');
 var ctDesignChip = require('@cleartrip/ct-design-chip');
-var ctDesignTheme = require('@cleartrip/ct-design-theme');
 var ctDesignDropdown = require('@cleartrip/ct-design-dropdown');
 var ctDesignOutsideClickHandler = require('@cleartrip/ct-design-outside-click-handler');
-var styled = require('styled-components');
+var ctDesignStyleManager = require('@cleartrip/ct-design-style-manager');
+var ctDesignTheme = require('@cleartrip/ct-design-theme');
 var ctDesignIcons = require('@cleartrip/ct-design-icons');
+var ctDesignTypes = require('@cleartrip/ct-design-types');
 
-function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
-
-var styled__default = /*#__PURE__*/_interopDefault(styled);
-
-var getStyledChipArrowStyles = function (_a) {
-    var transform = _a.transform, rest = tslib.__rest(_a, ["transform"]);
-    return tslib.__assign({ display: 'flex', transform: transform }, rest);
-};
-var StyledChipArrow = styled__default.default.div(function (_a) {
-    var transform = _a.transform, _b = _a.css, css = _b === void 0 ? {} : _b;
-    return getStyledChipArrowStyles(tslib.__assign({ transform: transform }, css));
-});
+const staticStyles = ctDesignStyleManager.makeStyles(() => ({
+    root: {
+        position: 'relative',
+        alignSelf: 'flex-start',
+    },
+    dropdownContainer: {
+        position: 'absolute',
+        left: 0,
+        top: 40,
+        zIndex: 1,
+    },
+    chipArrowWrapper: {
+        display: 'flex',
+        alignItems: 'center',
+        justifyContent: 'center',
+    },
+}));
+function getChipArrowRotationWeb(isOpen) {
+    return {
+        transform: isOpen ? 'rotate(180deg)' : 'rotate(0deg)',
+    };
+}
 
-var ChipDropdown = function (_a) {
-    var optionList = _a.optionList, _b = _a.isDefaultOptionSelected, isDefaultOptionSelected = _b === void 0 ? true : _b, _c = _a.defaultChipLabel, defaultChipLabel = _c === void 0 ? '' : _c, _d = _a.selectedOption, selectedOption = _d === void 0 ? '' : _d, _e = _a.showDropdown, showDropdown = _e === void 0 ? false : _e, _f = _a.width, width = _f === void 0 ? '' : _f, onClick = _a.onClick, _g = _a.dropdownHeight, dropdownHeight = _g === void 0 ? '500px' : _g, _h = _a.styleConfig, styleConfig = _h === void 0 ? {} : _h;
-    var chipRef = react.useRef(false);
-    var _j = react.useState(true), isActiveChip = _j[0], setIsActiveChip = _j[1];
-    var _k = react.useState(showDropdown), isDropdownOpen = _k[0], setIsDropdownOpen = _k[1];
-    var theme = ctDesignTheme.useTheme();
-    var root = styleConfig.root, chip = styleConfig.chip, dropdownContainer = styleConfig.dropdownContainer, dropdown = styleConfig.dropdown, chipArrowDownIcon = styleConfig.chipArrowDownIcon, chipArrowWrapper = styleConfig.chipArrowWrapper;
-    var dropdownHandler = function () {
-        setIsDropdownOpen(!isDropdownOpen);
+const ChipDropdown = ({ optionList, isDefaultOptionSelected = true, defaultChipLabel = '', selectedOption = '', showDropdown = false, onClick, dropdownHeight = 500, chipArrowDownIconProps, styleConfig, }) => {
+    const chipRef = react.useRef(false);
+    const [isActiveChip, setIsActiveChip] = react.useState(true);
+    const [isDropdownOpen, setIsDropdownOpen] = react.useState(showDropdown);
+    const theme = ctDesignTheme.useTheme();
+    const { root: rootStyles = [], chip: chipStyleConfig, dropdownContainer: dropdownContainerStyles = [], dropdown: dropdownStyleConfig, chipArrowWrapper: chipArrowWrapperStyles = [], } = styleConfig || {};
+    const dynamicStyles = ctDesignStyleManager.useStyles(() => ({
+        chipArrowWrapper: getChipArrowRotationWeb(isDropdownOpen),
+    }), [isDropdownOpen]);
+    const dropdownHandler = () => {
+        setIsDropdownOpen((open) => !open);
     };
-    var closeHandler = function () {
+    const closeHandler = () => {
         setIsDropdownOpen(false);
     };
-    var chipLabel = function () {
-        for (var _i = 0, optionList_1 = optionList; _i < optionList_1.length; _i++) {
-            var optionItem = optionList_1[_i];
-            var key = optionItem.key, label = optionItem.label;
+    const getChipLabel = () => {
+        for (const optionItem of optionList) {
+            const { key, label } = optionItem;
             if (key === selectedOption)
                 return label;
         }
         return '';
     };
-    isDefaultOptionSelected || isDropdownOpen || chipLabel() !== '';
-    var onClickOfDropdown = function (key, isSelected) {
-        onClick === null || onClick === void 0 ? void 0 : onClick(key);
-        setIsDropdownOpen(!isDropdownOpen);
+    const chipLabel = getChipLabel();
+    const isChipActive = isDefaultOptionSelected || isDropdownOpen || chipLabel !== '';
+    const onClickOfDropdown = (item) => {
+        onClick === null || onClick === void 0 ? void 0 : onClick(item.label);
+        setIsDropdownOpen((open) => !open);
     };
-    react.useEffect(function () {
+    react.useEffect(() => {
         if (chipRef.current) {
-            var isChipActive_1 = isDefaultOptionSelected || isDropdownOpen || chipLabel() !== '';
-            setIsActiveChip(isChipActive_1);
+            setIsActiveChip(isChipActive);
         }
         else {
             setIsActiveChip(isDefaultOptionSelected);
             chipRef.current = true;
         }
-    }, [isDefaultOptionSelected, isDropdownOpen]);
-    return (jsxRuntime.jsx(ctDesignContainer.Container, tslib.__assign({ position: 'relative', width: 'fit-content', className: root === null || root === void 0 ? void 0 : root.className, css: root === null || root === void 0 ? void 0 : root.css }, { children: jsxRuntime.jsxs(ctDesignOutsideClickHandler.OutsideClickHandler, tslib.__assign({ onOutsideClick: closeHandler }, { children: [jsxRuntime.jsx(ctDesignChip.Chip, { showIcon: true, Icon: jsxRuntime.jsx(StyledChipArrow, tslib.__assign({ transform: isDropdownOpen ? 'rotate(180deg)' : 'rotate(0deg)' }, chipArrowWrapper, { children: jsxRuntime.jsx(ctDesignIcons.ChipArrowDownSmall, tslib.__assign({ color: isActiveChip ? theme.color.background.link2 : theme.color.background.defaultDarkest }, chipArrowDownIcon)) })), iconPosition: 'right', label: chipLabel() || defaultChipLabel, isSelected: isActiveChip, onClick: dropdownHandler, styleConfig: chip }), isDropdownOpen && (jsxRuntime.jsx(ctDesignContainer.Container, tslib.__assign({ position: 'absolute', left: '0', zIndex: 1, top: '40px', className: dropdownContainer === null || dropdownContainer === void 0 ? void 0 : dropdownContainer.className, css: dropdownContainer === null || dropdownContainer === void 0 ? void 0 : dropdownContainer.css }, { children: jsxRuntime.jsx(ctDesignDropdown.Dropdown, { optionList: optionList, width: width, selectedOption: selectedOption, onClick: onClickOfDropdown, icon: jsxRuntime.jsx(ctDesignIcons.Tick, {}), varient: ctDesignDropdown.DropdownVarient.ROUND, height: dropdownHeight, isChipSelection: true, styleConfig: dropdown }) })))] })) })));
+    }, [isDefaultOptionSelected, isDropdownOpen, chipLabel]);
+    return (jsxRuntime.jsx(ctDesignContainer.Container, { styleConfig: { root: [staticStyles.root, ...rootStyles] }, children: jsxRuntime.jsxs(ctDesignOutsideClickHandler.OutsideClickHandler, { onOutsideClick: closeHandler, children: [jsxRuntime.jsx(ctDesignChip.Chip, { showIcon: true, Icon: jsxRuntime.jsx(ctDesignContainer.Container, { styleConfig: {
+                            root: [staticStyles.chipArrowWrapper, dynamicStyles.chipArrowWrapper, ...chipArrowWrapperStyles],
+                        }, children: jsxRuntime.jsx(ctDesignIcons.ChipArrowDownSmall, Object.assign({ color: isActiveChip ? theme.color.background.link2 : theme.color.background.defaultDarkest }, (chipArrowDownIconProps || {}))) }), iconPosition: ctDesignTypes.IconPosition.RIGHT, label: chipLabel || defaultChipLabel, isSelected: isActiveChip, onClick: dropdownHandler, styleConfig: chipStyleConfig }), isDropdownOpen && (jsxRuntime.jsx(ctDesignContainer.Container, { styleConfig: { root: [staticStyles.dropdownContainer, ...dropdownContainerStyles] }, children: jsxRuntime.jsx(ctDesignDropdown.Dropdown, { itemList: optionList, dropDownValue: selectedOption, onItemSelect: onClickOfDropdown, height: dropdownHeight, styleConfig: dropdownStyleConfig }) }))] }) }));
 };
+ChipDropdown.displayName = 'ChipDropdown';
 
 exports.ChipDropdown = ChipDropdown;
 //# sourceMappingURL=ct-design-chip-dropdown.cjs.js.map

package/dist/ct-design-chip-dropdown.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"ct-design-chip-dropdown.cjs.js","sources":["../packages/components/ChipDropdown/src/StyledChipArrow/StyledChipArrow.tsx","../packages/components/ChipDropdown/src/ChipDropdown.tsx"],"sourcesContent":[null,null],"names":["__rest","__assign","styled","useRef","useState","useTheme","useEffect","_jsx","Container","_jsxs","OutsideClickHandler","Chip","ChipArrowDownSmall","Dropdown","Tick","DropdownVarient"],"mappings":"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"}
+{"version":3,"file":"ct-design-chip-dropdown.cjs.js","sources":["../packages/components/ChipDropdown/src/style.ts","../packages/components/ChipDropdown/src/ChipDropdown.tsx"],"sourcesContent":[null,null],"names":["makeStyles","useRef","useState","useTheme","useStyles","useEffect","_jsx","Container","_jsxs","OutsideClickHandler","Chip","ChipArrowDownSmall","IconPosition","Dropdown"],"mappings":"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"}

package/dist/ct-design-chip-dropdown.esm.js

@@ -1,62 +1,80 @@
-import { __assign, __rest } from 'tslib';
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { useRef, useState, useEffect } from 'react';
 import { Container } from '@cleartrip/ct-design-container';
 import { Chip } from '@cleartrip/ct-design-chip';
-import { useTheme } from '@cleartrip/ct-design-theme';
-import { Dropdown, DropdownVarient } from '@cleartrip/ct-design-dropdown';
+import { Dropdown } from '@cleartrip/ct-design-dropdown';
 import { OutsideClickHandler } from '@cleartrip/ct-design-outside-click-handler';
-import styled from 'styled-components';
-import { ChipArrowDownSmall, Tick } from '@cleartrip/ct-design-icons';
+import { makeStyles, useStyles } from '@cleartrip/ct-design-style-manager';
+import { useTheme } from '@cleartrip/ct-design-theme';
+import { ChipArrowDownSmall } from '@cleartrip/ct-design-icons';
+import { IconPosition } from '@cleartrip/ct-design-types';
 
-var getStyledChipArrowStyles = function (_a) {
-    var transform = _a.transform, rest = __rest(_a, ["transform"]);
-    return __assign({ display: 'flex', transform: transform }, rest);
-};
-var StyledChipArrow = styled.div(function (_a) {
-    var transform = _a.transform, _b = _a.css, css = _b === void 0 ? {} : _b;
-    return getStyledChipArrowStyles(__assign({ transform: transform }, css));
-});
+const staticStyles = makeStyles(() => ({
+    root: {
+        position: 'relative',
+        alignSelf: 'flex-start',
+    },
+    dropdownContainer: {
+        position: 'absolute',
+        left: 0,
+        top: 40,
+        zIndex: 1,
+    },
+    chipArrowWrapper: {
+        display: 'flex',
+        alignItems: 'center',
+        justifyContent: 'center',
+    },
+}));
+function getChipArrowRotationWeb(isOpen) {
+    return {
+        transform: isOpen ? 'rotate(180deg)' : 'rotate(0deg)',
+    };
+}
 
-var ChipDropdown = function (_a) {
-    var optionList = _a.optionList, _b = _a.isDefaultOptionSelected, isDefaultOptionSelected = _b === void 0 ? true : _b, _c = _a.defaultChipLabel, defaultChipLabel = _c === void 0 ? '' : _c, _d = _a.selectedOption, selectedOption = _d === void 0 ? '' : _d, _e = _a.showDropdown, showDropdown = _e === void 0 ? false : _e, _f = _a.width, width = _f === void 0 ? '' : _f, onClick = _a.onClick, _g = _a.dropdownHeight, dropdownHeight = _g === void 0 ? '500px' : _g, _h = _a.styleConfig, styleConfig = _h === void 0 ? {} : _h;
-    var chipRef = useRef(false);
-    var _j = useState(true), isActiveChip = _j[0], setIsActiveChip = _j[1];
-    var _k = useState(showDropdown), isDropdownOpen = _k[0], setIsDropdownOpen = _k[1];
-    var theme = useTheme();
-    var root = styleConfig.root, chip = styleConfig.chip, dropdownContainer = styleConfig.dropdownContainer, dropdown = styleConfig.dropdown, chipArrowDownIcon = styleConfig.chipArrowDownIcon, chipArrowWrapper = styleConfig.chipArrowWrapper;
-    var dropdownHandler = function () {
-        setIsDropdownOpen(!isDropdownOpen);
+const ChipDropdown = ({ optionList, isDefaultOptionSelected = true, defaultChipLabel = '', selectedOption = '', showDropdown = false, onClick, dropdownHeight = 500, chipArrowDownIconProps, styleConfig, }) => {
+    const chipRef = useRef(false);
+    const [isActiveChip, setIsActiveChip] = useState(true);
+    const [isDropdownOpen, setIsDropdownOpen] = useState(showDropdown);
+    const theme = useTheme();
+    const { root: rootStyles = [], chip: chipStyleConfig, dropdownContainer: dropdownContainerStyles = [], dropdown: dropdownStyleConfig, chipArrowWrapper: chipArrowWrapperStyles = [], } = styleConfig || {};
+    const dynamicStyles = useStyles(() => ({
+        chipArrowWrapper: getChipArrowRotationWeb(isDropdownOpen),
+    }), [isDropdownOpen]);
+    const dropdownHandler = () => {
+        setIsDropdownOpen((open) => !open);
     };
-    var closeHandler = function () {
+    const closeHandler = () => {
         setIsDropdownOpen(false);
     };
-    var chipLabel = function () {
-        for (var _i = 0, optionList_1 = optionList; _i < optionList_1.length; _i++) {
-            var optionItem = optionList_1[_i];
-            var key = optionItem.key, label = optionItem.label;
+    const getChipLabel = () => {
+        for (const optionItem of optionList) {
+            const { key, label } = optionItem;
             if (key === selectedOption)
                 return label;
         }
         return '';
     };
-    isDefaultOptionSelected || isDropdownOpen || chipLabel() !== '';
-    var onClickOfDropdown = function (key, isSelected) {
-        onClick === null || onClick === void 0 ? void 0 : onClick(key);
-        setIsDropdownOpen(!isDropdownOpen);
+    const chipLabel = getChipLabel();
+    const isChipActive = isDefaultOptionSelected || isDropdownOpen || chipLabel !== '';
+    const onClickOfDropdown = (item) => {
+        onClick === null || onClick === void 0 ? void 0 : onClick(item.label);
+        setIsDropdownOpen((open) => !open);
     };
-    useEffect(function () {
+    useEffect(() => {
         if (chipRef.current) {
-            var isChipActive_1 = isDefaultOptionSelected || isDropdownOpen || chipLabel() !== '';
-            setIsActiveChip(isChipActive_1);
+            setIsActiveChip(isChipActive);
         }
         else {
             setIsActiveChip(isDefaultOptionSelected);
             chipRef.current = true;
         }
-    }, [isDefaultOptionSelected, isDropdownOpen]);
-    return (jsx(Container, __assign({ position: 'relative', width: 'fit-content', className: root === null || root === void 0 ? void 0 : root.className, css: root === null || root === void 0 ? void 0 : root.css }, { children: jsxs(OutsideClickHandler, __assign({ onOutsideClick: closeHandler }, { children: [jsx(Chip, { showIcon: true, Icon: jsx(StyledChipArrow, __assign({ transform: isDropdownOpen ? 'rotate(180deg)' : 'rotate(0deg)' }, chipArrowWrapper, { children: jsx(ChipArrowDownSmall, __assign({ color: isActiveChip ? theme.color.background.link2 : theme.color.background.defaultDarkest }, chipArrowDownIcon)) })), iconPosition: 'right', label: chipLabel() || defaultChipLabel, isSelected: isActiveChip, onClick: dropdownHandler, styleConfig: chip }), isDropdownOpen && (jsx(Container, __assign({ position: 'absolute', left: '0', zIndex: 1, top: '40px', className: dropdownContainer === null || dropdownContainer === void 0 ? void 0 : dropdownContainer.className, css: dropdownContainer === null || dropdownContainer === void 0 ? void 0 : dropdownContainer.css }, { children: jsx(Dropdown, { optionList: optionList, width: width, selectedOption: selectedOption, onClick: onClickOfDropdown, icon: jsx(Tick, {}), varient: DropdownVarient.ROUND, height: dropdownHeight, isChipSelection: true, styleConfig: dropdown }) })))] })) })));
+    }, [isDefaultOptionSelected, isDropdownOpen, chipLabel]);
+    return (jsx(Container, { styleConfig: { root: [staticStyles.root, ...rootStyles] }, children: jsxs(OutsideClickHandler, { onOutsideClick: closeHandler, children: [jsx(Chip, { showIcon: true, Icon: jsx(Container, { styleConfig: {
+                            root: [staticStyles.chipArrowWrapper, dynamicStyles.chipArrowWrapper, ...chipArrowWrapperStyles],
+                        }, children: jsx(ChipArrowDownSmall, Object.assign({ color: isActiveChip ? theme.color.background.link2 : theme.color.background.defaultDarkest }, (chipArrowDownIconProps || {}))) }), iconPosition: IconPosition.RIGHT, label: chipLabel || defaultChipLabel, isSelected: isActiveChip, onClick: dropdownHandler, styleConfig: chipStyleConfig }), isDropdownOpen && (jsx(Container, { styleConfig: { root: [staticStyles.dropdownContainer, ...dropdownContainerStyles] }, children: jsx(Dropdown, { itemList: optionList, dropDownValue: selectedOption, onItemSelect: onClickOfDropdown, height: dropdownHeight, styleConfig: dropdownStyleConfig }) }))] }) }));
 };
+ChipDropdown.displayName = 'ChipDropdown';
 
 export { ChipDropdown };
 //# sourceMappingURL=ct-design-chip-dropdown.esm.js.map

package/dist/ct-design-chip-dropdown.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"ct-design-chip-dropdown.esm.js","sources":["../packages/components/ChipDropdown/src/StyledChipArrow/StyledChipArrow.tsx","../packages/components/ChipDropdown/src/ChipDropdown.tsx"],"sourcesContent":[null,null],"names":["_jsx","_jsxs"],"mappings":"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"}
+{"version":3,"file":"ct-design-chip-dropdown.esm.js","sources":["../packages/components/ChipDropdown/src/style.ts","../packages/components/ChipDropdown/src/ChipDropdown.tsx"],"sourcesContent":[null,null],"names":["_jsx","_jsxs"],"mappings":"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"}