@zonos/amino 5.1.105 → 5.1.106
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -18,6 +18,10 @@ export type ICountryMultiSelectExpandedOption<TCountryCode extends string = stri
|
|
|
18
18
|
export type CountryMultiSelectExpandedProps<TCountryCode extends string = string> = BaseProps & {
|
|
19
19
|
actions?: ReactNode;
|
|
20
20
|
countries: ICountryMultiSelectExpandedOption<TCountryCode>[];
|
|
21
|
+
/**
|
|
22
|
+
* @default 380
|
|
23
|
+
*/
|
|
24
|
+
maxHeight?: number;
|
|
21
25
|
/**
|
|
22
26
|
* Remove the top header part
|
|
23
27
|
* @default false
|
|
@@ -34,4 +38,4 @@ export type CountryMultiSelectExpandedProps<TCountryCode extends string = string
|
|
|
34
38
|
/**
|
|
35
39
|
* Use the country flags with `flagType: 'amino'` otherwise the flags are slow to load when re-rendering
|
|
36
40
|
*/
|
|
37
|
-
export declare const CountryMultiSelectExpanded: <TCountryCode extends string = string>({ actions, className, countries, noHeader, onChange, selectedCountries, style, withoutSearch, }: CountryMultiSelectExpandedProps<TCountryCode>) => import("react/jsx-runtime").JSX.Element;
|
|
41
|
+
export declare const CountryMultiSelectExpanded: <TCountryCode extends string = string>({ actions, className, countries, maxHeight, noHeader, onChange, selectedCountries, style, withoutSearch, }: CountryMultiSelectExpandedProps<TCountryCode>) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";var e=require("../../_tslib-bd4862e8.js"),n=require("react/jsx-runtime"),
|
|
1
|
+
"use strict";var e=require("../../_tslib-bd4862e8.js"),n=require("react/jsx-runtime"),t=require("react"),r=require("clsx"),o=require("lodash/groupBy"),l=require("../checkbox/Checkbox.js"),i=require("../collapse/Collapse.js"),a=require("../divider/Divider.js"),d=require("../text/Text.js"),u=require("../../icons/ChevronDownIcon.js"),c=require("../../icons/SearchIcon.js"),s=require("../../utils/getFuzzySearch.js"),p=require("../../style-inject.es-d4ddeae4.js");function m(e){return e&&e.__esModule?e:{default:e}}require("framer-motion"),require("../../icons/CheckmarkIcon.js"),require("../../icons/icon-base/_IconBase.js"),require("../../styles/constants/theme.js"),require("../../utils/getTestId.js"),require("@mui/material/Collapse"),require("fuse.js");var _=m(r),x=m(o),y="Amino_CountryMultiSelectExpanded-module__wrapper--LzApA",h="Amino_CountryMultiSelectExpanded-module__header--I3SHr",f="Amino_CountryMultiSelectExpanded-module__componentWrapper--F2CCN",C="Amino_CountryMultiSelectExpanded-module__componentHeaderWrapper--4Tbun",b="Amino_CountryMultiSelectExpanded-module__searchInput--AifLd",g="Amino_CountryMultiSelectExpanded-module__headerActions--KMJ-r",A="Amino_CountryMultiSelectExpanded-module__selectionWrapper--G9Zup",S="Amino_CountryMultiSelectExpanded-module__noCountriesWrapper--mxTCi",j="Amino_CountryMultiSelectExpanded-module__checkboxWrapper--WOHj-",M="Amino_CountryMultiSelectExpanded-module__hoverWrapper--T8yP-",v="Amino_CountryMultiSelectExpanded-module__groupWrapper--HI-rz",E="Amino_CountryMultiSelectExpanded-module__collapseButton--Ea8Gn",W="Amino_CountryMultiSelectExpanded-module__collapseIcon--maZm7",k="Amino_CountryMultiSelectExpanded-module__collapsed--uBLGX",N="Amino_CountryMultiSelectExpanded-module__countriesWrapper--r2bn4",q="Amino_CountryMultiSelectExpanded-module__checkboxCountry--yhWO-",I="Amino_CountryMultiSelectExpanded-module__checkboxLabelWrapper--H-c8z";p.styleInject(".Amino_CountryMultiSelectExpanded-module__wrapper--LzApA{display:flex;flex-direction:column;gap:12px}.Amino_CountryMultiSelectExpanded-module__header--I3SHr{display:flex;justify-content:space-between}.Amino_CountryMultiSelectExpanded-module__componentWrapper--F2CCN{border:var(--amino-border);border-radius:12px;display:flex;flex-direction:column;gap:4px;padding:8px}.Amino_CountryMultiSelectExpanded-module__componentHeaderWrapper--4Tbun{align-items:center;display:flex;gap:8px;justify-content:space-between}.Amino_CountryMultiSelectExpanded-module__searchInput--AifLd{align-items:center;display:flex;gap:8px;padding:8px 4px}.Amino_CountryMultiSelectExpanded-module__searchInput--AifLd>input{flex-grow:1;padding:0 4px}.Amino_CountryMultiSelectExpanded-module__searchInput--AifLd>input:focus{outline:none}.Amino_CountryMultiSelectExpanded-module__headerActions--KMJ-r{padding:4px 0}.Amino_CountryMultiSelectExpanded-module__selectionWrapper--G9Zup{display:flex;flex-direction:column;gap:2px;overflow-y:auto}.Amino_CountryMultiSelectExpanded-module__noCountriesWrapper--mxTCi{padding:8px}.Amino_CountryMultiSelectExpanded-module__checkboxWrapper--WOHj-{display:flex;flex-direction:column;padding:8px;width:100%}.Amino_CountryMultiSelectExpanded-module__hoverWrapper--T8yP-{border-radius:6px}.Amino_CountryMultiSelectExpanded-module__hoverWrapper--T8yP-:hover{background-color:var(--amino-hover-color)}.Amino_CountryMultiSelectExpanded-module__groupWrapper--HI-rz{align-items:center;display:flex;gap:8px;justify-content:space-between;padding:8px;width:100%}.Amino_CountryMultiSelectExpanded-module__collapseButton--Ea8Gn{align-items:center;cursor:pointer;display:flex;flex-grow:1;gap:8px;justify-content:flex-end}.Amino_CountryMultiSelectExpanded-module__collapseButton--Ea8Gn:focus{outline:none}.Amino_CountryMultiSelectExpanded-module__collapseIcon--maZm7{transition:var(--amino-transition)}.Amino_CountryMultiSelectExpanded-module__collapseIcon--maZm7.Amino_CountryMultiSelectExpanded-module__collapsed--uBLGX{transform:rotate(180deg)}.Amino_CountryMultiSelectExpanded-module__countriesWrapper--r2bn4{grid-gap:8px;display:grid;gap:8px;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));padding-left:24px}.Amino_CountryMultiSelectExpanded-module__checkboxCountry--yhWO->div{align-items:center}.Amino_CountryMultiSelectExpanded-module__checkboxCountry--yhWO- div[class*=Amino_Checkbox]{gap:var(--amino-space-8)}.Amino_CountryMultiSelectExpanded-module__checkboxLabelWrapper--H-c8z{align-items:center;display:flex;justify-content:space-between;width:100%}.Amino_CountryMultiSelectExpanded-module__checkboxLabelWrapper--H-c8z>div{align-items:center;display:flex;gap:4px}");exports.CountryMultiSelectExpanded=function(r){var o=r.actions,p=r.className,m=r.countries,w=r.maxHeight,z=void 0===w?380:w,H=r.noHeader,T=void 0!==H&&H,L=r.onChange,B=r.selectedCountries,G=r.style,O=r.withoutSearch,D=void 0!==O&&O,F=e.__read(t.useState(""),2),Z=F[0],P=F[1],J=e.__read(t.useState([]),2),K=J[0],X=J[1],R=t.useCallback((function(e){return s.getFuzzySearch({array:m,options:{keys:["label","code","group"],threshold:.1}}).fuzzySearch.search(e)}),[m]),Q=t.useMemo((function(){return""===Z?m:R(Z).map((function(e){return e.item}))}),[m,R,Z]),U=t.useMemo((function(){var n=Object.entries(x.default(Q,"group")).map((function(n){var t=e.__read(n,2),r=t[0];return{countries:t[1],label:r}}));return n.sort((function(e,n){return e.label.localeCompare(n.label)}))}),[Q]),V=t.useMemo((function(){return m.filter((function(e){return!e.disabled})).length===B.length}),[m,B.length]);if(!m.length)return n.jsx("div",{className:_.default(p),children:n.jsx(d.Text,{color:"textColorSecondary",children:"No countries"})});return n.jsxs("div",{className:_.default(y,p),style:G,children:[!T&&n.jsxs("div",{className:h,children:[n.jsx(d.Text,{type:"bold-label",children:"Countries and Regions"}),n.jsxs(d.Text,{color:"textColorSecondary",type:"label",children:[B.length," of ",m.length," selected"]})]}),n.jsxs("div",{className:f,children:[n.jsxs("div",{className:C,children:[!D&&n.jsxs("label",{className:b,htmlFor:"country-multi-select-search",children:[n.jsx(c.SearchIcon,{size:24}),n.jsx("input",{autoComplete:"off",id:"country-multi-select-search",onChange:function(e){return P(e.target.value)},placeholder:"Search...",type:"text",value:Z})]}),o&&n.jsx("div",{className:g,children:o})]}),(!!o||!D)&&n.jsx(a.Divider,{noMargin:!0}),Q.length?n.jsxs("div",{className:A,style:{maxHeight:"".concat(z,"px")},children:[n.jsx("div",{className:j,children:n.jsx(l.Checkbox,{checked:V,label:"Select all",onChange:function(e){L(e?m.filter((function(e){return!e.disabled})):[])}})}),U.map((function(t){var r=t.countries.every((function(e){return e.disabled||B.some((function(n){return n.code===e.code}))})),o=t.countries.filter((function(e){return B.some((function(n){return n.code===e.code}))})).length,a=!K.includes(t.label);return n.jsxs("div",{children:[n.jsxs("div",{className:_.default(v,M),children:[n.jsx(l.Checkbox,{checked:r,label:t.label,onChange:function(n){if(n){var r=e.__spreadArray(e.__spreadArray([],e.__read(B),!1),e.__read(t.countries.filter((function(e){return!e.disabled}))),!1);L(r)}else r=B.filter((function(e){return!e.disabled&&!t.countries.some((function(n){return n.code===e.code}))})),L(r)}}),n.jsxs("button",{className:E,onClick:function(){K.includes(t.label)?X(K.filter((function(e){return e!==t.label}))):X(e.__spreadArray(e.__spreadArray([],e.__read(K),!1),[t.label],!1))},type:"button",children:[n.jsxs(d.Text,{color:"textColorSecondary",children:[o,"/",t.countries.length]}),n.jsx(u.ChevronDownIcon,{className:_.default(W,a&&k),size:24})]})]}),n.jsx(i.Collapse,{collapsed:a,children:n.jsx("div",{className:N,children:t.countries.map((function(t){var r;return n.jsx(l.Checkbox,{checked:B.some((function(e){return e.code===t.code})),className:_.default(j,q,!t.disabled&&M),disabled:t.disabled,icon:t.icon,label:t.label,labelComponent:n.jsxs("div",{className:I,style:{opacity:t.disabled?.5:1},children:[n.jsxs("div",{children:[t.icon,t.label]}),null===(r=t.rightDecorator)||void 0===r?void 0:r.call(t)]}),onChange:function(n){L(n?e.__spreadArray(e.__spreadArray([],e.__read(B),!1),[t],!1):B.filter((function(e){return e.code!==t.code})))}},t.code)}))})})]},t.label)}))]}):n.jsx("div",{className:S,children:n.jsx(d.Text,{color:"textColorSecondary",children:"No countries"})})]})]})};
|