@sats-group/ui-lib 81.0.1 → 81.1.0
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.
- package/package.json +1 -1
- package/react/banner/banner.js +1 -1
- package/react/banner/banner.js.map +2 -2
- package/react/checkbox/checkbox.js +1 -1
- package/react/checkbox/checkbox.js.map +2 -2
- package/react/chip-selected/chip-selected.js +1 -1
- package/react/chip-selected/chip-selected.js.map +2 -2
- package/react/collapse/collapse.js +1 -1
- package/react/collapse/collapse.js.map +2 -2
- package/react/confirmation/confirmation.js +1 -1
- package/react/confirmation/confirmation.js.map +2 -2
- package/react/context-menu/context-menu.js +1 -1
- package/react/context-menu/context-menu.js.map +2 -2
- package/react/dropdown-list/dropdown-list.js +1 -1
- package/react/dropdown-list/dropdown-list.js.map +2 -2
- package/react/expander/expander.js +1 -1
- package/react/expander/expander.js.map +2 -2
- package/react/filter/filter.js +1 -1
- package/react/filter/filter.js.map +2 -2
- package/react/form-content/checkbox-category.js +1 -1
- package/react/form-content/checkbox-category.js.map +2 -2
- package/react/form-content/form-content.checkbox-list.js +1 -1
- package/react/form-content/form-content.checkbox-list.js.map +2 -2
- package/react/form-content/form-content.radio-list.js +1 -1
- package/react/form-content/form-content.radio-list.js.map +2 -2
- package/react/form-content/form-content.search.js +1 -1
- package/react/form-content/form-content.search.js.map +2 -2
- package/react/message-field/message-field.js +1 -1
- package/react/message-field/message-field.js.map +2 -2
- package/react/modal/modal.js +1 -1
- package/react/modal/modal.js.map +2 -2
- package/react/modal/tab-trapper.js +1 -1
- package/react/modal/tab-trapper.js.map +2 -2
- package/react/radio/radio.js +1 -1
- package/react/radio/radio.js.map +2 -2
- package/react/search/search.js +1 -1
- package/react/search/search.js.map +2 -2
- package/react/select/select.js +1 -1
- package/react/select/select.js.map +2 -2
- package/react/text-area/text-area.js +1 -1
- package/react/text-area/text-area.js.map +2 -2
- package/react/text-input/text-input.js +1 -1
- package/react/text-input/text-input.js.map +2 -2
- package/react/toggle/toggle.js +1 -1
- package/react/toggle/toggle.js.map +2 -2
package/package.json
CHANGED
package/react/banner/banner.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import d from"classnames";import n,{useState as y}from"react";import r from"../text";import N from"../visually-hidden";import v from"../icons/18/error";import t from"../icons/18/info";import h from"../icons/18/confirm";import x from"../icons/18/warning-sign";import g from"../icons/18/close";const
|
|
1
|
+
"use client";import d from"classnames";import n,{useState as y}from"react";import r from"../text";import N from"../visually-hidden";import v from"../icons/18/error";import t from"../icons/18/info";import h from"../icons/18/confirm";import x from"../icons/18/warning-sign";import g from"../icons/18/close";const c={error:n.createElement(v,null),information:n.createElement(t,null),neutral:n.createElement(t,null),success:n.createElement(h,null),warning:n.createElement(x,null)},C=({dismiss:e,icon:s,link:l,list:o,nested:u,text:b,title:i,type:a})=>{const[p,f]=y(!1);if(p)return null;const _=()=>f(!0);return n.createElement("div",{className:d("banner",{"banner--layout-dismissable":!s&&e,"banner--layout-icon":s&&!e,"banner--layout-single":!s&&!e,"banner--layout-triple":s&&e,"banner--nested":u,[`banner--type-${a}`]:a})},s?n.createElement("div",{className:"banner__icon"},c[a]):null,n.createElement("div",{className:"banner__primary"},i?n.createElement("div",{className:"banner__title"},n.createElement(r,{theme:r.themes.emphasis,tight:!0},i)):null,n.createElement(r,{className:"banner__text",size:r.sizes.small},b),o.length?n.createElement(r,{elementName:"ol",className:"banner__list",size:r.sizes.small},o.map(m=>n.createElement("li",{key:m},m))):null,l?n.createElement(r,{className:"banner__link"},n.createElement("a",{className:"banner__anchor",href:l.href},l.text)):null),e?n.createElement("div",{className:"banner__secondary"},n.createElement("button",{className:"banner__dismisser",onClick:_},n.createElement(N,null,e),n.createElement(g,null))):null)};var V=C;export{V as default};
|
|
2
2
|
//# sourceMappingURL=banner.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../react/banner/banner.tsx"],
|
|
4
|
-
"sourcesContent": ["
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["'use client';\n\nimport cn from 'classnames';\nimport React, { useState } from 'react';\n\nimport Text from '../text';\nimport VisuallyHidden from '../visually-hidden';\nimport Error from '../icons/18/error';\nimport Info from '../icons/18/info';\nimport Confirm from '../icons/18/confirm';\nimport WarningSign from '../icons/18/warning-sign';\nimport Close from '../icons/18/close';\n\nimport type { Banner as Props } from './banner.types';\n\nconst typeIcon = {\n error: <Error />,\n information: <Info />,\n neutral: <Info />,\n success: <Confirm />,\n warning: <WarningSign />,\n};\n\nconst Banner: React.FunctionComponent<Props> = ({\n dismiss,\n icon,\n link,\n list,\n nested,\n text,\n title,\n type,\n}) => {\n const [isDismissed, setDismissed] = useState(false);\n if (isDismissed) {\n return null;\n }\n\n const handleClick = () => setDismissed(true);\n\n return (\n <div\n className={cn('banner', {\n 'banner--layout-dismissable': !icon && dismiss,\n 'banner--layout-icon': icon && !dismiss,\n 'banner--layout-single': !icon && !dismiss,\n 'banner--layout-triple': icon && dismiss,\n 'banner--nested': nested,\n [`banner--type-${type}`]: type,\n })}\n >\n {icon ? <div className=\"banner__icon\">{typeIcon[type]}</div> : null}\n <div className=\"banner__primary\">\n {title ? (\n <div className=\"banner__title\">\n <Text theme={Text.themes.emphasis} tight>\n {title}\n </Text>\n </div>\n ) : null}\n <Text className=\"banner__text\" size={Text.sizes.small}>\n {text}\n </Text>\n {list.length ? (\n <Text\n elementName=\"ol\"\n className=\"banner__list\"\n size={Text.sizes.small}\n >\n {list.map(item => (\n <li key={item}>{item}</li>\n ))}\n </Text>\n ) : null}\n {link ? (\n <Text className=\"banner__link\">\n <a className=\"banner__anchor\" href={link.href}>\n {link.text}\n </a>\n </Text>\n ) : null}\n </div>\n {dismiss ? (\n <div className=\"banner__secondary\">\n <button className=\"banner__dismisser\" onClick={handleClick}>\n <VisuallyHidden>{dismiss}</VisuallyHidden>\n <Close />\n </button>\n </div>\n ) : null}\n </div>\n );\n};\n\nexport default Banner;\n"],
|
|
5
|
+
"mappings": "aAEA,OAAOA,MAAQ,aACf,OAAOC,GAAS,YAAAC,MAAgB,QAEhC,OAAOC,MAAU,UACjB,OAAOC,MAAoB,qBAC3B,OAAOC,MAAW,oBAClB,OAAOC,MAAU,mBACjB,OAAOC,MAAa,sBACpB,OAAOC,MAAiB,2BACxB,OAAOC,MAAW,oBAIlB,MAAMC,EAAW,CACf,MAAOT,EAAA,cAACI,EAAA,IAAM,EACd,YAAaJ,EAAA,cAACK,EAAA,IAAK,EACnB,QAASL,EAAA,cAACK,EAAA,IAAK,EACf,QAASL,EAAA,cAACM,EAAA,IAAQ,EAClB,QAASN,EAAA,cAACO,EAAA,IAAY,CACxB,EAEMG,EAAyC,CAAC,CAC9C,QAAAC,EACA,KAAAC,EACA,KAAAC,EACA,KAAAC,EACA,OAAAC,EACA,KAAAC,EACA,MAAAC,EACA,KAAAC,CACF,IAAM,CACJ,KAAM,CAACC,EAAaC,CAAY,EAAInB,EAAS,EAAK,EAClD,GAAIkB,EACF,OAAO,KAGT,MAAME,EAAc,IAAMD,EAAa,EAAI,EAE3C,OACEpB,EAAA,cAAC,OACC,UAAWD,EAAG,SAAU,CACtB,6BAA8B,CAACa,GAAQD,EACvC,sBAAuBC,GAAQ,CAACD,EAChC,wBAAyB,CAACC,GAAQ,CAACD,EACnC,wBAAyBC,GAAQD,EACjC,iBAAkBI,EAClB,CAAC,gBAAgBG,CAAI,EAAE,EAAGA,CAC5B,CAAC,GAEAN,EAAOZ,EAAA,cAAC,OAAI,UAAU,gBAAgBS,EAASS,CAAI,CAAE,EAAS,KAC/DlB,EAAA,cAAC,OAAI,UAAU,mBACZiB,EACCjB,EAAA,cAAC,OAAI,UAAU,iBACbA,EAAA,cAACE,EAAA,CAAK,MAAOA,EAAK,OAAO,SAAU,MAAK,IACrCe,CACH,CACF,EACE,KACJjB,EAAA,cAACE,EAAA,CAAK,UAAU,eAAe,KAAMA,EAAK,MAAM,OAC7Cc,CACH,EACCF,EAAK,OACJd,EAAA,cAACE,EAAA,CACC,YAAY,KACZ,UAAU,eACV,KAAMA,EAAK,MAAM,OAEhBY,EAAK,IAAIQ,GACRtB,EAAA,cAAC,MAAG,IAAKsB,GAAOA,CAAK,CACtB,CACH,EACE,KACHT,EACCb,EAAA,cAACE,EAAA,CAAK,UAAU,gBACdF,EAAA,cAAC,KAAE,UAAU,iBAAiB,KAAMa,EAAK,MACtCA,EAAK,IACR,CACF,EACE,IACN,EACCF,EACCX,EAAA,cAAC,OAAI,UAAU,qBACbA,EAAA,cAAC,UAAO,UAAU,oBAAoB,QAASqB,GAC7CrB,EAAA,cAACG,EAAA,KAAgBQ,CAAQ,EACzBX,EAAA,cAACQ,EAAA,IAAM,CACT,CACF,EACE,IACN,CAEJ,EAEA,IAAOe,EAAQb",
|
|
6
6
|
"names": ["cn", "React", "useState", "Text", "VisuallyHidden", "Error", "Info", "Confirm", "WarningSign", "Close", "typeIcon", "Banner", "dismiss", "icon", "link", "list", "nested", "text", "title", "type", "isDismissed", "setDismissed", "handleClick", "item", "banner_default"]
|
|
7
7
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
var T=Object.defineProperty;var b=Object.getOwnPropertySymbols;var
|
|
1
|
+
"use client";var T=Object.defineProperty;var b=Object.getOwnPropertySymbols;var p=Object.prototype.hasOwnProperty,f=Object.prototype.propertyIsEnumerable;var t=(c,o,i)=>o in c?T(c,o,{enumerable:!0,configurable:!0,writable:!0,value:i}):c[o]=i,u=(c,o)=>{for(var i in o||(o={}))p.call(o,i)&&t(c,i,o[i]);if(b)for(var i of b(o))f.call(o,i)&&t(c,i,o[i]);return c};var g=(c,o)=>{var i={};for(var l in c)p.call(c,l)&&o.indexOf(l)<0&&(i[l]=c[l]);if(c!=null&&b)for(var l of b(c))o.indexOf(l)<0&&f.call(c,l)&&(i[l]=c[l]);return i};import s from"classnames";import*as e from"react";import B from"../use-input-validation";import h from"../text";import{themes as M}from"./checkbox.types";const N=e.forwardRef((j,L)=>{var m=j,{children:c,disabled:o,description:i,extra:l,intermediate:k,isLabelVisible:d=!0,label:r,name:w,showCustomError:C=!0,theme:n,value:y="",isUnderlined:I,required:v}=m,a=g(m,["children","disabled","description","extra","intermediate","isLabelVisible","label","name","showCustomError","theme","value","isUnderlined","required"]);const[$,z,x]=B();return e.createElement("div",{className:s("checkbox",{"checkbox--error":x,"checkbox--intermediate":k,[`checkbox--${n}`]:n})},e.createElement("label",{className:s("checkbox__content",{"checkbox--underline":I})},e.createElement("div",{className:"checkbox__main"},e.createElement("div",{className:"checkbox__main-top"},e.createElement("div",null,e.createElement("input",u({"aria-label":d?void 0:r,className:"checkbox__input",type:"checkbox",name:w,onChange:_=>{a.onChange&&a.onChange(_),$(_)},onInvalid:_=>{a.onInvalid&&a.onInvalid(_),z(_)},ref:L,value:y,disabled:o,required:v},a)),e.createElement("div",{className:s("checkbox__icon",{"checkbox__icon--intermediate":k,[`checkbox__icon--${n}`]:n})},e.createElement("svg",{className:"checkbox__intermediate",width:"10",height:"10",viewBox:"0 0 10 10",fill:"none",xmlns:"http://www.w3.org/2000/svg"},e.createElement("line",{x1:"0",y1:"5",x2:"10",y2:"5",stroke:"currentColor",strokeWidth:"2"})),e.createElement("svg",{className:"checkbox__check",width:"12",height:"10",viewBox:"0 0 12 10",fill:"none",xmlns:"http://www.w3.org/2000/svg"},e.createElement("path",{d:"M4.76123 9.0605L0.700729 5L1.76123 3.9395L4.76123 6.9395L10.7612 0.939501L11.8217 2L4.76123 9.0605Z",fill:"currentColor"})))),d?e.createElement(e.Fragment,null,r?e.createElement(h,{className:s("checkbox__label",{[`checkbox__label--${n}`]:n,"checkbox__label--disabled":o}),size:h.sizes.basic},r):e.createElement("div",{className:s("checkbox__label",{[`checkbox__label--${n}`]:n,"checkbox__label--disabled":o})},c)):null,v?e.createElement("span",{className:"checkbox__asterisk"},"*"):null),i&&e.createElement(h,{className:s("checkbox__description",{[`checkbox__label--${n}`]:n,"checkbox__label--disabled":o}),size:h.sizes.small},i))),x&&C&&e.createElement("div",{"aria-hidden":"true",className:s("checkbox__error",{[`checkbox__error--${n}`]:n})},x),l&&e.createElement("span",{className:"checkbox__extra"},l))});N.displayName="Checkbox";const W=Object.assign(N,{themes:M});var D=W;export{D as default};
|
|
2
2
|
//# sourceMappingURL=checkbox.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../react/checkbox/checkbox.tsx"],
|
|
4
|
-
"sourcesContent": ["
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["'use client';\n\nimport cn from 'classnames';\nimport * as React from 'react';\n\nimport useInputValidation from '../use-input-validation';\nimport Text from '../text';\n\nimport { Checkbox as Props, themes } from './checkbox.types';\n\nconst RefCheckbox = React.forwardRef<\n HTMLInputElement,\n React.PropsWithChildren<Props>\n>(\n (\n {\n children,\n disabled,\n description,\n extra,\n intermediate,\n isLabelVisible = true,\n label,\n name,\n showCustomError = true,\n theme,\n value = '',\n isUnderlined,\n required,\n ...restProps\n },\n ref,\n ) => {\n const [onChange, onInvalid, error] = useInputValidation();\n\n return (\n <div\n className={cn('checkbox', {\n 'checkbox--error': error,\n 'checkbox--intermediate': intermediate,\n [`checkbox--${theme}`]: theme,\n })}\n >\n <label\n className={cn('checkbox__content', {\n 'checkbox--underline': isUnderlined,\n })}\n >\n <div className=\"checkbox__main\">\n <div className=\"checkbox__main-top\">\n <div>\n <input\n aria-label={isLabelVisible ? undefined : label}\n className=\"checkbox__input\"\n type=\"checkbox\"\n name={name}\n onChange={e => {\n // NOTE: If props specify an `onChange`, we need to call that too\n if (restProps.onChange) restProps.onChange(e);\n onChange(e);\n }}\n onInvalid={e => {\n // NOTE: If props specify an `onInvalid`, we need to call that too\n if (restProps.onInvalid) restProps.onInvalid(e);\n onInvalid(e);\n }}\n ref={ref}\n value={value}\n disabled={disabled}\n required={required}\n {...restProps}\n />\n\n <div\n className={cn('checkbox__icon', {\n 'checkbox__icon--intermediate': intermediate,\n [`checkbox__icon--${theme}`]: theme,\n })}\n >\n <svg\n className=\"checkbox__intermediate\"\n width=\"10\"\n height=\"10\"\n viewBox=\"0 0 10 10\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <line\n x1=\"0\"\n y1=\"5\"\n x2=\"10\"\n y2=\"5\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n />\n </svg>\n <svg\n className=\"checkbox__check\"\n width=\"12\"\n height=\"10\"\n viewBox=\"0 0 12 10\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M4.76123 9.0605L0.700729 5L1.76123 3.9395L4.76123 6.9395L10.7612 0.939501L11.8217 2L4.76123 9.0605Z\"\n fill=\"currentColor\"\n />\n </svg>\n </div>\n </div>\n {isLabelVisible ? (\n <>\n {label ? (\n <Text\n className={cn('checkbox__label', {\n [`checkbox__label--${theme}`]: theme,\n 'checkbox__label--disabled': disabled,\n })}\n size={Text.sizes.basic}\n >\n {label}\n </Text>\n ) : (\n <div\n className={cn('checkbox__label', {\n [`checkbox__label--${theme}`]: theme,\n 'checkbox__label--disabled': disabled,\n })}\n >\n {children}\n </div>\n )}\n </>\n ) : null}\n {required ? <span className=\"checkbox__asterisk\">*</span> : null}\n </div>\n {description && (\n <Text\n className={cn('checkbox__description', {\n [`checkbox__label--${theme}`]: theme,\n 'checkbox__label--disabled': disabled,\n })}\n size={Text.sizes.small}\n >\n {description}\n </Text>\n )}\n </div>\n </label>\n\n {/* NOTE: This is aria-hidden because reporting of validation errors is handled by the browser */}\n {error && showCustomError && (\n <div\n aria-hidden=\"true\"\n className={cn('checkbox__error', {\n [`checkbox__error--${theme}`]: theme,\n })}\n >\n {error}\n </div>\n )}\n\n {extra && <span className=\"checkbox__extra\">{extra}</span>}\n </div>\n );\n },\n);\n\n// NOTE: If this isn't set, stack traces say \"forwardRef\" instead of \"Checkbox\"\nRefCheckbox.displayName = 'Checkbox';\n\n// NOTE: The component is redeclared here because TypeScript doesn't accept assigning extra properties to `RefComponent` when it's declared\nconst Checkbox: typeof RefCheckbox & {\n themes: typeof themes;\n} = Object.assign(RefCheckbox, { themes });\n\nexport default Checkbox;\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["cn", "React", "useInputValidation", "Text", "themes", "RefCheckbox", "_a", "ref", "_b", "children", "disabled", "description", "extra", "intermediate", "isLabelVisible", "label", "name", "showCustomError", "theme", "value", "isUnderlined", "required", "restProps", "__objRest", "onChange", "onInvalid", "error", "__spreadValues", "e", "Checkbox", "checkbox_default"]
|
|
7
7
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
var C=Object.defineProperty,N=Object.defineProperties;var S=Object.getOwnPropertyDescriptors;var c=Object.getOwnPropertySymbols;var z=Object.prototype.hasOwnProperty,g=Object.prototype.propertyIsEnumerable;var u=(l,s,t)=>s in l?C(l,s,{enumerable:!0,configurable:!0,writable:!0,value:t}):l[s]=t,p=(l,s)=>{for(var t in s||(s={}))z.call(s,t)&&u(l,t,s[t]);if(c)for(var t of c(s))g.call(s,t)&&u(l,t,s[t]);return l},f=(l,s)=>N(l,S(s));import*as e from"react";import b from"../icons/24/arrow-down";import T from"../icons/24/arrow-up";import E from"../chip/chip";import o from"../text";import H from"../link";import k from"../collapse";import w from"../hooks/use-event";const O=({resetSelected:l,description:s,hideSelected:t,maxChipsToShow:h=41,showSelected:_,chips:r})=>{const[d,v]=e.useState(!1),[m,a]=e.useState(0),i=e.useRef(null);w("resize",()=>{i&&i.current&&a(i.current.clientHeight)}),e.useEffect(()=>{i&&i.current&&a(i.current.clientHeight)},[i]);const x=()=>{v(n=>!n)};return r?e.createElement("div",{className:"chip-selected__selected-options-wrapper"},e.createElement("div",{className:"chip-selected__clear-all-button"},e.createElement(o,null,s),e.createElement(H,p({},l))),e.createElement("div",null,e.createElement(k,{className:"chip-selected__collapse",isOpen:d},e.createElement("div",{className:"chip-selected__selected-options",ref:i},r.map(n=>e.createElement(E,f(p({},n),{key:n.text}))))),m&&m>h?e.createElement("button",{type:"button",className:"chip-selected__expand",onClick:x},d?e.createElement(e.Fragment,null,e.createElement(o,{elementName:"span",size:o.sizes.small,className:"chip-selected__expand-text"},t),e.createElement(T,null)):e.createElement(e.Fragment,null,e.createElement(o,{elementName:"span",size:o.sizes.small,className:"chip-selected__expand-text"},_),e.createElement(b,null))):null)):null};var B=O;export{B as default};
|
|
1
|
+
"use client";var C=Object.defineProperty,N=Object.defineProperties;var S=Object.getOwnPropertyDescriptors;var c=Object.getOwnPropertySymbols;var z=Object.prototype.hasOwnProperty,g=Object.prototype.propertyIsEnumerable;var u=(l,s,t)=>s in l?C(l,s,{enumerable:!0,configurable:!0,writable:!0,value:t}):l[s]=t,p=(l,s)=>{for(var t in s||(s={}))z.call(s,t)&&u(l,t,s[t]);if(c)for(var t of c(s))g.call(s,t)&&u(l,t,s[t]);return l},f=(l,s)=>N(l,S(s));import*as e from"react";import b from"../icons/24/arrow-down";import T from"../icons/24/arrow-up";import E from"../chip/chip";import o from"../text";import H from"../link";import k from"../collapse";import w from"../hooks/use-event";const O=({resetSelected:l,description:s,hideSelected:t,maxChipsToShow:h=41,showSelected:_,chips:r})=>{const[d,v]=e.useState(!1),[m,a]=e.useState(0),i=e.useRef(null);w("resize",()=>{i&&i.current&&a(i.current.clientHeight)}),e.useEffect(()=>{i&&i.current&&a(i.current.clientHeight)},[i]);const x=()=>{v(n=>!n)};return r?e.createElement("div",{className:"chip-selected__selected-options-wrapper"},e.createElement("div",{className:"chip-selected__clear-all-button"},e.createElement(o,null,s),e.createElement(H,p({},l))),e.createElement("div",null,e.createElement(k,{className:"chip-selected__collapse",isOpen:d},e.createElement("div",{className:"chip-selected__selected-options",ref:i},r.map(n=>e.createElement(E,f(p({},n),{key:n.text}))))),m&&m>h?e.createElement("button",{type:"button",className:"chip-selected__expand",onClick:x},d?e.createElement(e.Fragment,null,e.createElement(o,{elementName:"span",size:o.sizes.small,className:"chip-selected__expand-text"},t),e.createElement(T,null)):e.createElement(e.Fragment,null,e.createElement(o,{elementName:"span",size:o.sizes.small,className:"chip-selected__expand-text"},_),e.createElement(b,null))):null)):null};var B=O;export{B as default};
|
|
2
2
|
//# sourceMappingURL=chip-selected.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../react/chip-selected/chip-selected.tsx"],
|
|
4
|
-
"sourcesContent": ["
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["'use client';\n\nimport * as React from 'react';\n\nimport ChevronDown from '../icons/24/arrow-down';\nimport ChevronUp from '../icons/24/arrow-up';\nimport Chip from '../chip/chip';\nimport Text from '../text';\nimport Link from '../link';\nimport Collapse from '../collapse';\n\nimport useEvent from '../hooks/use-event';\n\nimport { ChipSelected as Props } from './chip-selected.types';\n\nconst ChipSelected: React.FC<Props> = ({\n resetSelected,\n description,\n hideSelected,\n maxChipsToShow = 41,\n showSelected,\n chips,\n}) => {\n const [expandedSelectedValues, setExpandedSelectedValues] =\n React.useState(false);\n\n const [heightOfCollapse, setHeightOfCollapse] = React.useState<\n number | undefined\n >(0);\n const divRef = React.useRef<HTMLDivElement>(null);\n\n const updateSize = () => {\n if (divRef && divRef.current) {\n setHeightOfCollapse(divRef.current.clientHeight);\n }\n };\n\n useEvent('resize', updateSize);\n\n React.useEffect(() => {\n if (divRef && divRef.current) {\n setHeightOfCollapse(divRef.current.clientHeight);\n }\n }, [divRef]);\n\n const toggleShowMore = () => {\n setExpandedSelectedValues(prevState => !prevState);\n };\n\n return chips ? (\n <div className=\"chip-selected__selected-options-wrapper\">\n <div className=\"chip-selected__clear-all-button\">\n <Text>{description}</Text>\n <Link {...resetSelected} />\n </div>\n <div>\n <Collapse\n className=\"chip-selected__collapse\"\n isOpen={expandedSelectedValues}\n >\n <div className=\"chip-selected__selected-options\" ref={divRef}>\n {chips.map(chip => (\n <Chip {...chip} key={chip.text} />\n ))}\n </div>\n </Collapse>\n\n {heightOfCollapse && heightOfCollapse > maxChipsToShow ? (\n <button\n type=\"button\"\n className=\"chip-selected__expand\"\n onClick={toggleShowMore}\n >\n {expandedSelectedValues ? (\n <>\n <Text\n elementName=\"span\"\n size={Text.sizes.small}\n className=\"chip-selected__expand-text\"\n >\n {hideSelected}\n </Text>\n <ChevronUp />\n </>\n ) : (\n <>\n <Text\n elementName=\"span\"\n size={Text.sizes.small}\n className=\"chip-selected__expand-text\"\n >\n {showSelected}\n </Text>\n <ChevronDown />\n </>\n )}\n </button>\n ) : null}\n </div>\n </div>\n ) : null;\n};\n\nexport default ChipSelected;\n"],
|
|
5
|
+
"mappings": "0bAEA,UAAYA,MAAW,QAEvB,OAAOC,MAAiB,yBACxB,OAAOC,MAAe,uBACtB,OAAOC,MAAU,eACjB,OAAOC,MAAU,UACjB,OAAOC,MAAU,UACjB,OAAOC,MAAc,cAErB,OAAOC,MAAc,qBAIrB,MAAMC,EAAgC,CAAC,CACrC,cAAAC,EACA,YAAAC,EACA,aAAAC,EACA,eAAAC,EAAiB,GACjB,aAAAC,EACA,MAAAC,CACF,IAAM,CACJ,KAAM,CAACC,EAAwBC,CAAyB,EACtDhB,EAAM,SAAS,EAAK,EAEhB,CAACiB,EAAkBC,CAAmB,EAAIlB,EAAM,SAEpD,CAAC,EACGmB,EAASnB,EAAM,OAAuB,IAAI,EAQhDO,EAAS,SANU,IAAM,CACnBY,GAAUA,EAAO,SACnBD,EAAoBC,EAAO,QAAQ,YAAY,CAEnD,CAE6B,EAE7BnB,EAAM,UAAU,IAAM,CAChBmB,GAAUA,EAAO,SACnBD,EAAoBC,EAAO,QAAQ,YAAY,CAEnD,EAAG,CAACA,CAAM,CAAC,EAEX,MAAMC,EAAiB,IAAM,CAC3BJ,EAA0BK,GAAa,CAACA,CAAS,CACnD,EAEA,OAAOP,EACLd,EAAA,cAAC,OAAI,UAAU,2CACbA,EAAA,cAAC,OAAI,UAAU,mCACbA,EAAA,cAACI,EAAA,KAAMM,CAAY,EACnBV,EAAA,cAACK,EAAAiB,EAAA,GAASb,EAAe,CAC3B,EACAT,EAAA,cAAC,WACCA,EAAA,cAACM,EAAA,CACC,UAAU,0BACV,OAAQS,GAERf,EAAA,cAAC,OAAI,UAAU,kCAAkC,IAAKmB,GACnDL,EAAM,IAAIS,GACTvB,EAAA,cAACG,EAAAqB,EAAAF,EAAA,GAASC,GAAT,CAAe,IAAKA,EAAK,MAAM,CACjC,CACH,CACF,EAECN,GAAoBA,EAAmBL,EACtCZ,EAAA,cAAC,UACC,KAAK,SACL,UAAU,wBACV,QAASoB,GAERL,EACCf,EAAA,cAAAA,EAAA,cACEA,EAAA,cAACI,EAAA,CACC,YAAY,OACZ,KAAMA,EAAK,MAAM,MACjB,UAAU,8BAETO,CACH,EACAX,EAAA,cAACE,EAAA,IAAU,CACb,EAEAF,EAAA,cAAAA,EAAA,cACEA,EAAA,cAACI,EAAA,CACC,YAAY,OACZ,KAAMA,EAAK,MAAM,MACjB,UAAU,8BAETS,CACH,EACAb,EAAA,cAACC,EAAA,IAAY,CACf,CAEJ,EACE,IACN,CACF,EACE,IACN,EAEA,IAAOwB,EAAQjB",
|
|
6
6
|
"names": ["React", "ChevronDown", "ChevronUp", "Chip", "Text", "Link", "Collapse", "useEvent", "ChipSelected", "resetSelected", "description", "hideSelected", "maxChipsToShow", "showSelected", "chips", "expandedSelectedValues", "setExpandedSelectedValues", "heightOfCollapse", "setHeightOfCollapse", "divRef", "toggleShowMore", "prevState", "__spreadValues", "chip", "__spreadProps", "chip_selected_default"]
|
|
7
7
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
var v=Object.defineProperty,b=Object.defineProperties;var C=Object.getOwnPropertyDescriptors;var d=Object.getOwnPropertySymbols;var O=Object.prototype.hasOwnProperty,S=Object.prototype.propertyIsEnumerable;var p=(i,e,t)=>e in i?v(i,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):i[e]=t,m=(i,e)=>{for(var t in e||(e={}))O.call(e,t)&&p(i,t,e[t]);if(d)for(var t of d(e))S.call(e,t)&&p(i,t,e[t]);return i},u=(i,e)=>b(i,C(e));var n=(i,e,t)=>p(i,typeof e!="symbol"?e+"":e,t);import M,{Component as w,createRef as P}from"react";class g extends w{constructor(){super(...arguments);n(this,"state",{height:this.props.forceInitialAnimation||!this.props.isOpen?0:null,isAnimating:!1,isMounted:!1,isOpen:this.props.isOpen||!1});n(this,"wrapperRef",P());n(this,"previousHeight",0);n(this,"raf",null);n(this,"timer",null);n(this,"isAnimating",!1);n(this,"getHeight",()=>{var s;const t=(s=this.wrapperRef.current)==null?void 0:s.firstElementChild;return t?Math.max(t.offsetHeight-1,0):0});n(this,"transition",()=>{const t=this.props.isOpen?this.getHeight():0;clearTimeout(this.timer),cancelAnimationFrame(this.raf),this.isAnimating=!0,this.setState({height:this.previousHeight,isAnimating:!0,shouldAnimate:!1},()=>{this.previousHeight=t,this.raf=requestAnimationFrame(()=>{this.raf=requestAnimationFrame(()=>{this.setState({height:t},()=>{this.timer=window.setTimeout(()=>{this.setState({height:this.props.isOpen?null:0,isAnimating:!1},()=>{this.isAnimating=!1})},this.props.duration)})})})})});n(this,"onTransitionEnd",()=>{this.previousHeight=this.getHeight()})}componentDidMount(){this.setState({isMounted:!0},()=>{this.props.forceInitialAnimation?this.transition():(this.previousHeight=this.props.isOpen?this.getHeight():0,this.setState({isAnimating:!1}))})}static getDerivedStateFromProps(t,s){const o=t.isOpen!==s.isOpen,a=!s.isMounted&&t.forceInitialAnimation&&t.isOpen;return{isOpen:t.isOpen||!1,shouldAnimate:o||a}}getSnapshotBeforeUpdate(){return this.props.isOpen?this.getHeight():0}componentDidUpdate(t,s,o){if(this.isAnimating&&!this.state.shouldAnimate)return;const a=this.getHeight(),r=a!==o;this.props.onMeasure(a),this.state.shouldAnimate||r&&this.props.animateChildren?this.transition():r&&(this.previousHeight=this.getHeight())}componentWillUnmount(){clearTimeout(this.timer),cancelAnimationFrame(this.raf)}render(){const{isAnimating:t,isMounted:s}=this.state,{component:o="div",componentProps:a={},forceInitialAnimation:r,isOpen:h,unmountChildren:f,className:c,children:A}=this.props,H=f?h||t:!0,l=!s&&r&&h;return M.createElement(o,u(m({},a),{className:c,onTransitionEnd:this.onTransitionEnd,ref:this.wrapperRef,style:u(m({},a.style),{height:this.state.height,overflow:t||!h||l?"hidden":void 0,visibility:!t&&!h||l?"hidden":void 0,transition:t||l?`height ${this.props.duration}ms ${this.props.easing}`:void 0})}),H&&A)}}n(g,"defaultProps",{animateChildren:!1,component:"div",componentProps:{},duration:500,easing:"cubic-bezier(0.3,0,0,1)",forceInitialAnimation:!1,isOpen:!1,onMeasure:()=>{},unmountChildren:!1});var I=g;export{I as default};
|
|
1
|
+
"use client";var v=Object.defineProperty,b=Object.defineProperties;var C=Object.getOwnPropertyDescriptors;var d=Object.getOwnPropertySymbols;var O=Object.prototype.hasOwnProperty,S=Object.prototype.propertyIsEnumerable;var p=(i,e,t)=>e in i?v(i,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):i[e]=t,m=(i,e)=>{for(var t in e||(e={}))O.call(e,t)&&p(i,t,e[t]);if(d)for(var t of d(e))S.call(e,t)&&p(i,t,e[t]);return i},u=(i,e)=>b(i,C(e));var n=(i,e,t)=>p(i,typeof e!="symbol"?e+"":e,t);import M,{Component as w,createRef as P}from"react";class g extends w{constructor(){super(...arguments);n(this,"state",{height:this.props.forceInitialAnimation||!this.props.isOpen?0:null,isAnimating:!1,isMounted:!1,isOpen:this.props.isOpen||!1});n(this,"wrapperRef",P());n(this,"previousHeight",0);n(this,"raf",null);n(this,"timer",null);n(this,"isAnimating",!1);n(this,"getHeight",()=>{var s;const t=(s=this.wrapperRef.current)==null?void 0:s.firstElementChild;return t?Math.max(t.offsetHeight-1,0):0});n(this,"transition",()=>{const t=this.props.isOpen?this.getHeight():0;clearTimeout(this.timer),cancelAnimationFrame(this.raf),this.isAnimating=!0,this.setState({height:this.previousHeight,isAnimating:!0,shouldAnimate:!1},()=>{this.previousHeight=t,this.raf=requestAnimationFrame(()=>{this.raf=requestAnimationFrame(()=>{this.setState({height:t},()=>{this.timer=window.setTimeout(()=>{this.setState({height:this.props.isOpen?null:0,isAnimating:!1},()=>{this.isAnimating=!1})},this.props.duration)})})})})});n(this,"onTransitionEnd",()=>{this.previousHeight=this.getHeight()})}componentDidMount(){this.setState({isMounted:!0},()=>{this.props.forceInitialAnimation?this.transition():(this.previousHeight=this.props.isOpen?this.getHeight():0,this.setState({isAnimating:!1}))})}static getDerivedStateFromProps(t,s){const o=t.isOpen!==s.isOpen,a=!s.isMounted&&t.forceInitialAnimation&&t.isOpen;return{isOpen:t.isOpen||!1,shouldAnimate:o||a}}getSnapshotBeforeUpdate(){return this.props.isOpen?this.getHeight():0}componentDidUpdate(t,s,o){if(this.isAnimating&&!this.state.shouldAnimate)return;const a=this.getHeight(),r=a!==o;this.props.onMeasure(a),this.state.shouldAnimate||r&&this.props.animateChildren?this.transition():r&&(this.previousHeight=this.getHeight())}componentWillUnmount(){clearTimeout(this.timer),cancelAnimationFrame(this.raf)}render(){const{isAnimating:t,isMounted:s}=this.state,{component:o="div",componentProps:a={},forceInitialAnimation:r,isOpen:h,unmountChildren:f,className:c,children:A}=this.props,H=f?h||t:!0,l=!s&&r&&h;return M.createElement(o,u(m({},a),{className:c,onTransitionEnd:this.onTransitionEnd,ref:this.wrapperRef,style:u(m({},a.style),{height:this.state.height,overflow:t||!h||l?"hidden":void 0,visibility:!t&&!h||l?"hidden":void 0,transition:t||l?`height ${this.props.duration}ms ${this.props.easing}`:void 0})}),H&&A)}}n(g,"defaultProps",{animateChildren:!1,component:"div",componentProps:{},duration:500,easing:"cubic-bezier(0.3,0,0,1)",forceInitialAnimation:!1,isOpen:!1,onMeasure:()=>{},unmountChildren:!1});var I=g;export{I as default};
|
|
2
2
|
//# sourceMappingURL=collapse.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../react/collapse/collapse.tsx"],
|
|
4
|
-
"sourcesContent": ["
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["'use client';\n\nimport React, { Component, createRef } from 'react';\n\nimport { Collapse as Props } from './collapse.types';\n\ninterface CollapseState {\n height: number | null;\n isAnimating: boolean;\n isMounted: boolean;\n isOpen: boolean;\n shouldAnimate?: boolean;\n}\n\nclass Collapse extends Component<Props, CollapseState> {\n static defaultProps: Props = {\n animateChildren: false,\n component: 'div',\n componentProps: {},\n duration: 500,\n easing: 'cubic-bezier(0.3,0,0,1)',\n forceInitialAnimation: false,\n isOpen: false,\n onMeasure: () => {},\n unmountChildren: false,\n };\n\n state: CollapseState = {\n height: this.props.forceInitialAnimation || !this.props.isOpen ? 0 : null,\n isAnimating: false,\n isMounted: false,\n isOpen: this.props.isOpen || false,\n };\n\n private wrapperRef = createRef<HTMLElement>();\n private previousHeight: number = 0;\n private raf: number | null = null;\n private timer: number | null = null;\n private isAnimating: boolean = false;\n\n getHeight = (): number => {\n const child = this.wrapperRef.current\n ?.firstElementChild as HTMLElement | null;\n return child ? Math.max(child.offsetHeight - 1, 0) : 0; // -1px to avoid jump after transition\n };\n\n transition = () => {\n const newHeight = this.props.isOpen ? this.getHeight() : 0;\n\n clearTimeout(this.timer!);\n cancelAnimationFrame(this.raf!);\n this.isAnimating = true;\n\n this.setState(\n { height: this.previousHeight, isAnimating: true, shouldAnimate: false },\n () => {\n this.previousHeight = newHeight;\n this.raf = requestAnimationFrame(() => {\n this.raf = requestAnimationFrame(() => {\n this.setState({ height: newHeight }, () => {\n this.timer = window.setTimeout(() => {\n this.setState(\n {\n height: this.props.isOpen ? null : 0,\n isAnimating: false,\n },\n () => {\n this.isAnimating = false;\n },\n );\n }, this.props.duration);\n });\n });\n });\n },\n );\n };\n\n componentDidMount() {\n this.setState({ isMounted: true }, () => {\n if (this.props.forceInitialAnimation) {\n this.transition();\n } else {\n this.previousHeight = this.props.isOpen ? this.getHeight() : 0;\n this.setState({ isAnimating: false });\n }\n });\n }\n\n onTransitionEnd = () => {\n this.previousHeight = this.getHeight();\n };\n\n static getDerivedStateFromProps(\n nextProps: Props,\n prevState: CollapseState,\n ): Partial<CollapseState> | null {\n const openDidChange = nextProps.isOpen !== prevState.isOpen;\n const forceAnimation =\n !prevState.isMounted &&\n nextProps.forceInitialAnimation &&\n nextProps.isOpen;\n\n return {\n isOpen: nextProps.isOpen || false,\n shouldAnimate: openDidChange || forceAnimation,\n };\n }\n\n getSnapshotBeforeUpdate(): number {\n return this.props.isOpen ? this.getHeight() : 0;\n }\n\n componentDidUpdate(\n _prevProps: Props,\n _prevState: CollapseState,\n snapshot: number,\n ) {\n if (this.isAnimating && !this.state.shouldAnimate) {\n return;\n }\n\n const newHeight = this.getHeight();\n const childrenDidChange = newHeight !== snapshot;\n this.props.onMeasure!(newHeight);\n\n if (\n this.state.shouldAnimate ||\n (childrenDidChange && this.props.animateChildren)\n ) {\n this.transition();\n } else if (childrenDidChange) {\n this.previousHeight = this.getHeight();\n }\n }\n\n componentWillUnmount() {\n clearTimeout(this.timer!);\n cancelAnimationFrame(this.raf!);\n }\n\n render() {\n const { isAnimating, isMounted } = this.state;\n const {\n component = 'div',\n componentProps = {},\n forceInitialAnimation,\n isOpen,\n unmountChildren,\n className,\n children,\n } = this.props;\n const shouldMount = unmountChildren ? isOpen || isAnimating : true;\n const initiallyHidden = !isMounted && forceInitialAnimation && isOpen;\n\n return React.createElement(\n component,\n {\n ...componentProps,\n className: className,\n onTransitionEnd: this.onTransitionEnd,\n ref: this.wrapperRef,\n style: {\n ...componentProps.style,\n height: this.state.height,\n overflow:\n isAnimating || !isOpen || initiallyHidden ? 'hidden' : undefined,\n visibility:\n (!isAnimating && !isOpen) || initiallyHidden ? 'hidden' : undefined,\n transition:\n isAnimating || initiallyHidden\n ? `height ${this.props.duration}ms ${this.props.easing}`\n : undefined,\n },\n },\n shouldMount && children,\n );\n }\n}\n\nexport default Collapse;\n"],
|
|
5
|
+
"mappings": "0eAEA,OAAOA,GAAS,aAAAC,EAAW,aAAAC,MAAiB,QAY5C,MAAMC,UAAiBF,CAAgC,CAAvD,kCAaEG,EAAA,aAAuB,CACrB,OAAQ,KAAK,MAAM,uBAAyB,CAAC,KAAK,MAAM,OAAS,EAAI,KACrE,YAAa,GACb,UAAW,GACX,OAAQ,KAAK,MAAM,QAAU,EAC/B,GAEAA,EAAA,KAAQ,aAAaF,EAAuB,GAC5CE,EAAA,KAAQ,iBAAyB,GACjCA,EAAA,KAAQ,MAAqB,MAC7BA,EAAA,KAAQ,QAAuB,MAC/BA,EAAA,KAAQ,cAAuB,IAE/BA,EAAA,iBAAY,IAAc,CAxC5B,IAAAC,EAyCI,MAAMC,GAAQD,EAAA,KAAK,WAAW,UAAhB,YAAAA,EACV,kBACJ,OAAOC,EAAQ,KAAK,IAAIA,EAAM,aAAe,EAAG,CAAC,EAAI,CACvD,GAEAF,EAAA,kBAAa,IAAM,CACjB,MAAMG,EAAY,KAAK,MAAM,OAAS,KAAK,UAAU,EAAI,EAEzD,aAAa,KAAK,KAAM,EACxB,qBAAqB,KAAK,GAAI,EAC9B,KAAK,YAAc,GAEnB,KAAK,SACH,CAAE,OAAQ,KAAK,eAAgB,YAAa,GAAM,cAAe,EAAM,EACvE,IAAM,CACJ,KAAK,eAAiBA,EACtB,KAAK,IAAM,sBAAsB,IAAM,CACrC,KAAK,IAAM,sBAAsB,IAAM,CACrC,KAAK,SAAS,CAAE,OAAQA,CAAU,EAAG,IAAM,CACzC,KAAK,MAAQ,OAAO,WAAW,IAAM,CACnC,KAAK,SACH,CACE,OAAQ,KAAK,MAAM,OAAS,KAAO,EACnC,YAAa,EACf,EACA,IAAM,CACJ,KAAK,YAAc,EACrB,CACF,CACF,EAAG,KAAK,MAAM,QAAQ,CACxB,CAAC,CACH,CAAC,CACH,CAAC,CACH,CACF,CACF,GAaAH,EAAA,uBAAkB,IAAM,CACtB,KAAK,eAAiB,KAAK,UAAU,CACvC,GAbA,mBAAoB,CAClB,KAAK,SAAS,CAAE,UAAW,EAAK,EAAG,IAAM,CACnC,KAAK,MAAM,sBACb,KAAK,WAAW,GAEhB,KAAK,eAAiB,KAAK,MAAM,OAAS,KAAK,UAAU,EAAI,EAC7D,KAAK,SAAS,CAAE,YAAa,EAAM,CAAC,EAExC,CAAC,CACH,CAMA,OAAO,yBACLI,EACAC,EAC+B,CAC/B,MAAMC,EAAgBF,EAAU,SAAWC,EAAU,OAC/CE,EACJ,CAACF,EAAU,WACXD,EAAU,uBACVA,EAAU,OAEZ,MAAO,CACL,OAAQA,EAAU,QAAU,GAC5B,cAAeE,GAAiBC,CAClC,CACF,CAEA,yBAAkC,CAChC,OAAO,KAAK,MAAM,OAAS,KAAK,UAAU,EAAI,CAChD,CAEA,mBACEC,EACAC,EACAC,EACA,CACA,GAAI,KAAK,aAAe,CAAC,KAAK,MAAM,cAClC,OAGF,MAAMP,EAAY,KAAK,UAAU,EAC3BQ,EAAoBR,IAAcO,EACxC,KAAK,MAAM,UAAWP,CAAS,EAG7B,KAAK,MAAM,eACVQ,GAAqB,KAAK,MAAM,gBAEjC,KAAK,WAAW,EACPA,IACT,KAAK,eAAiB,KAAK,UAAU,EAEzC,CAEA,sBAAuB,CACrB,aAAa,KAAK,KAAM,EACxB,qBAAqB,KAAK,GAAI,CAChC,CAEA,QAAS,CACP,KAAM,CAAE,YAAAC,EAAa,UAAAC,CAAU,EAAI,KAAK,MAClC,CACJ,UAAAC,EAAY,MACZ,eAAAC,EAAiB,CAAC,EAClB,sBAAAC,EACA,OAAAC,EACA,gBAAAC,EACA,UAAAC,EACA,SAAAC,CACF,EAAI,KAAK,MACHC,EAAcH,EAAkBD,GAAUL,EAAc,GACxDU,EAAkB,CAACT,GAAaG,GAAyBC,EAE/D,OAAOrB,EAAM,cACXkB,EACAS,EAAAC,EAAA,GACKT,GADL,CAEE,UAAWI,EACX,gBAAiB,KAAK,gBACtB,IAAK,KAAK,WACV,MAAOI,EAAAC,EAAA,GACFT,EAAe,OADb,CAEL,OAAQ,KAAK,MAAM,OACnB,SACEH,GAAe,CAACK,GAAUK,EAAkB,SAAW,OACzD,WACG,CAACV,GAAe,CAACK,GAAWK,EAAkB,SAAW,OAC5D,WACEV,GAAeU,EACX,UAAU,KAAK,MAAM,QAAQ,MAAM,KAAK,MAAM,MAAM,GACpD,MACR,EACF,GACAD,GAAeD,CACjB,CACF,CACF,CAnKEpB,EADID,EACG,eAAsB,CAC3B,gBAAiB,GACjB,UAAW,MACX,eAAgB,CAAC,EACjB,SAAU,IACV,OAAQ,0BACR,sBAAuB,GACvB,OAAQ,GACR,UAAW,IAAM,CAAC,EAClB,gBAAiB,EACnB,GA2JF,IAAO0B,EAAQ1B",
|
|
6
6
|
"names": ["React", "Component", "createRef", "Collapse", "__publicField", "_a", "child", "newHeight", "nextProps", "prevState", "openDidChange", "forceAnimation", "_prevProps", "_prevState", "snapshot", "childrenDidChange", "isAnimating", "isMounted", "component", "componentProps", "forceInitialAnimation", "isOpen", "unmountChildren", "className", "children", "shouldMount", "initiallyHidden", "__spreadProps", "__spreadValues", "collapse_default"]
|
|
7
7
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
var b=Object.defineProperty,h=Object.defineProperties;var y=Object.getOwnPropertyDescriptors;var c=Object.getOwnPropertySymbols;var T=Object.prototype.hasOwnProperty,C=Object.prototype.propertyIsEnumerable;var l=(a,i,r)=>i in a?b(a,i,{enumerable:!0,configurable:!0,writable:!0,value:r}):a[i]=r,t=(a,i)=>{for(var r in i||(i={}))T.call(i,r)&&l(a,r,i[r]);if(c)for(var r of c(i))C.call(i,r)&&l(a,r,i[r]);return a},m=(a,i)=>h(a,y(i));import*as
|
|
1
|
+
"use client";var b=Object.defineProperty,h=Object.defineProperties;var y=Object.getOwnPropertyDescriptors;var c=Object.getOwnPropertySymbols;var T=Object.prototype.hasOwnProperty,C=Object.prototype.propertyIsEnumerable;var l=(a,i,r)=>i in a?b(a,i,{enumerable:!0,configurable:!0,writable:!0,value:r}):a[i]=r,t=(a,i)=>{for(var r in i||(i={}))T.call(i,r)&&l(a,r,i[r]);if(c)for(var r of c(i))C.call(i,r)&&l(a,r,i[r]);return a},m=(a,i)=>h(a,y(i));import*as n from"react";import*as x from"react-dom";import o from"../button";import u from"../link-button";import M from"../modal/tab-trapper";import e from"../text";import P from"../hooks/use-escape";import{useIsMounted as k}from"../hooks/use-is-mounted";const z=({children:a,close:i,confirmationButton:r,confirmationLink:s,onClose:d=()=>{},onConfirm:v,text:p,title:f,ariaLabel:_,actionButtonType:N="primary"})=>(P(d),k()?x.createPortal(n.createElement("div",{className:"confirmation",role:"dialog","aria-label":_},n.createElement("div",{className:"confirmation__content"},n.createElement(M,{isActive:!0},n.createElement("div",{className:"confirmation__wrapper"},f?n.createElement(e,{className:"confirmation__title",elementName:"h2",theme:e.themes.emphasis,size:e.sizes.headline3},f):void 0,p?n.createElement(e,{className:"confirmation__text"},p):n.createElement("div",{className:"confirmation__children"},a),n.createElement("div",{className:"confirmation__buttons"},r?n.createElement(o,m(t({className:"confirmation__button",variant:N==="primary"?o.variants.primary:o.variants.primaryDestructive},r),{onClick:v})):void 0,s?n.createElement(u,t({className:"confirmation__button",variant:u.variants.primary},s)):void 0,i?n.createElement(o,m(t({className:"confirmation__button",variant:o.variants.secondary},i),{onClick:d})):void 0))))),document.body):null);var j=z;export{j as default};
|
|
2
2
|
//# sourceMappingURL=confirmation.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../react/confirmation/confirmation.tsx"],
|
|
4
|
-
"sourcesContent": ["
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["'use client';\n\nimport * as React from 'react';\nimport * as ReactDOM from 'react-dom';\n\nimport Button from '../button';\nimport LinkButton from '../link-button';\nimport TabTrapper from '../modal/tab-trapper';\nimport Text from '../text';\nimport useEscape from '../hooks/use-escape';\nimport { useIsMounted } from '../hooks/use-is-mounted';\n\nimport { Confirmation as Props } from './confirmation.types';\n\nconst Confirmation: React.FC<React.PropsWithChildren<Props>> = ({\n children,\n close,\n confirmationButton,\n confirmationLink,\n onClose = () => {},\n onConfirm,\n text,\n title,\n ariaLabel,\n actionButtonType = 'primary',\n}) => {\n useEscape(onClose);\n\n const isMounted = useIsMounted();\n\n if (!isMounted) {\n return null;\n }\n\n return ReactDOM.createPortal(\n <div className=\"confirmation\" role=\"dialog\" aria-label={ariaLabel}>\n <div className=\"confirmation__content\">\n <TabTrapper isActive={true}>\n <div className=\"confirmation__wrapper\">\n {title ? (\n <Text\n className=\"confirmation__title\"\n elementName=\"h2\"\n theme={Text.themes.emphasis}\n size={Text.sizes.headline3}\n >\n {title}\n </Text>\n ) : undefined}\n {text ? (\n <Text className=\"confirmation__text\">{text}</Text>\n ) : (\n <div className=\"confirmation__children\">{children}</div>\n )}\n <div className=\"confirmation__buttons\">\n {confirmationButton ? (\n <Button\n className=\"confirmation__button\"\n variant={\n actionButtonType === 'primary'\n ? Button.variants.primary\n : Button.variants.primaryDestructive\n }\n {...confirmationButton}\n onClick={onConfirm}\n />\n ) : undefined}\n {confirmationLink ? (\n <LinkButton\n className=\"confirmation__button\"\n variant={LinkButton.variants.primary}\n {...confirmationLink}\n />\n ) : undefined}\n {close ? (\n <Button\n className=\"confirmation__button\"\n variant={Button.variants.secondary}\n {...close}\n onClick={onClose}\n />\n ) : undefined}\n </div>\n </div>\n </TabTrapper>\n </div>\n </div>,\n document.body,\n );\n};\n\nexport default Confirmation;\n"],
|
|
5
|
+
"mappings": "0bAEA,UAAYA,MAAW,QACvB,UAAYC,MAAc,YAE1B,OAAOC,MAAY,YACnB,OAAOC,MAAgB,iBACvB,OAAOC,MAAgB,uBACvB,OAAOC,MAAU,UACjB,OAAOC,MAAe,sBACtB,OAAS,gBAAAC,MAAoB,0BAI7B,MAAMC,EAAyD,CAAC,CAC9D,SAAAC,EACA,MAAAC,EACA,mBAAAC,EACA,iBAAAC,EACA,QAAAC,EAAU,IAAM,CAAC,EACjB,UAAAC,EACA,KAAAC,EACA,MAAAC,EACA,UAAAC,EACA,iBAAAC,EAAmB,SACrB,KACEZ,EAAUO,CAAO,EAECN,EAAa,EAMxBN,EAAS,aACdD,EAAA,cAAC,OAAI,UAAU,eAAe,KAAK,SAAS,aAAYiB,GACtDjB,EAAA,cAAC,OAAI,UAAU,yBACbA,EAAA,cAACI,EAAA,CAAW,SAAU,IACpBJ,EAAA,cAAC,OAAI,UAAU,yBACZgB,EACChB,EAAA,cAACK,EAAA,CACC,UAAU,sBACV,YAAY,KACZ,MAAOA,EAAK,OAAO,SACnB,KAAMA,EAAK,MAAM,WAEhBW,CACH,EACE,OACHD,EACCf,EAAA,cAACK,EAAA,CAAK,UAAU,sBAAsBU,CAAK,EAE3Cf,EAAA,cAAC,OAAI,UAAU,0BAA0BS,CAAS,EAEpDT,EAAA,cAAC,OAAI,UAAU,yBACZW,EACCX,EAAA,cAACE,EAAAiB,EAAAC,EAAA,CACC,UAAU,uBACV,QACEF,IAAqB,UACjBhB,EAAO,SAAS,QAChBA,EAAO,SAAS,oBAElBS,GAPL,CAQC,QAASG,GACX,EACE,OACHF,EACCZ,EAAA,cAACG,EAAAiB,EAAA,CACC,UAAU,uBACV,QAASjB,EAAW,SAAS,SACzBS,EACN,EACE,OACHF,EACCV,EAAA,cAACE,EAAAiB,EAAAC,EAAA,CACC,UAAU,uBACV,QAASlB,EAAO,SAAS,WACrBQ,GAHL,CAIC,QAASG,GACX,EACE,MACN,CACF,CACF,CACF,CACF,EACA,SAAS,IACX,EAzDS,MA4DX,IAAOQ,EAAQb",
|
|
6
6
|
"names": ["React", "ReactDOM", "Button", "LinkButton", "TabTrapper", "Text", "useEscape", "useIsMounted", "Confirmation", "children", "close", "confirmationButton", "confirmationLink", "onClose", "onConfirm", "text", "title", "ariaLabel", "actionButtonType", "__spreadProps", "__spreadValues", "confirmation_default"]
|
|
7
7
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
var E=Object.defineProperty,S=Object.defineProperties;var g=Object.getOwnPropertyDescriptors;var b=Object.getOwnPropertySymbols;var C=Object.prototype.hasOwnProperty,L=Object.prototype.propertyIsEnumerable;var N=(m,o,n)=>o in m?E(m,o,{enumerable:!0,configurable:!0,writable:!0,value:n}):m[o]=n,u=(m,o)=>{for(var n in o||(o={}))C.call(o,n)&&N(m,n,o[n]);if(b)for(var n of b(o))L.call(o,n)&&N(m,n,o[n]);return m},w=(m,o)=>S(m,g(o));import t,{useEffect as P,useRef as W,useState as M}from"react";import r from"classnames";import B from"../icons/18/close";import F from"../hidden-input";import H from"../hooks/focus-previous-element";import A from"../modal/tab-trapper";import O from"../hooks/use-click-outside";import j from"../hooks/use-escape";import x from"../button";import p from"../text";import q from"../ts/debounce";import{Types as _,itemThemes as G,positions as y}from"./context-menu.types";const h=({list:m,isOpen:o,onClose:n=()=>{},position:f=y.right,title:z,close:k,descriptions:i,smallDescription:l})=>{const d=W(null),[a,v]=M();O(d,n),j(n),H(d,o),P(()=>{a||v(window.innerWidth);const s=()=>{v(window.innerWidth)};return window.addEventListener("resize",q(s,2e3)),()=>window.addEventListener("resize",s)});const c=t.createElement("div",{className:r("context-menu",{[`context-menu--${f}`]:f}),ref:d,tabIndex:-1},t.createElement("div",{className:r("context-menu__texts-wrapper",{"context-menu__texts-wrapper--center":!(i!=null&&i.length)})},t.createElement("div",{className:"context-menu__texts"},t.createElement(p,{theme:p.themes.emphasis,size:p.sizes.small},z),i?i.map(s=>t.createElement(p,{size:p.sizes.small,className:"context-menu__texts-description",key:s},s)):null,l?t.createElement(p,{size:p.sizes.interface,className:"context-menu__texts-description",key:l},l):null),t.createElement("div",null,t.createElement(x,w(u({},k),{iconOnly:!0,leadingIcon:t.createElement(B,null),onClick:n,size:x.sizes.small,variant:x.variants.tertiary})))),t.createElement("div",{className:"context-menu__list-items"},m.map(({icon:s,item:e},$)=>t.createElement("div",{key:e.props.text+$},e.type===_.Link?t.createElement("a",{href:e.props.href,className:r("context-menu__list-item-link",{[`context-menu__list-item-link--theme-${e.props.theme}`]:e.props.theme}),"data-testid":e.props.testId},s?t.createElement("div",{className:r("context-menu__list-icon",{[`context-menu__list-icon--theme-${e.props.theme}`]:e.props.theme})},s):null,t.createElement(p,null,e.props.text)):e.type===_.Form?t.createElement("form",{onSubmit:e.props.handleSubmit,action:e.props.action,method:"POST",className:r("context-menu__list-item-form",{[`context-menu__list-item-form--theme-${e.props.theme}`]:e.props.theme})},t.createElement("button",{type:"submit",className:r("context-menu__list-item-form-button",{[`context-menu__list-item-form-button--theme-${e.props.theme}`]:e.props.theme}),"data-testid":e.props.testId},s?t.createElement("div",{className:r("context-menu__list-icon",{[`context-menu__list-icon--theme-${e.props.theme}`]:e.props.theme})},s):null,t.createElement(p,null,e.props.text)),e.props.hiddenInputs?e.props.hiddenInputs.map((T,I)=>t.createElement(F,u({key:T.name+I},T))):null):e.type===_.Button?t.createElement("button",u({className:r("context-menu__list-item-button",{[`context-menu__list-item-button--theme-${e.props.theme}`]:e.props.theme})},e.props),s?t.createElement("div",{className:r("context-menu__list-icon",{[`context-menu__list-icon--theme-${e.props.theme}`]:e.props.theme})},s):null,t.createElement(p,null,e.props.text)):null))));return o?t.createElement(t.Fragment,null,t.createElement("div",{className:"context-menu__background-overlay"}),a&&a<600?t.createElement(A,{isActive:o},c):t.createElement("div",null,c)):null};h.position=y,h.itemTheme=G;var se=h;export{se as default};
|
|
1
|
+
"use client";var E=Object.defineProperty,S=Object.defineProperties;var g=Object.getOwnPropertyDescriptors;var b=Object.getOwnPropertySymbols;var C=Object.prototype.hasOwnProperty,L=Object.prototype.propertyIsEnumerable;var N=(m,o,n)=>o in m?E(m,o,{enumerable:!0,configurable:!0,writable:!0,value:n}):m[o]=n,u=(m,o)=>{for(var n in o||(o={}))C.call(o,n)&&N(m,n,o[n]);if(b)for(var n of b(o))L.call(o,n)&&N(m,n,o[n]);return m},w=(m,o)=>S(m,g(o));import t,{useEffect as P,useRef as W,useState as M}from"react";import r from"classnames";import B from"../icons/18/close";import F from"../hidden-input";import H from"../hooks/focus-previous-element";import A from"../modal/tab-trapper";import O from"../hooks/use-click-outside";import j from"../hooks/use-escape";import x from"../button";import p from"../text";import q from"../ts/debounce";import{Types as _,itemThemes as G,positions as y}from"./context-menu.types";const h=({list:m,isOpen:o,onClose:n=()=>{},position:f=y.right,title:z,close:k,descriptions:i,smallDescription:l})=>{const d=W(null),[a,v]=M();O(d,n),j(n),H(d,o),P(()=>{a||v(window.innerWidth);const s=()=>{v(window.innerWidth)};return window.addEventListener("resize",q(s,2e3)),()=>window.addEventListener("resize",s)});const c=t.createElement("div",{className:r("context-menu",{[`context-menu--${f}`]:f}),ref:d,tabIndex:-1},t.createElement("div",{className:r("context-menu__texts-wrapper",{"context-menu__texts-wrapper--center":!(i!=null&&i.length)})},t.createElement("div",{className:"context-menu__texts"},t.createElement(p,{theme:p.themes.emphasis,size:p.sizes.small},z),i?i.map(s=>t.createElement(p,{size:p.sizes.small,className:"context-menu__texts-description",key:s},s)):null,l?t.createElement(p,{size:p.sizes.interface,className:"context-menu__texts-description",key:l},l):null),t.createElement("div",null,t.createElement(x,w(u({},k),{iconOnly:!0,leadingIcon:t.createElement(B,null),onClick:n,size:x.sizes.small,variant:x.variants.tertiary})))),t.createElement("div",{className:"context-menu__list-items"},m.map(({icon:s,item:e},$)=>t.createElement("div",{key:e.props.text+$},e.type===_.Link?t.createElement("a",{href:e.props.href,className:r("context-menu__list-item-link",{[`context-menu__list-item-link--theme-${e.props.theme}`]:e.props.theme}),"data-testid":e.props.testId},s?t.createElement("div",{className:r("context-menu__list-icon",{[`context-menu__list-icon--theme-${e.props.theme}`]:e.props.theme})},s):null,t.createElement(p,null,e.props.text)):e.type===_.Form?t.createElement("form",{onSubmit:e.props.handleSubmit,action:e.props.action,method:"POST",className:r("context-menu__list-item-form",{[`context-menu__list-item-form--theme-${e.props.theme}`]:e.props.theme})},t.createElement("button",{type:"submit",className:r("context-menu__list-item-form-button",{[`context-menu__list-item-form-button--theme-${e.props.theme}`]:e.props.theme}),"data-testid":e.props.testId},s?t.createElement("div",{className:r("context-menu__list-icon",{[`context-menu__list-icon--theme-${e.props.theme}`]:e.props.theme})},s):null,t.createElement(p,null,e.props.text)),e.props.hiddenInputs?e.props.hiddenInputs.map((T,I)=>t.createElement(F,u({key:T.name+I},T))):null):e.type===_.Button?t.createElement("button",u({className:r("context-menu__list-item-button",{[`context-menu__list-item-button--theme-${e.props.theme}`]:e.props.theme})},e.props),s?t.createElement("div",{className:r("context-menu__list-icon",{[`context-menu__list-icon--theme-${e.props.theme}`]:e.props.theme})},s):null,t.createElement(p,null,e.props.text)):null))));return o?t.createElement(t.Fragment,null,t.createElement("div",{className:"context-menu__background-overlay"}),a&&a<600?t.createElement(A,{isActive:o},c):t.createElement("div",null,c)):null};h.position=y,h.itemTheme=G;var se=h;export{se as default};
|
|
2
2
|
//# sourceMappingURL=context-menu.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../react/context-menu/context-menu.tsx"],
|
|
4
|
-
"sourcesContent": ["
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["'use client';\n\nimport React, { useEffect, useRef, useState } from 'react';\nimport classNames from 'classnames';\n\nimport Close from '../icons/18/close';\nimport HiddenInput from '../hidden-input';\nimport focusPreviousElement from '../hooks/focus-previous-element';\nimport TabTrapper from '../modal/tab-trapper';\nimport useClickOutside from '../hooks/use-click-outside';\nimport useEscape from '../hooks/use-escape';\nimport Button from '../button';\nimport Text from '../text';\nimport debounce from '../ts/debounce';\n\nimport {\n ContextMenu as Props,\n Types,\n itemThemes,\n positions,\n} from './context-menu.types';\n\nconst ContextMenu: React.FunctionComponent<Props> & {\n position: typeof positions;\n itemTheme: typeof itemThemes;\n} = ({\n list,\n isOpen,\n onClose = () => {},\n position = positions.right,\n title,\n close,\n descriptions,\n smallDescription,\n}) => {\n const modal = useRef<HTMLDivElement>(null);\n const [windowSize, setWindowSize] = useState<number>();\n useClickOutside(modal, onClose);\n useEscape(onClose);\n\n focusPreviousElement(modal, isOpen);\n\n useEffect(() => {\n if (!windowSize) setWindowSize(window.innerWidth);\n const handleWindowResize = () => {\n setWindowSize(window.innerWidth);\n };\n window.addEventListener('resize', debounce(handleWindowResize, 2000));\n\n return () => window.addEventListener('resize', handleWindowResize);\n });\n\n const component = (\n <div\n className={classNames('context-menu', {\n [`context-menu--${position}`]: position,\n })}\n ref={modal}\n tabIndex={-1}\n >\n <div\n className={classNames('context-menu__texts-wrapper', {\n 'context-menu__texts-wrapper--center': !descriptions?.length,\n })}\n >\n <div className=\"context-menu__texts\">\n <Text theme={Text.themes.emphasis} size={Text.sizes.small}>\n {title}\n </Text>\n\n {descriptions\n ? descriptions.map(description => (\n <Text\n size={Text.sizes.small}\n className=\"context-menu__texts-description\"\n key={description}\n >\n {description}\n </Text>\n ))\n : null}\n {smallDescription ? (\n <Text\n size={Text.sizes.interface}\n className=\"context-menu__texts-description\"\n key={smallDescription}\n >\n {smallDescription}\n </Text>\n ) : null}\n </div>\n <div>\n <Button\n {...close}\n iconOnly\n leadingIcon={<Close />}\n onClick={onClose}\n size={Button.sizes.small}\n variant={Button.variants.tertiary}\n />\n </div>\n </div>\n <div className=\"context-menu__list-items\">\n {list.map(({ icon, item }, index) => (\n <div key={item.props.text + index}>\n {item.type === Types.Link ? (\n <a\n href={item.props.href}\n className={classNames('context-menu__list-item-link', {\n [`context-menu__list-item-link--theme-${item.props.theme}`]:\n item.props.theme,\n })}\n data-testid={item.props.testId}\n >\n {icon ? (\n <div\n className={classNames('context-menu__list-icon', {\n [`context-menu__list-icon--theme-${item.props.theme}`]:\n item.props.theme,\n })}\n >\n {icon}\n </div>\n ) : null}\n <Text>{item.props.text}</Text>\n </a>\n ) : item.type === Types.Form ? (\n <form\n onSubmit={item.props.handleSubmit}\n action={item.props.action}\n method=\"POST\"\n className={classNames('context-menu__list-item-form', {\n [`context-menu__list-item-form--theme-${item.props.theme}`]:\n item.props.theme,\n })}\n >\n <button\n type=\"submit\"\n className={classNames('context-menu__list-item-form-button', {\n [`context-menu__list-item-form-button--theme-${item.props.theme}`]:\n item.props.theme,\n })}\n data-testid={item.props.testId}\n >\n {icon ? (\n <div\n className={classNames('context-menu__list-icon', {\n [`context-menu__list-icon--theme-${item.props.theme}`]:\n item.props.theme,\n })}\n >\n {icon}\n </div>\n ) : null}\n <Text>{item.props.text}</Text>\n </button>\n {item.props.hiddenInputs\n ? item.props.hiddenInputs.map((input, index) => (\n <HiddenInput key={input.name + index} {...input} />\n ))\n : null}\n </form>\n ) : item.type === Types.Button ? (\n <button\n className={classNames('context-menu__list-item-button', {\n [`context-menu__list-item-button--theme-${item.props.theme}`]:\n item.props.theme,\n })}\n {...item.props}\n >\n {icon ? (\n <div\n className={classNames('context-menu__list-icon', {\n [`context-menu__list-icon--theme-${item.props.theme}`]:\n item.props.theme,\n })}\n >\n {icon}\n </div>\n ) : null}\n <Text>{item.props.text}</Text>\n </button>\n ) : null}\n </div>\n ))}\n </div>\n </div>\n );\n return isOpen ? (\n <>\n <div className=\"context-menu__background-overlay\"></div>\n {windowSize && windowSize < 600 ? ( // 600 is the breakpoint for the component.\n <TabTrapper isActive={isOpen}>{component}</TabTrapper>\n ) : (\n <div>{component}</div>\n )}\n </>\n ) : null;\n};\n\nContextMenu.position = positions;\nContextMenu.itemTheme = itemThemes;\nexport default ContextMenu;\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["React", "useEffect", "useRef", "useState", "classNames", "Close", "HiddenInput", "focusPreviousElement", "TabTrapper", "useClickOutside", "useEscape", "Button", "Text", "debounce", "Types", "itemThemes", "positions", "ContextMenu", "list", "isOpen", "onClose", "position", "title", "close", "descriptions", "smallDescription", "modal", "windowSize", "setWindowSize", "handleWindowResize", "component", "description", "__spreadProps", "__spreadValues", "icon", "item", "index", "input", "context_menu_default"]
|
|
7
7
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
var N=Object.defineProperty,$=Object.defineProperties;var x=Object.getOwnPropertyDescriptors;var _=Object.getOwnPropertySymbols;var C=Object.prototype.hasOwnProperty,z=Object.prototype.propertyIsEnumerable;var w=(e,o,t)=>o in e?N(e,o,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[o]=t,
|
|
1
|
+
"use client";var N=Object.defineProperty,$=Object.defineProperties;var x=Object.getOwnPropertyDescriptors;var _=Object.getOwnPropertySymbols;var C=Object.prototype.hasOwnProperty,z=Object.prototype.propertyIsEnumerable;var w=(e,o,t)=>o in e?N(e,o,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[o]=t,u=(e,o)=>{for(var t in o||(o={}))C.call(o,t)&&w(e,t,o[t]);if(_)for(var t of _(o))z.call(o,t)&&w(e,t,o[t]);return e},f=(e,o)=>$(e,x(o));import*as s from"react";import T from"../form-content";import r from"../text";import{themes as b}from"./dropdown-list.types";import g from"../icons/24/arrow-up";import k from"../icons/24/arrow-down";import D from"../hooks/use-toggle";import P from"../hooks/use-click-outside";import y from"../hooks/use-escape";import l from"classnames";const h=({description:e,disabled:o,formContentOptions:t,label:c,selectedOptions:p,header:v,theme:i=b.light})=>{const m=s.useRef(null),[d,a,,n]=D(!1);return P(m,n),y(n),s.createElement("div",{className:"dropdown-list"},s.createElement(r,{theme:r.themes.emphasis,className:l("dropdown-list__label",`dropdown-list__label--theme-${i}`,{[`dropdown-list__label--theme-${i}-disabled`]:o})},c),s.createElement("div",{className:l("dropdown-list__wrapper",`dropdown-list__wrapper--theme-${i}`,{[`dropdown-list__wrapper--theme-${i}-disabled`]:o,[`dropdown-list__wrapper--theme-${i}-clicked`]:d}),ref:m},s.createElement("div",{className:"dropdown-list__buttons"},s.createElement("button",{type:"button",className:l("dropdown-list__button",`dropdown-list__button--theme-${i}`,{[`dropdown-list__button--theme-${i}-disabled`]:o,[`dropdown-list__button--theme-${i}-clicked`]:d}),onClick:a,disabled:o,"data-test-dropdown-button":!0},s.createElement("div",{className:"dropdown-list__text-wrap"},s.createElement(r,{theme:r.themes.normal,size:r.sizes.basic},v),s.createElement(r,{size:r.sizes.small},p||s.createElement(r,{elementName:"span",size:r.sizes.small,className:l("dropdown-list__information",`dropdown-list__information--theme-${i}`,{[`dropdown-list__information--theme-${i}-disabled`]:o})},e))),s.createElement("div",{className:"dropdown-list__icon"},s.createElement(d?g:k,null)))),s.createElement(T,f(u({},t),{isOpen:d,close:n,onSubmit:a}))))};h.themes=b;var G=h;export{G as default};
|
|
2
2
|
//# sourceMappingURL=dropdown-list.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../react/dropdown-list/dropdown-list.tsx"],
|
|
4
|
-
"sourcesContent": ["
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["'use client';\n\nimport * as React from 'react';\nimport FormContent from '../form-content';\n\nimport Text from '../text';\n\nimport { DropdownList as Props, themes } from './dropdown-list.types';\nimport ChevronUp from '../icons/24/arrow-up';\nimport ChevronDown from '../icons/24/arrow-down';\nimport useToggle from '../hooks/use-toggle';\nimport useClickOutside from '../hooks/use-click-outside';\nimport useEscape from '../hooks/use-escape';\nimport classNames from 'classnames';\n\nconst DropdownList: React.FC<React.PropsWithChildren<Props>> & {\n themes: typeof themes;\n} = ({\n description,\n disabled,\n formContentOptions,\n label,\n selectedOptions,\n header,\n theme = themes.light,\n}) => {\n const modal = React.useRef(null);\n const [isOpen, toggle, , close] = useToggle(false);\n\n useClickOutside(modal, close);\n useEscape(close);\n\n return (\n <div className=\"dropdown-list\">\n <Text\n theme={Text.themes.emphasis}\n className={classNames(\n 'dropdown-list__label',\n `dropdown-list__label--theme-${theme}`,\n {\n [`dropdown-list__label--theme-${theme}-disabled`]: disabled,\n },\n )}\n >\n {label}\n </Text>\n <div\n className={classNames(\n 'dropdown-list__wrapper',\n `dropdown-list__wrapper--theme-${theme}`,\n {\n [`dropdown-list__wrapper--theme-${theme}-disabled`]: disabled,\n [`dropdown-list__wrapper--theme-${theme}-clicked`]: isOpen,\n },\n )}\n ref={modal}\n >\n <div className=\"dropdown-list__buttons\">\n <button\n type=\"button\"\n className={classNames(\n 'dropdown-list__button',\n `dropdown-list__button--theme-${theme}`,\n {\n [`dropdown-list__button--theme-${theme}-disabled`]: disabled,\n [`dropdown-list__button--theme-${theme}-clicked`]: isOpen,\n },\n )}\n onClick={toggle}\n disabled={disabled}\n data-test-dropdown-button\n >\n <div className=\"dropdown-list__text-wrap\">\n <Text theme={Text.themes.normal} size={Text.sizes.basic}>\n {header}\n </Text>\n\n <Text size={Text.sizes.small}>\n {selectedOptions ? (\n selectedOptions\n ) : (\n <Text\n elementName=\"span\"\n size={Text.sizes.small}\n className={classNames(\n 'dropdown-list__information',\n `dropdown-list__information--theme-${theme}`,\n {\n [`dropdown-list__information--theme-${theme}-disabled`]:\n disabled,\n },\n )}\n >\n {description}\n </Text>\n )}\n </Text>\n </div>\n\n <div className=\"dropdown-list__icon\">\n {isOpen ? <ChevronUp /> : <ChevronDown />}\n </div>\n </button>\n </div>\n <FormContent\n {...formContentOptions}\n isOpen={isOpen}\n close={close}\n onSubmit={toggle}\n />\n </div>\n </div>\n );\n};\n\nDropdownList.themes = themes;\n\nexport default DropdownList;\n"],
|
|
5
|
+
"mappings": "0bAEA,UAAYA,MAAW,QACvB,OAAOC,MAAiB,kBAExB,OAAOC,MAAU,UAEjB,OAAgC,UAAAC,MAAc,wBAC9C,OAAOC,MAAe,uBACtB,OAAOC,MAAiB,yBACxB,OAAOC,MAAe,sBACtB,OAAOC,MAAqB,6BAC5B,OAAOC,MAAe,sBACtB,OAAOC,MAAgB,aAEvB,MAAMC,EAEF,CAAC,CACH,YAAAC,EACA,SAAAC,EACA,mBAAAC,EACA,MAAAC,EACA,gBAAAC,EACA,OAAAC,EACA,MAAAC,EAAQd,EAAO,KACjB,IAAM,CACJ,MAAMe,EAAQlB,EAAM,OAAO,IAAI,EACzB,CAACmB,EAAQC,EAAQ,CAAEC,CAAK,EAAIf,EAAU,EAAK,EAEjD,OAAAC,EAAgBW,EAAOG,CAAK,EAC5Bb,EAAUa,CAAK,EAGbrB,EAAA,cAAC,OAAI,UAAU,iBACbA,EAAA,cAACE,EAAA,CACC,MAAOA,EAAK,OAAO,SACnB,UAAWO,EACT,uBACA,+BAA+BQ,CAAK,GACpC,CACE,CAAC,+BAA+BA,CAAK,WAAW,EAAGL,CACrD,CACF,GAECE,CACH,EACAd,EAAA,cAAC,OACC,UAAWS,EACT,yBACA,iCAAiCQ,CAAK,GACtC,CACE,CAAC,iCAAiCA,CAAK,WAAW,EAAGL,EACrD,CAAC,iCAAiCK,CAAK,UAAU,EAAGE,CACtD,CACF,EACA,IAAKD,GAELlB,EAAA,cAAC,OAAI,UAAU,0BACbA,EAAA,cAAC,UACC,KAAK,SACL,UAAWS,EACT,wBACA,gCAAgCQ,CAAK,GACrC,CACE,CAAC,gCAAgCA,CAAK,WAAW,EAAGL,EACpD,CAAC,gCAAgCK,CAAK,UAAU,EAAGE,CACrD,CACF,EACA,QAASC,EACT,SAAUR,EACV,4BAAyB,IAEzBZ,EAAA,cAAC,OAAI,UAAU,4BACbA,EAAA,cAACE,EAAA,CAAK,MAAOA,EAAK,OAAO,OAAQ,KAAMA,EAAK,MAAM,OAC/Cc,CACH,EAEAhB,EAAA,cAACE,EAAA,CAAK,KAAMA,EAAK,MAAM,OACpBa,GAGCf,EAAA,cAACE,EAAA,CACC,YAAY,OACZ,KAAMA,EAAK,MAAM,MACjB,UAAWO,EACT,6BACA,qCAAqCQ,CAAK,GAC1C,CACE,CAAC,qCAAqCA,CAAK,WAAW,EACpDL,CACJ,CACF,GAECD,CACH,CAEJ,CACF,EAEAX,EAAA,cAAC,OAAI,UAAU,uBACHA,EAAA,cAATmB,EAAUf,EAAgBC,EAAhB,IAAU,CACvB,CACF,CACF,EACAL,EAAA,cAACC,EAAAqB,EAAAC,EAAA,GACKV,GADL,CAEC,OAAQM,EACR,MAAOE,EACP,SAAUD,GACZ,CACF,CACF,CAEJ,EAEAV,EAAa,OAASP,EAEtB,IAAOqB,EAAQd",
|
|
6
6
|
"names": ["React", "FormContent", "Text", "themes", "ChevronUp", "ChevronDown", "useToggle", "useClickOutside", "useEscape", "classNames", "DropdownList", "description", "disabled", "formContentOptions", "label", "selectedOptions", "header", "theme", "modal", "isOpen", "toggle", "close", "__spreadProps", "__spreadValues", "dropdown_list_default"]
|
|
7
7
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
var w=Object.defineProperty,z=Object.defineProperties;var C=Object.getOwnPropertyDescriptors;var h=Object.getOwnPropertySymbols;var E=Object.prototype.hasOwnProperty,I=Object.prototype.propertyIsEnumerable;var N=(i,n,r)=>n in i?w(i,n,{enumerable:!0,configurable:!0,writable:!0,value:r}):i[n]=r,o=(i,n)=>{for(var r in n||(n={}))E.call(n,r)&&N(i,r,n[r]);if(h)for(var r of h(n))I.call(n,r)&&N(i,r,n[r]);return i},u=(i,n)=>z(i,C(n));import _ from"classnames";import e,{useState as k}from"react";import b from"../icons/24/arrow-down";import L from"../link-button";import s from"../text";import g from"../badge";import{Types as A}from"../badge/badge.types";import c from"../link";import O from"../collapse";const S=({actions:i,contentType:n="article",defaultOpen:r=!1,faq:d,icon:p,id:m,links:a,children:f,metadata:x,title:P,value:v})=>{const[t,y]=k(r),T=()=>y(!t);return e.createElement("div",{className:"expander__list-item",key:m,itemScope:d||void 0,itemProp:d?"mainEntity":void 0,itemType:d?"https://schema.org/Question":void 0},e.createElement("button",{"aria-controls":m,"aria-expanded":t,className:_("expander__trigger",{"expander__trigger--triggered":t,"expander__trigger--w-value":v}),onClick:T},p?e.createElement("div",{className:"expander__icon"},p):null,e.createElement("div",{className:"expander__trigger-title"},e.createElement(s,{elementName:"h3",itemProp:d?"name":void 0,tight:!0},P)),v?e.createElement(g,{content:{content:v,type:A.Numerical},variant:g.variants.secondary}):null,e.createElement("div",{className:_("expander__icon",{"expander__icon--flipped":t})},e.createElement(b,null))),e.createElement("div",{className:_("expander__drawer",{"expander__drawer--open":t}),id:m},e.createElement(O,{isOpen:t},e.createElement("div",{className:_("expander__content",{[`expander__content--${n}`]:n}),itemScope:d||void 0,itemProp:d?"acceptedAnswer":void 0,itemType:d?"https://schema.org/Answer":void 0},e.createElement("div",{className:"expander__children",itemProp:d?"text":void 0},f),i.length?e.createElement("div",{className:"expander__actions"},i.map(l=>e.createElement("div",{className:"expander__action",key:l.href},e.createElement(L,o({},l))))):null,x||a&&a.length?e.createElement("div",{className:"expander__metadata"},e.createElement("hr",{className:"expander__divider"}),e.createElement("div",{className:"expander__meta-content"},x?e.createElement("div",{className:"expander__meta-text"},e.createElement(s,{elementName:"span",size:s.sizes.small},x)):null,a&&a.length?e.createElement("div",{className:"expander__links"},a.map(l=>e.createElement("div",{className:"expander__link",key:l.href},e.createElement(c,u(o({},l),{size:c.sizes.small}))))):null)):null))))},B=({description:i,faq:n,itemRenderer:r,items:d,title:p})=>e.createElement("div",{className:"expander"},p||i?e.createElement("div",{className:"expander__header"},p?e.createElement(s,{elementName:"h2",size:s.sizes.headline2,theme:s.themes.emphasis,tight:!0},p):null,i?e.createElement(s,{size:s.sizes.basic},i):null):null,e.createElement("div",null,d.map(m=>e.createElement(S,u(o({key:m.listItemProps.id},m.listItemProps),{faq:n}),e.createElement(r,m.props)))));var U=B;export{U as default};
|
|
1
|
+
"use client";var w=Object.defineProperty,z=Object.defineProperties;var C=Object.getOwnPropertyDescriptors;var h=Object.getOwnPropertySymbols;var E=Object.prototype.hasOwnProperty,I=Object.prototype.propertyIsEnumerable;var N=(i,n,r)=>n in i?w(i,n,{enumerable:!0,configurable:!0,writable:!0,value:r}):i[n]=r,o=(i,n)=>{for(var r in n||(n={}))E.call(n,r)&&N(i,r,n[r]);if(h)for(var r of h(n))I.call(n,r)&&N(i,r,n[r]);return i},u=(i,n)=>z(i,C(n));import _ from"classnames";import e,{useState as k}from"react";import b from"../icons/24/arrow-down";import L from"../link-button";import s from"../text";import g from"../badge";import{Types as A}from"../badge/badge.types";import c from"../link";import O from"../collapse";const S=({actions:i,contentType:n="article",defaultOpen:r=!1,faq:d,icon:p,id:m,links:a,children:f,metadata:x,title:P,value:v})=>{const[t,y]=k(r),T=()=>y(!t);return e.createElement("div",{className:"expander__list-item",key:m,itemScope:d||void 0,itemProp:d?"mainEntity":void 0,itemType:d?"https://schema.org/Question":void 0},e.createElement("button",{"aria-controls":m,"aria-expanded":t,className:_("expander__trigger",{"expander__trigger--triggered":t,"expander__trigger--w-value":v}),onClick:T},p?e.createElement("div",{className:"expander__icon"},p):null,e.createElement("div",{className:"expander__trigger-title"},e.createElement(s,{elementName:"h3",itemProp:d?"name":void 0,tight:!0},P)),v?e.createElement(g,{content:{content:v,type:A.Numerical},variant:g.variants.secondary}):null,e.createElement("div",{className:_("expander__icon",{"expander__icon--flipped":t})},e.createElement(b,null))),e.createElement("div",{className:_("expander__drawer",{"expander__drawer--open":t}),id:m},e.createElement(O,{isOpen:t},e.createElement("div",{className:_("expander__content",{[`expander__content--${n}`]:n}),itemScope:d||void 0,itemProp:d?"acceptedAnswer":void 0,itemType:d?"https://schema.org/Answer":void 0},e.createElement("div",{className:"expander__children",itemProp:d?"text":void 0},f),i.length?e.createElement("div",{className:"expander__actions"},i.map(l=>e.createElement("div",{className:"expander__action",key:l.href},e.createElement(L,o({},l))))):null,x||a&&a.length?e.createElement("div",{className:"expander__metadata"},e.createElement("hr",{className:"expander__divider"}),e.createElement("div",{className:"expander__meta-content"},x?e.createElement("div",{className:"expander__meta-text"},e.createElement(s,{elementName:"span",size:s.sizes.small},x)):null,a&&a.length?e.createElement("div",{className:"expander__links"},a.map(l=>e.createElement("div",{className:"expander__link",key:l.href},e.createElement(c,u(o({},l),{size:c.sizes.small}))))):null)):null))))},B=({description:i,faq:n,itemRenderer:r,items:d,title:p})=>e.createElement("div",{className:"expander"},p||i?e.createElement("div",{className:"expander__header"},p?e.createElement(s,{elementName:"h2",size:s.sizes.headline2,theme:s.themes.emphasis,tight:!0},p):null,i?e.createElement(s,{size:s.sizes.basic},i):null):null,e.createElement("div",null,d.map(m=>e.createElement(S,u(o({key:m.listItemProps.id},m.listItemProps),{faq:n}),e.createElement(r,m.props)))));var U=B;export{U as default};
|
|
2
2
|
//# sourceMappingURL=expander.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../react/expander/expander.tsx"],
|
|
4
|
-
"sourcesContent": ["
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["'use client';\n\nimport cn from 'classnames';\nimport React, { useState } from 'react';\n\nimport ArrowDown from '../icons/24/arrow-down';\nimport LinkButton from '../link-button';\nimport Text from '../text';\n\nimport { type Expander as Props } from './expander.types';\nimport Badge from '../badge';\nimport { Types } from '../badge/badge.types';\nimport Link from '../link';\nimport Collapse from '../collapse';\n\nconst ExpanderListItem: React.FC<\n React.PropsWithChildren<Props<unknown>['items'][number]['listItemProps']>\n> = ({\n actions,\n contentType = 'article',\n defaultOpen = false,\n faq,\n icon,\n id,\n links,\n children,\n metadata,\n title,\n value,\n}) => {\n const [isOpen, setIsOpen] = useState(defaultOpen);\n\n const toggle = () => setIsOpen(!isOpen);\n\n return (\n <div\n className=\"expander__list-item\"\n key={id}\n itemScope={faq ? faq : undefined}\n itemProp={faq ? 'mainEntity' : undefined}\n itemType={faq ? 'https://schema.org/Question' : undefined}\n >\n <button\n aria-controls={id}\n aria-expanded={isOpen}\n className={cn('expander__trigger', {\n 'expander__trigger--triggered': isOpen,\n 'expander__trigger--w-value': value,\n })}\n onClick={toggle}\n >\n {icon ? <div className=\"expander__icon\">{icon}</div> : null}\n <div className=\"expander__trigger-title\">\n <Text elementName=\"h3\" itemProp={faq ? 'name' : undefined} tight>\n {title}\n </Text>\n </div>\n {value ? (\n <Badge\n content={{ content: value, type: Types.Numerical }}\n variant={Badge.variants.secondary}\n />\n ) : null}\n <div\n className={cn('expander__icon', {\n 'expander__icon--flipped': isOpen,\n })}\n >\n <ArrowDown />\n </div>\n </button>\n <div\n className={cn('expander__drawer', {\n 'expander__drawer--open': isOpen,\n })}\n id={id}\n >\n <Collapse isOpen={isOpen}>\n <div\n className={cn('expander__content', {\n [`expander__content--${contentType}`]: contentType,\n })}\n itemScope={faq ? faq : undefined}\n itemProp={faq ? 'acceptedAnswer' : undefined}\n itemType={faq ? 'https://schema.org/Answer' : undefined}\n >\n <div\n className=\"expander__children\"\n itemProp={faq ? 'text' : undefined}\n >\n {children}\n </div>\n {actions.length ? (\n <div className=\"expander__actions\">\n {actions.map(action => (\n <div className=\"expander__action\" key={action.href}>\n <LinkButton {...action} />\n </div>\n ))}\n </div>\n ) : null}\n {metadata || (links && links.length) ? (\n <div className=\"expander__metadata\">\n <hr className=\"expander__divider\" />\n <div className=\"expander__meta-content\">\n {metadata ? (\n <div className=\"expander__meta-text\">\n <Text elementName=\"span\" size={Text.sizes.small}>\n {metadata}\n </Text>\n </div>\n ) : null}\n {links && links.length ? (\n <div className=\"expander__links\">\n {links.map(link => (\n <div className=\"expander__link\" key={link.href}>\n <Link {...link} size={Link.sizes.small} />\n </div>\n ))}\n </div>\n ) : null}\n </div>\n </div>\n ) : null}\n </div>\n </Collapse>\n </div>\n </div>\n );\n};\n\n// eslint-disable-next-line @typescript-eslint/no-empty-object-type\nconst Expander = <T extends {}>({\n description,\n faq,\n itemRenderer,\n items,\n title,\n}: Props<T> & { itemRenderer: React.FC<T> }) => (\n <div className=\"expander\">\n {title || description ? (\n <div className=\"expander__header\">\n {title ? (\n <Text\n elementName=\"h2\"\n size={Text.sizes.headline2}\n theme={Text.themes.emphasis}\n tight\n >\n {title}\n </Text>\n ) : null}\n {description ? (\n <Text size={Text.sizes.basic}>{description}</Text>\n ) : null}\n </div>\n ) : null}\n <div>\n {items.map(item => (\n <ExpanderListItem\n key={item.listItemProps.id}\n {...item.listItemProps}\n faq={faq}\n >\n {React.createElement(itemRenderer, item.props)}\n </ExpanderListItem>\n ))}\n </div>\n </div>\n);\n\nexport default Expander;\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["cn", "React", "useState", "ArrowDown", "LinkButton", "Text", "Badge", "Types", "Link", "Collapse", "ExpanderListItem", "actions", "contentType", "defaultOpen", "faq", "icon", "id", "links", "children", "metadata", "title", "value", "isOpen", "setIsOpen", "toggle", "action", "__spreadValues", "link", "__spreadProps", "Expander", "description", "itemRenderer", "items", "item", "expander_default"]
|
|
7
7
|
}
|
package/react/filter/filter.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
var h=Object.defineProperty,
|
|
1
|
+
"use client";var h=Object.defineProperty,c=Object.defineProperties;var g=Object.getOwnPropertyDescriptors;var f=Object.getOwnPropertySymbols;var b=Object.prototype.hasOwnProperty,C=Object.prototype.propertyIsEnumerable;var p=(i,s,e)=>s in i?h(i,s,{enumerable:!0,configurable:!0,writable:!0,value:e}):i[s]=e,m=(i,s)=>{for(var e in s||(s={}))b.call(s,e)&&p(i,e,s[e]);if(f)for(var e of f(s))C.call(s,e)&&p(i,e,s[e]);return i},a=(i,s)=>c(i,g(s));import*as o from"react";import N from"classnames";import w from"../hooks/use-toggle";import x from"../hooks/use-click-outside";import z from"../hooks/use-escape";import{useIsMounted as F}from"../hooks/use-is-mounted";import T from"../form-content";import k from"../icons/24/arrow-up";import u from"../icons/24/arrow-down";import t from"../text";const D=({formContentOptions:i,selectedOptionsCount:s,testTags:e,title:v})=>{const _=F(),n=o.useRef(null),[l,d,,r]=w(!1);return x(n,r),z(r),o.createElement("div",m({className:N("filter",{"filter--clicked":l}),ref:n},e),_?o.createElement("div",{className:"filter__buttons"},o.createElement("button",{type:"button",className:"filter__button",onClick:d,"data-test-dropdown-button":!0},o.createElement(t,{size:t.sizes.basic,theme:t.themes.emphasis,className:"filter__button-text"},v),o.createElement("div",{className:"filter__button-inner-right"},s?o.createElement(t,{className:"filter__selected-options",theme:t.themes.emphasis,size:t.sizes.small},s):null,o.createElement(l?k:u,null)))):o.createElement("div",{className:"filter__loading-button"},o.createElement("div",{className:"filter__loading-placeholder"},o.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:"112",height:"22",viewBox:"0 0 112 22",fill:"none"},o.createElement("path",{d:"M0 4.5C0 2.29086 1.79086 0.5 4 0.5H108C110.209 0.5 112 2.29086 112 4.5V17.5C112 19.7091 110.209 21.5 108 21.5H4C1.79086 21.5 0 19.7091 0 17.5V4.5Z",fill:"#DCDEE0"}))),o.createElement("div",{className:"filter__loading-icon"},o.createElement(u,null))),o.createElement(T,a(m({},i),{isOpen:l,close:r,onSubmit:d})))};var j=D;export{j as default};
|
|
2
2
|
//# sourceMappingURL=filter.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../react/filter/filter.tsx"],
|
|
4
|
-
"sourcesContent": ["
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["'use client';\n\nimport * as React from 'react';\nimport classNames from 'classnames';\n\nimport useToggle from '../hooks/use-toggle';\nimport useClickOutside from '../hooks/use-click-outside';\nimport useEscape from '../hooks/use-escape';\nimport { useIsMounted } from '../hooks/use-is-mounted';\nimport FormContent from '../form-content';\nimport ChevronUp from '../icons/24/arrow-up';\nimport ChevronDown from '../icons/24/arrow-down';\nimport Text from '../text';\n\nimport { Filter as Props } from './filter.types';\n\nconst Filter: React.FunctionComponent<Props> = ({\n formContentOptions,\n selectedOptionsCount,\n testTags,\n title,\n}) => {\n const isMounted = useIsMounted();\n const modal = React.useRef(null);\n const [isOpen, toggle, , close] = useToggle(false);\n\n useClickOutside(modal, close);\n useEscape(close);\n\n return (\n <div\n className={classNames('filter', {\n 'filter--clicked': isOpen,\n })}\n ref={modal}\n {...testTags}\n >\n {isMounted ? (\n <div className=\"filter__buttons\">\n <button\n type=\"button\"\n className=\"filter__button\"\n onClick={toggle}\n data-test-dropdown-button\n >\n <Text\n size={Text.sizes.basic}\n theme={Text.themes.emphasis}\n className=\"filter__button-text\"\n >\n {title}\n </Text>\n\n <div className=\"filter__button-inner-right\">\n {selectedOptionsCount ? (\n <Text\n className=\"filter__selected-options\"\n theme={Text.themes.emphasis}\n size={Text.sizes.small}\n >\n {selectedOptionsCount}\n </Text>\n ) : null}\n\n {isOpen ? <ChevronUp /> : <ChevronDown />}\n </div>\n </button>\n </div>\n ) : (\n <div className=\"filter__loading-button\">\n <div className=\"filter__loading-placeholder\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"112\"\n height=\"22\"\n viewBox=\"0 0 112 22\"\n fill=\"none\"\n >\n <path\n d=\"M0 4.5C0 2.29086 1.79086 0.5 4 0.5H108C110.209 0.5 112 2.29086 112 4.5V17.5C112 19.7091 110.209 21.5 108 21.5H4C1.79086 21.5 0 19.7091 0 17.5V4.5Z\"\n fill=\"#DCDEE0\"\n />\n </svg>\n </div>\n <div className=\"filter__loading-icon\">\n <ChevronDown />\n </div>\n </div>\n )}\n\n <FormContent\n {...formContentOptions}\n isOpen={isOpen}\n close={close}\n onSubmit={toggle}\n />\n </div>\n );\n};\n\nexport default Filter;\n"],
|
|
5
|
+
"mappings": "0bAEA,UAAYA,MAAW,QACvB,OAAOC,MAAgB,aAEvB,OAAOC,MAAe,sBACtB,OAAOC,MAAqB,6BAC5B,OAAOC,MAAe,sBACtB,OAAS,gBAAAC,MAAoB,0BAC7B,OAAOC,MAAiB,kBACxB,OAAOC,MAAe,uBACtB,OAAOC,MAAiB,yBACxB,OAAOC,MAAU,UAIjB,MAAMC,EAAyC,CAAC,CAC9C,mBAAAC,EACA,qBAAAC,EACA,SAAAC,EACA,MAAAC,CACF,IAAM,CACJ,MAAMC,EAAYV,EAAa,EACzBW,EAAQhB,EAAM,OAAO,IAAI,EACzB,CAACiB,EAAQC,EAAQ,CAAEC,CAAK,EAAIjB,EAAU,EAAK,EAEjD,OAAAC,EAAgBa,EAAOG,CAAK,EAC5Bf,EAAUe,CAAK,EAGbnB,EAAA,cAAC,MAAAoB,EAAA,CACC,UAAWnB,EAAW,SAAU,CAC9B,kBAAmBgB,CACrB,CAAC,EACD,IAAKD,GACDH,GAEHE,EACCf,EAAA,cAAC,OAAI,UAAU,mBACbA,EAAA,cAAC,UACC,KAAK,SACL,UAAU,iBACV,QAASkB,EACT,4BAAyB,IAEzBlB,EAAA,cAACS,EAAA,CACC,KAAMA,EAAK,MAAM,MACjB,MAAOA,EAAK,OAAO,SACnB,UAAU,uBAETK,CACH,EAEAd,EAAA,cAAC,OAAI,UAAU,8BACZY,EACCZ,EAAA,cAACS,EAAA,CACC,UAAU,2BACV,MAAOA,EAAK,OAAO,SACnB,KAAMA,EAAK,MAAM,OAEhBG,CACH,EACE,KAEMZ,EAAA,cAATiB,EAAUV,EAAgBC,EAAhB,IAAU,CACvB,CACF,CACF,EAEAR,EAAA,cAAC,OAAI,UAAU,0BACbA,EAAA,cAAC,OAAI,UAAU,+BACbA,EAAA,cAAC,OACC,MAAM,6BACN,MAAM,MACN,OAAO,KACP,QAAQ,aACR,KAAK,QAELA,EAAA,cAAC,QACC,EAAE,qJACF,KAAK,UACP,CACF,CACF,EACAA,EAAA,cAAC,OAAI,UAAU,wBACbA,EAAA,cAACQ,EAAA,IAAY,CACf,CACF,EAGFR,EAAA,cAACM,EAAAe,EAAAD,EAAA,GACKT,GADL,CAEC,OAAQM,EACR,MAAOE,EACP,SAAUD,GACZ,CACF,CAEJ,EAEA,IAAOI,EAAQZ",
|
|
6
6
|
"names": ["React", "classNames", "useToggle", "useClickOutside", "useEscape", "useIsMounted", "FormContent", "ChevronUp", "ChevronDown", "Text", "Filter", "formContentOptions", "selectedOptionsCount", "testTags", "title", "isMounted", "modal", "isOpen", "toggle", "close", "__spreadValues", "__spreadProps", "filter_default"]
|
|
7
7
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
var H=Object.defineProperty,I=Object.defineProperties;var U=Object.getOwnPropertyDescriptors;var g=Object.getOwnPropertySymbols;var F=Object.prototype.hasOwnProperty,M=Object.prototype.propertyIsEnumerable;var N=(n,o,t)=>o in n?H(n,o,{enumerable:!0,configurable:!0,writable:!0,value:t}):n[o]=t,p=(n,o)=>{for(var t in o||(o={}))F.call(o,t)&&N(n,t,o[t]);if(g)for(var t of g(o))M.call(o,t)&&N(n,t,o[t]);return n},k=(n,o)=>I(n,U(o));import*as e from"react";import m from"../text";import y from"../checkbox";import W from"../icons/24/arrow-right";import j from"../icons/24/arrow-up";import q from"../visually-hidden";import{mod as v}from"../add-bem-modifiers";import B from"../collapse";const D=({currentlySelectedValues:n=[],id:o,isSearching:t,options:f,searchResults:b=[],selectAll:
|
|
1
|
+
"use client";var H=Object.defineProperty,I=Object.defineProperties;var U=Object.getOwnPropertyDescriptors;var g=Object.getOwnPropertySymbols;var F=Object.prototype.hasOwnProperty,M=Object.prototype.propertyIsEnumerable;var N=(n,o,t)=>o in n?H(n,o,{enumerable:!0,configurable:!0,writable:!0,value:t}):n[o]=t,p=(n,o)=>{for(var t in o||(o={}))F.call(o,t)&&N(n,t,o[t]);if(g)for(var t of g(o))M.call(o,t)&&N(n,t,o[t]);return n},k=(n,o)=>I(n,U(o));import*as e from"react";import m from"../text";import y from"../checkbox";import W from"../icons/24/arrow-right";import j from"../icons/24/arrow-up";import q from"../visually-hidden";import{mod as v}from"../add-bem-modifiers";import B from"../collapse";const D=({currentlySelectedValues:n=[],id:o,isSearching:t,options:f,searchResults:b=[],selectAll:l,selectAllLabel:x,setMultipleSelectedValues:w=()=>{},setSelectedValue:z=()=>{},shouldShowItems:O=!0,removeAllValues:L=()=>{}})=>{const a=e.useMemo(()=>!!l,[l]),[r]=e.useState(f.filter(s=>!s.disabled)),[h,i]=e.useState(!!a),P=s=>{z(o,s)},T=()=>{n.length!==r.length?w(o,r.map(s=>s.value)):L(o)};e.useEffect(()=>i(t?!0:!a),[a,t,b]);const _=f.every(s=>s.disabled),E=n.length>0;return e.createElement("fieldset",{className:"form-content__fieldset"},a&&e.createElement("div",{className:v("form-content__chevron-button-wrapper",{hidden:t})},l?e.createElement("div",{className:"form-content__select-all"},e.createElement(y,k(p({},l),{isLabelVisible:!1,checked:r.length>0&&n.length===r.length,onChange:T,"data-test-select-all":!0,disabled:_}))):null,e.createElement("button",{className:"form-content__chevron-button",onClick:()=>i(s=>!s),type:"button"},e.createElement(m,{elementName:"span",className:v("form-content__select-all-label",{disabled:_}),size:m.sizes.basic},x),e.createElement("div",{className:"form-content__checkbox-category-info-wrapper"},E?e.createElement(m,{className:"form-content__checkbox-category-number",size:m.sizes.interface},n.length):void 0,h?e.createElement("div",{className:"form-content__checkbox-category-icon"},e.createElement(j,null)):e.createElement("div",{className:"form-content__checkbox-category-icon"},e.createElement(W,null))))),e.createElement(B,{duration:300,animateChildren:!!a,isOpen:h},e.createElement("fieldset",{className:"form-content__fieldset"},f.map(s=>{const c=t?b.find(u=>u.key.toLowerCase()===s.value.toLowerCase()):void 0,d=n.includes(s.value),C=e.createElement("div",{key:s.value,className:v("form-content__checkbox-button",{nested:!t&&a})},e.createElement(y,p({onChange:u=>P(u.target.value),checked:d,isUnderlined:!0},s)));if(!(!d&&!c&&!O)){if(d&&t&&!c)return e.createElement(q,{key:s.value},C);if(!(!d&&t&&!c))return C}}))))};var S=D;export{S as default};
|
|
2
2
|
//# sourceMappingURL=checkbox-category.js.map
|