@sats-group/ui-lib 81.0.0 → 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/text-input/text-input.scss +3 -9
- package/react/toggle/toggle.js +1 -1
- package/react/toggle/toggle.js.map +2 -2
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../react/form-content/checkbox-category.tsx"],
|
|
4
|
-
"sourcesContent": ["
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["'use client';\n\nimport * as React from 'react';\nimport Text from '../text';\nimport Checkbox from '../checkbox';\n\nimport ChevronRight from '../icons/24/arrow-right';\nimport ChevronUp from '../icons/24/arrow-up';\n\nimport { CheckboxCategory as Props } from './form-content.checkbox-list.types';\nimport VisuallyHidden from '../visually-hidden';\nimport { mod } from '../add-bem-modifiers';\nimport Collapse from '../collapse';\n\nconst CheckboxCategory: React.FC<React.PropsWithChildren<Props>> = ({\n currentlySelectedValues = [],\n id,\n isSearching,\n options,\n searchResults = [],\n selectAll,\n selectAllLabel,\n setMultipleSelectedValues = () => {},\n setSelectedValue = () => {},\n shouldShowItems = true,\n removeAllValues = () => {},\n}) => {\n const isExpandable = React.useMemo(\n () => (selectAll ? true : false),\n [selectAll],\n );\n const [availableOptions] = React.useState(\n options.filter(button => !button.disabled),\n );\n\n const [isOpen, setIsOpen] = React.useState(isExpandable ? true : false);\n\n const handleChange = (value: string) => {\n setSelectedValue(id, value);\n };\n\n const handleSelectAll = () => {\n if (currentlySelectedValues.length !== availableOptions.length) {\n setMultipleSelectedValues(\n id,\n availableOptions.map(button => button.value),\n );\n } else {\n removeAllValues(id);\n }\n };\n\n React.useEffect(\n () =>\n isSearching\n ? setIsOpen(true)\n : isExpandable\n ? setIsOpen(false)\n : setIsOpen(true),\n [isExpandable, isSearching, searchResults],\n );\n\n const disableCategory = options.every(checkbox => checkbox.disabled);\n\n const hasSelectedValues = currentlySelectedValues.length > 0;\n\n return (\n <fieldset className=\"form-content__fieldset\">\n {isExpandable && (\n <div\n className={mod('form-content__chevron-button-wrapper', {\n hidden: isSearching,\n })}\n >\n {selectAll ? (\n <div className=\"form-content__select-all\">\n <Checkbox\n {...selectAll}\n isLabelVisible={false}\n checked={\n availableOptions.length > 0 &&\n currentlySelectedValues.length === availableOptions.length\n }\n onChange={handleSelectAll}\n data-test-select-all\n disabled={disableCategory}\n />\n </div>\n ) : null}\n <button\n className=\"form-content__chevron-button\"\n onClick={() => setIsOpen(currentState => !currentState)}\n type=\"button\"\n >\n <Text\n elementName=\"span\"\n className={mod('form-content__select-all-label', {\n disabled: disableCategory,\n })}\n size={Text.sizes.basic}\n >\n {selectAllLabel}\n </Text>\n <div className=\"form-content__checkbox-category-info-wrapper\">\n {hasSelectedValues ? (\n <Text\n className=\"form-content__checkbox-category-number\"\n size={Text.sizes.interface}\n >\n {currentlySelectedValues.length}\n </Text>\n ) : undefined}\n {isOpen ? (\n <div className=\"form-content__checkbox-category-icon\">\n <ChevronUp />\n </div>\n ) : (\n <div className=\"form-content__checkbox-category-icon\">\n <ChevronRight />\n </div>\n )}\n </div>\n </button>\n </div>\n )}\n\n <Collapse\n duration={300}\n animateChildren={isExpandable ? true : false}\n isOpen={isOpen}\n >\n {\n <fieldset className=\"form-content__fieldset\">\n {options.map(checkbox => {\n const isInSearchResults = isSearching\n ? searchResults.find(\n item =>\n item.key.toLowerCase() === checkbox.value.toLowerCase(),\n )\n : undefined;\n\n const isSelected = currentlySelectedValues.includes(\n checkbox.value,\n );\n\n const node = (\n <div\n key={checkbox.value}\n className={mod('form-content__checkbox-button', {\n nested: !isSearching && isExpandable,\n })}\n >\n <Checkbox\n onChange={e => handleChange(e.target.value)}\n checked={isSelected}\n isUnderlined={true}\n {...checkbox}\n />\n </div>\n );\n\n if (!isSelected && !isInSearchResults && !shouldShowItems) {\n return;\n }\n\n if (isSelected && isSearching && !isInSearchResults) {\n return (\n <VisuallyHidden key={checkbox.value}>{node}</VisuallyHidden>\n );\n }\n\n if (!isSelected && isSearching && !isInSearchResults) {\n return;\n }\n\n return node;\n })}\n </fieldset>\n }\n </Collapse>\n </fieldset>\n );\n};\n\nexport default CheckboxCategory;\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["React", "Text", "Checkbox", "ChevronRight", "ChevronUp", "VisuallyHidden", "mod", "Collapse", "CheckboxCategory", "currentlySelectedValues", "id", "isSearching", "options", "searchResults", "selectAll", "selectAllLabel", "setMultipleSelectedValues", "setSelectedValue", "shouldShowItems", "removeAllValues", "isExpandable", "availableOptions", "button", "isOpen", "setIsOpen", "handleChange", "value", "handleSelectAll", "disableCategory", "checkbox", "hasSelectedValues", "__spreadProps", "__spreadValues", "currentState", "isInSearchResults", "item", "isSelected", "node", "e", "checkbox_category_default"]
|
|
7
7
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
var P=Object.defineProperty,F=Object.defineProperties;var N=Object.getOwnPropertyDescriptors;var V=Object.getOwnPropertySymbols;var M=Object.prototype.hasOwnProperty,v=Object.prototype.propertyIsEnumerable;var b=(n,s,t)=>s in n?P(n,s,{enumerable:!0,configurable:!0,writable:!0,value:t}):n[s]=t,h=(n,s)=>{for(var t in s||(s={}))M.call(s,t)&&b(n,t,s[t]);if(V)for(var t of V(s))v.call(s,t)&&b(n,t,s[t]);return n},S=(n,s)=>F(n,N(s));import*as r from"react";import p from"../text";import A from"./checkbox-category";import{mod as L}from"../add-bem-modifiers";import g from"./form-content.search";const B=n=>{const[s,t]=r.useState({}),{content:f,emptySearchResultDescription:x,emptySearchResultText:C}=n,[o,j]=r.useState(""),[d,O]=r.useState(),T=(l,e)=>{var
|
|
1
|
+
"use client";var P=Object.defineProperty,F=Object.defineProperties;var N=Object.getOwnPropertyDescriptors;var V=Object.getOwnPropertySymbols;var M=Object.prototype.hasOwnProperty,v=Object.prototype.propertyIsEnumerable;var b=(n,s,t)=>s in n?P(n,s,{enumerable:!0,configurable:!0,writable:!0,value:t}):n[s]=t,h=(n,s)=>{for(var t in s||(s={}))M.call(s,t)&&b(n,t,s[t]);if(V)for(var t of V(s))v.call(s,t)&&b(n,t,s[t]);return n},S=(n,s)=>F(n,N(s));import*as r from"react";import p from"../text";import A from"./checkbox-category";import{mod as L}from"../add-bem-modifiers";import g from"./form-content.search";const B=n=>{const[s,t]=r.useState({}),{content:f,emptySearchResultDescription:x,emptySearchResultText:C}=n,[o,j]=r.useState(""),[d,O]=r.useState(),T=(l,e)=>{var i;(i=s[l])!=null&&i.includes(e)?t(m=>{const a=Object.entries(m).map(([c,u])=>[c,u.filter(E=>E!==e)]);return Object.fromEntries(a)}):t(m=>{const a=Object.entries(m).map(([c,u=[]])=>l===c?[c,[...u,e]]:[c,u]);return Object.fromEntries(a)})},_=(l,e)=>{t(i=>S(h({},i),{[l]:e}))},k=l=>{t(e=>{const i=e[l]||[],m=Object.entries(e).map(([a,c])=>[a,c.filter(u=>!i.includes(u))]);return Object.fromEntries(m)})};return r.useEffect(()=>{const l=f.flatMap(({categories:e})=>e).filter(e=>e==null?void 0:e.id).map(e=>[e==null?void 0:e.id,e==null?void 0:e.selectedValues]);t(Object.fromEntries(l))},[f]),r.createElement("div",null,"searchProps"in n?r.createElement(g,S(h({},n.searchProps),{searchResult:O,searchTerm:j})):void 0,o.length>0&&(d==null?void 0:d.length)===0&&r.createElement("div",{className:"form-content__search-no-results"},r.createElement(p,{className:"form-content__search-no-results-text",elementName:"span",theme:p.themes.emphasis},C),r.createElement("span",null,x)),f.map(({categories:l=[],key:e,header:i})=>r.createElement(r.Fragment,{key:e},i&&o.length===0?r.createElement(p,{className:L("form-content__content-title",{hidden:o.length>0}),theme:p.themes.emphasis},i):void 0,l.map(m=>r.createElement(A,h({key:m.id,searchResults:d,isSearching:o.length>0,currentlySelectedValues:s[m.id],setSelectedValue:T,setMultipleSelectedValues:_,removeAllValues:k},m))))))};var K=B;export{K as default};
|
|
2
2
|
//# sourceMappingURL=form-content.checkbox-list.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../react/form-content/form-content.checkbox-list.tsx"],
|
|
4
|
-
"sourcesContent": ["
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["'use client';\n\nimport * as React from 'react';\nimport Text from '../text';\n\nimport CheckboxCategory from './checkbox-category';\n\nimport { CheckboxList as Props } from './form-content.checkbox-list.types';\nimport { SearchItem } from './form-content.types';\nimport { mod } from '../add-bem-modifiers';\nimport FormContentSearch from './form-content.search';\n\nconst CheckboxList: React.FC<React.PropsWithChildren<Props>> = props => {\n const [currentlySelectedValues, setCurrentlySelectedValues] = React.useState<\n Record<string, string[]>\n >({});\n const { content, emptySearchResultDescription, emptySearchResultText } =\n props;\n\n const [searchTerm, setSearchTerm] = React.useState('');\n const [searchResult, setSearchResult] = React.useState<SearchItem[]>();\n\n const updateCurrentlySelectedValues = (id: string, value: string) => {\n if (currentlySelectedValues[id]?.includes(value)) {\n setCurrentlySelectedValues(prevState => {\n const updatedValues = Object.entries(prevState).map(([id, values]) => [\n id,\n values.filter(option => option !== value),\n ]);\n return Object.fromEntries(updatedValues);\n });\n } else {\n setCurrentlySelectedValues(prevState => {\n const updatedValues = Object.entries(prevState).map(\n ([filterGroupId, values = []]) => {\n if (id === filterGroupId) {\n return [filterGroupId, [...values, value]];\n }\n\n return [filterGroupId, values];\n },\n );\n return Object.fromEntries(updatedValues);\n });\n }\n };\n\n const updateMultipleSelectedValues = (id: string, values: string[]) => {\n setCurrentlySelectedValues(prevState => ({\n ...prevState,\n [id]: values,\n }));\n };\n\n const removeAllValuesById = (id: string) => {\n setCurrentlySelectedValues(prevState => {\n const selectedValues = prevState[id] || [];\n const updatedValues = Object.entries(prevState).map(([id, values]) => [\n id,\n values.filter(option => !selectedValues.includes(option)),\n ]);\n return Object.fromEntries(updatedValues);\n });\n };\n\n React.useEffect(() => {\n const selectedValues = content\n .flatMap(({ categories }) => categories)\n .filter(category => category?.id)\n .map(category => [category?.id, category?.selectedValues]);\n setCurrentlySelectedValues(Object.fromEntries(selectedValues));\n }, [content]);\n\n return (\n <div>\n {'searchProps' in props ? (\n <FormContentSearch\n {...props.searchProps}\n searchResult={setSearchResult}\n searchTerm={setSearchTerm}\n />\n ) : undefined}\n\n {searchTerm.length > 0 && searchResult?.length === 0 && (\n <div className=\"form-content__search-no-results\">\n <Text\n className=\"form-content__search-no-results-text\"\n elementName=\"span\"\n theme={Text.themes.emphasis}\n >\n {emptySearchResultText}\n </Text>\n <span>{emptySearchResultDescription}</span>\n </div>\n )}\n\n {content.map(({ categories = [], key, header }) => (\n <React.Fragment key={key}>\n {header && searchTerm.length === 0 ? (\n <Text\n className={mod('form-content__content-title', {\n hidden: searchTerm.length > 0,\n })}\n theme={Text.themes.emphasis}\n >\n {header}\n </Text>\n ) : undefined}\n\n {categories.map(category => (\n <CheckboxCategory\n key={category.id}\n searchResults={searchResult}\n isSearching={searchTerm.length > 0}\n currentlySelectedValues={currentlySelectedValues[category.id]}\n setSelectedValue={updateCurrentlySelectedValues}\n setMultipleSelectedValues={updateMultipleSelectedValues}\n removeAllValues={removeAllValuesById}\n {...category}\n />\n ))}\n </React.Fragment>\n ))}\n </div>\n );\n};\n\nexport default CheckboxList;\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["React", "Text", "CheckboxCategory", "mod", "FormContentSearch", "CheckboxList", "props", "currentlySelectedValues", "setCurrentlySelectedValues", "content", "emptySearchResultDescription", "emptySearchResultText", "searchTerm", "setSearchTerm", "searchResult", "setSearchResult", "updateCurrentlySelectedValues", "id", "value", "_a", "prevState", "updatedValues", "values", "option", "filterGroupId", "updateMultipleSelectedValues", "__spreadProps", "__spreadValues", "removeAllValuesById", "selectedValues", "categories", "category", "key", "header", "form_content_checkbox_list_default"]
|
|
7
7
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
var v=Object.defineProperty,T=Object.defineProperties;var g=Object.getOwnPropertyDescriptors;var d=Object.getOwnPropertySymbols;var C=Object.prototype.hasOwnProperty,L=Object.prototype.propertyIsEnumerable;var h=(t,e,r)=>e in t?v(t,e,{enumerable:!0,configurable:!0,writable:!0,value:r}):t[e]=r,i=(t,e)=>{for(var r in e||(e={}))C.call(e,r)&&h(t,r,e[r]);if(d)for(var r of d(e))L.call(e,r)&&h(t,r,e[r]);return t},m=(t,e)=>T(t,g(e));import*as s from"react";import P from"../radio";import u from"../text";import _ from"./form-content.search";import k from"classnames";const x=t=>{const[e,r]=s.useState(""),[n,
|
|
1
|
+
"use client";var v=Object.defineProperty,T=Object.defineProperties;var g=Object.getOwnPropertyDescriptors;var d=Object.getOwnPropertySymbols;var C=Object.prototype.hasOwnProperty,L=Object.prototype.propertyIsEnumerable;var h=(t,e,r)=>e in t?v(t,e,{enumerable:!0,configurable:!0,writable:!0,value:r}):t[e]=r,i=(t,e)=>{for(var r in e||(e={}))C.call(e,r)&&h(t,r,e[r]);if(d)for(var r of d(e))L.call(e,r)&&h(t,r,e[r]);return t},m=(t,e)=>T(t,g(e));import*as s from"react";import P from"../radio";import u from"../text";import _ from"./form-content.search";import k from"classnames";const x=t=>{const[e,r]=s.useState(""),[n,l]=s.useState();return s.createElement("div",null,"searchProps"in t?s.createElement(_,m(i({},t.searchProps),{searchResult:l,searchTerm:r})):void 0,t.categories.map((o,c)=>s.createElement("div",{key:c},o.header&&o.options.length>0&&e.length===0?s.createElement(u,{className:k("form-content__group-title",{hidden:e.length>0}),theme:u.themes.emphasis},o.header):void 0,o.options.map((a,f)=>{const p=e.length>0?n==null?void 0:n.find(S=>S.key.toLowerCase()===a.value.toLowerCase()):void 0;if(!(e.length>0&&!p))return s.createElement("div",{key:f,className:"form-content__radio-button"},s.createElement(P,m(i({},a),{isUnderline:!0})))}))))};var q=x;export{q as default};
|
|
2
2
|
//# sourceMappingURL=form-content.radio-list.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../react/form-content/form-content.radio-list.tsx"],
|
|
4
|
-
"sourcesContent": ["
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["'use client';\n\nimport * as React from 'react';\nimport Radio from '../radio';\nimport Text from '../text';\nimport FormContentSearch from './form-content.search';\n\nimport { RadioList as Props, SearchItem } from './form-content.types';\nimport classNames from 'classnames';\n\nconst RadioList: React.FC<Props> = props => {\n const [searchTerm, setSearchTerm] = React.useState('');\n const [searchResult, setSearchResult] = React.useState<SearchItem[]>();\n return (\n <div>\n {'searchProps' in props ? (\n <FormContentSearch\n {...props.searchProps}\n searchResult={setSearchResult}\n searchTerm={setSearchTerm}\n />\n ) : undefined}\n {props.categories.map((category, categoryIndex) => (\n <div key={categoryIndex}>\n {category.header &&\n category.options.length > 0 &&\n searchTerm.length === 0 ? (\n <Text\n className={classNames('form-content__group-title', {\n hidden: searchTerm.length > 0,\n })}\n theme={Text.themes.emphasis}\n >\n {category.header}\n </Text>\n ) : undefined}\n {category.options.map((radio, i) => {\n const isInSearchResults =\n searchTerm.length > 0\n ? searchResult?.find(\n item =>\n item.key.toLowerCase() === radio.value.toLowerCase(),\n )\n : undefined;\n\n if (searchTerm.length > 0 && !isInSearchResults) return;\n\n return (\n <div key={i} className=\"form-content__radio-button\">\n <Radio {...radio} isUnderline={true} />\n </div>\n );\n })}\n </div>\n ))}\n </div>\n );\n};\n\nexport default RadioList;\n"],
|
|
5
|
+
"mappings": "0bAEA,UAAYA,MAAW,QACvB,OAAOC,MAAW,WAClB,OAAOC,MAAU,UACjB,OAAOC,MAAuB,wBAG9B,OAAOC,MAAgB,aAEvB,MAAMC,EAA6BC,GAAS,CAC1C,KAAM,CAACC,EAAYC,CAAa,EAAIR,EAAM,SAAS,EAAE,EAC/C,CAACS,EAAcC,CAAe,EAAIV,EAAM,SAAuB,EACrE,OACEA,EAAA,cAAC,WACE,gBAAiBM,EAChBN,EAAA,cAACG,EAAAQ,EAAAC,EAAA,GACKN,EAAM,aADX,CAEC,aAAcI,EACd,WAAYF,GACd,EACE,OACHF,EAAM,WAAW,IAAI,CAACO,EAAUC,IAC/Bd,EAAA,cAAC,OAAI,IAAKc,GACPD,EAAS,QACVA,EAAS,QAAQ,OAAS,GAC1BN,EAAW,SAAW,EACpBP,EAAA,cAACE,EAAA,CACC,UAAWE,EAAW,4BAA6B,CACjD,OAAQG,EAAW,OAAS,CAC9B,CAAC,EACD,MAAOL,EAAK,OAAO,UAElBW,EAAS,MACZ,EACE,OACHA,EAAS,QAAQ,IAAI,CAACE,EAAOC,IAAM,CAClC,MAAMC,EACJV,EAAW,OAAS,EAChBE,GAAA,YAAAA,EAAc,KACZS,GACEA,EAAK,IAAI,YAAY,IAAMH,EAAM,MAAM,YAAY,GAEvD,OAEN,GAAI,EAAAR,EAAW,OAAS,GAAK,CAACU,GAE9B,OACEjB,EAAA,cAAC,OAAI,IAAKgB,EAAG,UAAU,8BACrBhB,EAAA,cAACC,EAAAU,EAAAC,EAAA,GAAUG,GAAV,CAAiB,YAAa,IAAM,CACvC,CAEJ,CAAC,CACH,CACD,CACH,CAEJ,EAEA,IAAOI,EAAQd",
|
|
6
6
|
"names": ["React", "Radio", "Text", "FormContentSearch", "classNames", "RadioList", "props", "searchTerm", "setSearchTerm", "searchResult", "setSearchResult", "__spreadProps", "__spreadValues", "category", "categoryIndex", "radio", "i", "isInSearchResults", "item", "form_content_radio_list_default"]
|
|
7
7
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
var d=Object.defineProperty,g=Object.defineProperties;var C=Object.getOwnPropertyDescriptors;var a=Object.getOwnPropertySymbols;var b=Object.prototype.hasOwnProperty,v=Object.prototype.propertyIsEnumerable;var m=(s,e,r)=>e in s?d(s,e,{enumerable:!0,configurable:!0,writable:!0,value:r}):s[e]=r,i=(s,e)=>{for(var r in e||(e={}))b.call(e,r)&&m(s,r,e[r]);if(a)for(var r of a(e))v.call(e,r)&&m(s,r,e[r]);return s},
|
|
1
|
+
"use client";var d=Object.defineProperty,g=Object.defineProperties;var C=Object.getOwnPropertyDescriptors;var a=Object.getOwnPropertySymbols;var b=Object.prototype.hasOwnProperty,v=Object.prototype.propertyIsEnumerable;var m=(s,e,r)=>e in s?d(s,e,{enumerable:!0,configurable:!0,writable:!0,value:r}):s[e]=r,i=(s,e)=>{for(var r in e||(e={}))b.call(e,r)&&m(s,r,e[r]);if(a)for(var r of a(e))v.call(e,r)&&m(s,r,e[r]);return s},u=(s,e)=>g(s,C(e));import I from"fuzzy-search";import*as t from"react";import h from"../search";const M=({searchInput:s,searchKeys:e,searchDataset:r,searchTerm:l=()=>{},searchResult:p=()=>{}})=>{const[o,f]=t.useState(""),S={sort:!0},n=t.useMemo(()=>{const c=new I(r,e,S);return F=>c.search(F)},[r]),z=t.useMemo(()=>o.length>0?n(o):[],[n,o]);return t.useEffect(()=>{p(z),l(o)}),t.createElement("div",{className:"form-content__search"},t.createElement(h,u(i({},s),{inputSize:h.inputSizes.small,isLabelVisible:!1,onChangeFunc:c=>f(c)})))};var L=M;export{L as default};
|
|
2
2
|
//# sourceMappingURL=form-content.search.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../react/form-content/form-content.search.tsx"],
|
|
4
|
-
"sourcesContent": ["
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["'use client';\n\nimport FuzzySearch from 'fuzzy-search';\nimport * as React from 'react';\nimport Search from '../search';\nimport { Search as Props, SearchItem } from './form-content.types';\n\nconst FormContentSearch: React.FC<Props> = ({\n searchInput,\n searchKeys,\n searchDataset,\n searchTerm = () => {},\n searchResult = () => {},\n}) => {\n const [term, setTerm] = React.useState('');\n const searchOptions = { sort: true };\n\n const search = React.useMemo(() => {\n const searcher = new FuzzySearch<SearchItem>(\n searchDataset,\n searchKeys,\n searchOptions,\n );\n return (term: string) => searcher.search(term);\n }, [searchDataset]);\n\n const searchResults = React.useMemo(\n () => (term.length > 0 ? search(term) : []),\n [search, term],\n );\n\n React.useEffect(() => {\n searchResult(searchResults);\n searchTerm(term);\n });\n\n return (\n <div className=\"form-content__search\">\n <Search\n {...searchInput}\n inputSize={Search.inputSizes.small}\n isLabelVisible={false}\n onChangeFunc={string => setTerm(string)}\n />\n </div>\n );\n};\n\nexport default FormContentSearch;\n"],
|
|
5
|
+
"mappings": "0bAEA,OAAOA,MAAiB,eACxB,UAAYC,MAAW,QACvB,OAAOC,MAAY,YAGnB,MAAMC,EAAqC,CAAC,CAC1C,YAAAC,EACA,WAAAC,EACA,cAAAC,EACA,WAAAC,EAAa,IAAM,CAAC,EACpB,aAAAC,EAAe,IAAM,CAAC,CACxB,IAAM,CACJ,KAAM,CAACC,EAAMC,CAAO,EAAIT,EAAM,SAAS,EAAE,EACnCU,EAAgB,CAAE,KAAM,EAAK,EAE7BC,EAASX,EAAM,QAAQ,IAAM,CACjC,MAAMY,EAAW,IAAIb,EACnBM,EACAD,EACAM,CACF,EACA,OAAQF,GAAiBI,EAAS,OAAOJ,CAAI,CAC/C,EAAG,CAACH,CAAa,CAAC,EAEZQ,EAAgBb,EAAM,QAC1B,IAAOQ,EAAK,OAAS,EAAIG,EAAOH,CAAI,EAAI,CAAC,EACzC,CAACG,EAAQH,CAAI,CACf,EAEA,OAAAR,EAAM,UAAU,IAAM,CACpBO,EAAaM,CAAa,EAC1BP,EAAWE,CAAI,CACjB,CAAC,EAGCR,EAAA,cAAC,OAAI,UAAU,wBACbA,EAAA,cAACC,EAAAa,EAAAC,EAAA,GACKZ,GADL,CAEC,UAAWF,EAAO,WAAW,MAC7B,eAAgB,GAChB,aAAce,GAAUP,EAAQO,CAAM,GACxC,CACF,CAEJ,EAEA,IAAOC,EAAQf",
|
|
6
6
|
"names": ["FuzzySearch", "React", "Search", "FormContentSearch", "searchInput", "searchKeys", "searchDataset", "searchTerm", "searchResult", "term", "setTerm", "searchOptions", "search", "searcher", "searchResults", "__spreadProps", "__spreadValues", "string", "form_content_search_default"]
|
|
7
7
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
var C=Object.defineProperty,F=Object.defineProperties;var N=Object.getOwnPropertyDescriptors;var v=Object.getOwnPropertySymbols;var T=Object.prototype.hasOwnProperty,$=Object.prototype.propertyIsEnumerable;var g=(
|
|
1
|
+
"use client";var C=Object.defineProperty,F=Object.defineProperties;var N=Object.getOwnPropertyDescriptors;var v=Object.getOwnPropertySymbols;var T=Object.prototype.hasOwnProperty,$=Object.prototype.propertyIsEnumerable;var g=(i,s,e)=>s in i?C(i,s,{enumerable:!0,configurable:!0,writable:!0,value:e}):i[s]=e,n=(i,s)=>{for(var e in s||(s={}))T.call(s,e)&&g(i,e,s[e]);if(v)for(var e of v(s))$.call(s,e)&&g(i,e,s[e]);return i},t=(i,s)=>F(i,N(s));import a,{useState as k}from"react";import{variants as z,sizes as o}from"./message-field.types";import l from"../button";import d from"../text-area";import x from"../icons/16/add";import A from"../icons/16/send";import I from"classnames";const f=({send:i,input:s,altButton:e,variant:m=z.nested,size:r=o.default,isSubmitting:p,onAltButtonClick:c=()=>{},onClickFunc:u=()=>{}})=>{const[y,b]=k(!1);return a.createElement("div",{className:I("message-field",{[`message-field--variant-${m}`]:m,[`message-field--variant-${m}-${r}`]:r})},e?a.createElement(l,t(n({},e),{leadingIcon:a.createElement(x,null),variant:l.variants.tertiary,onClick:c,size:r===o.small?l.sizes.small:l.sizes.basic})):null,a.createElement("div",{className:"message-field__message"},a.createElement(d,t(n({},s),{onChange:h=>{b(!!h.target.value.length)},isLabelVisible:!1,size:r===o.small?d.sizes.small:d.sizes.default,isShort:!0}))),a.createElement("div",null,a.createElement(l,t(n({},i),{disabled:!y||p,leadingIcon:a.createElement(A,null),onClick:u,size:r===o.small?l.sizes.small:l.sizes.basic,spinning:p,variant:l.variants.complete}))))};f.variants=z,f.sizes=o;var w=f;export{w as default};
|
|
2
2
|
//# sourceMappingURL=message-field.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../react/message-field/message-field.tsx"],
|
|
4
|
-
"sourcesContent": ["
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["'use client';\n\nimport React, { useState } from 'react';\n\nimport { MessageField as Props, variants, sizes } from './message-field.types';\nimport Button from '../button';\nimport TextArea from '../text-area';\nimport Add from '../icons/16/add';\nimport Send from '../icons/16/send';\nimport classNames from 'classnames';\n\nconst MessageField: React.FunctionComponent<Props> & {\n variants: typeof variants;\n sizes: typeof sizes;\n} = ({\n send,\n input,\n altButton,\n variant = variants.nested,\n size = sizes.default,\n isSubmitting,\n onAltButtonClick = () => {},\n onClickFunc = () => {},\n}) => {\n const [hasTyped, setHasTyped] = useState(false);\n return (\n <div\n className={classNames('message-field', {\n [`message-field--variant-${variant}`]: variant,\n [`message-field--variant-${variant}-${size}`]: size,\n })}\n >\n {altButton ? (\n <Button\n {...altButton}\n leadingIcon={<Add />}\n variant={Button.variants.tertiary}\n onClick={onAltButtonClick}\n size={size === sizes.small ? Button.sizes.small : Button.sizes.basic}\n />\n ) : null}\n <div className=\"message-field__message\">\n <TextArea\n {...input}\n onChange={e => {\n setHasTyped(!!e.target.value.length);\n }}\n isLabelVisible={false}\n size={\n size === sizes.small ? TextArea.sizes.small : TextArea.sizes.default\n }\n isShort\n />\n </div>\n <div>\n <Button\n {...send}\n disabled={!hasTyped || isSubmitting}\n leadingIcon={<Send />}\n onClick={onClickFunc}\n size={size === sizes.small ? Button.sizes.small : Button.sizes.basic}\n spinning={isSubmitting}\n variant={Button.variants.complete}\n />\n </div>\n </div>\n );\n};\n\nMessageField.variants = variants;\nMessageField.sizes = sizes;\nexport default MessageField;\n"],
|
|
5
|
+
"mappings": "0bAEA,OAAOA,GAAS,YAAAC,MAAgB,QAEhC,OAAgC,YAAAC,EAAU,SAAAC,MAAa,wBACvD,OAAOC,MAAY,YACnB,OAAOC,MAAc,eACrB,OAAOC,MAAS,kBAChB,OAAOC,MAAU,mBACjB,OAAOC,MAAgB,aAEvB,MAAMC,EAGF,CAAC,CACH,KAAAC,EACA,MAAAC,EACA,UAAAC,EACA,QAAAC,EAAUX,EAAS,OACnB,KAAAY,EAAOX,EAAM,QACb,aAAAY,EACA,iBAAAC,EAAmB,IAAM,CAAC,EAC1B,YAAAC,EAAc,IAAM,CAAC,CACvB,IAAM,CACJ,KAAM,CAACC,EAAUC,CAAW,EAAIlB,EAAS,EAAK,EAC9C,OACED,EAAA,cAAC,OACC,UAAWQ,EAAW,gBAAiB,CACrC,CAAC,0BAA0BK,CAAO,EAAE,EAAGA,EACvC,CAAC,0BAA0BA,CAAO,IAAIC,CAAI,EAAE,EAAGA,CACjD,CAAC,GAEAF,EACCZ,EAAA,cAACI,EAAAgB,EAAAC,EAAA,GACKT,GADL,CAEC,YAAaZ,EAAA,cAACM,EAAA,IAAI,EAClB,QAASF,EAAO,SAAS,SACzB,QAASY,EACT,KAAMF,IAASX,EAAM,MAAQC,EAAO,MAAM,MAAQA,EAAO,MAAM,OACjE,EACE,KACJJ,EAAA,cAAC,OAAI,UAAU,0BACbA,EAAA,cAACK,EAAAe,EAAAC,EAAA,GACKV,GADL,CAEC,SAAUW,GAAK,CACbH,EAAY,CAAC,CAACG,EAAE,OAAO,MAAM,MAAM,CACrC,EACA,eAAgB,GAChB,KACER,IAASX,EAAM,MAAQE,EAAS,MAAM,MAAQA,EAAS,MAAM,QAE/D,QAAO,IACT,CACF,EACAL,EAAA,cAAC,WACCA,EAAA,cAACI,EAAAgB,EAAAC,EAAA,GACKX,GADL,CAEC,SAAU,CAACQ,GAAYH,EACvB,YAAaf,EAAA,cAACO,EAAA,IAAK,EACnB,QAASU,EACT,KAAMH,IAASX,EAAM,MAAQC,EAAO,MAAM,MAAQA,EAAO,MAAM,MAC/D,SAAUW,EACV,QAASX,EAAO,SAAS,UAC3B,CACF,CACF,CAEJ,EAEAK,EAAa,SAAWP,EACxBO,EAAa,MAAQN,EACrB,IAAOoB,EAAQd",
|
|
6
6
|
"names": ["React", "useState", "variants", "sizes", "Button", "TextArea", "Add", "Send", "classNames", "MessageField", "send", "input", "altButton", "variant", "size", "isSubmitting", "onAltButtonClick", "onClickFunc", "hasTyped", "setHasTyped", "__spreadProps", "__spreadValues", "e", "message_field_default"]
|
|
7
7
|
}
|
package/react/modal/modal.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
var C=Object.defineProperty,B=Object.defineProperties;var I=Object.getOwnPropertyDescriptors;var c=Object.getOwnPropertySymbols;var P=Object.prototype.hasOwnProperty,E=Object.prototype.propertyIsEnumerable;var f=(s,l,i)=>l in s?C(s,l,{enumerable:!0,configurable:!0,writable:!0,value:i}):s[l]=i,v=(s,l)=>{for(var i in l||(l={}))P.call(l,i)&&f(s,i,l[i]);if(c)for(var i of c(l))E.call(l,i)&&f(s,i,l[i]);return s},N=(s,l)=>B(s,I(l));import
|
|
1
|
+
"use client";var C=Object.defineProperty,B=Object.defineProperties;var I=Object.getOwnPropertyDescriptors;var c=Object.getOwnPropertySymbols;var P=Object.prototype.hasOwnProperty,E=Object.prototype.propertyIsEnumerable;var f=(s,l,i)=>l in s?C(s,l,{enumerable:!0,configurable:!0,writable:!0,value:i}):s[l]=i,v=(s,l)=>{for(var i in l||(l={}))P.call(l,i)&&f(s,i,l[i]);if(c)for(var i of c(l))E.call(l,i)&&f(s,i,l[i]);return s},N=(s,l)=>B(s,I(l));import u from"classnames";import*as o from"react";import*as w from"react-dom";import e from"../button";import A from"../hooks/use-escape";import{useIsMounted as D}from"../hooks/use-is-mounted";import h from"../icons/18/close";import r from"../text";import{ActionTypes as y,backgrounds as T}from"./modal.types";import H from"./tab-trapper";import L from"../link-button";const k=({ariaLabel:s,background:l=T.primary,children:i,closeLabel:_,explanation:d,id:M,onClose:n=()=>{},title:t,actions:m,onClick:g=()=>{}})=>{const p=o.useRef(null),x=D();if(A(n),!x)return null;const b=a=>{p.current&&p.current===a.target&&n()};return w.createPortal(o.createElement("div",{"aria-label":s,className:"modal",id:M,onClick:b,ref:p,role:"dialog"},o.createElement("div",{className:u("modal__content",{[`modal__content--${l}`]:l})},o.createElement(H,{isActive:!0,className:"modal__content-inner"},o.createElement("div",{className:u("modal__close-action",{"modal__close-action--always-shown":m&&m.length})},o.createElement(e,{leadingIcon:o.createElement(h,null),onClick:n,size:e.sizes.small,text:_,variant:e.variants.secondary,iconOnly:!0})),t||d?o.createElement("div",{className:"modal__nav"},o.createElement("div",{className:"modal__texts"},t?o.createElement(r,{className:"modal__title",size:r.sizes.headline2,theme:r.themes.emphasis},t):null,d?o.createElement("div",{className:u("modal__explanation",{[`modal__explanation--${l}`]:l})},o.createElement(r,{size:r.sizes.small},d)):null)):null,o.createElement("div",{className:"modal__children"},o.createElement("div",null,i)),m&&m.length?o.createElement("div",{className:"modal__actions"},m.map(a=>a.type===y.LinkButton?o.createElement(L,v({},a.action)):a.type===y.Button?o.createElement(e,N(v({},a.action),{onClick:z=>g(a.buttonId,z)})):null)):o.createElement("div",{className:"modal__close-action-mobile"},o.createElement(e,{leadingIcon:o.createElement(h,null),onClick:n,text:_,variant:e.variants.secondary}))))),document.body)};k.backgrounds=T;var S=k;export{S as default};
|
|
2
2
|
//# sourceMappingURL=modal.js.map
|
package/react/modal/modal.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../react/modal/modal.tsx"],
|
|
4
|
-
"sourcesContent": ["
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["'use client';\n\nimport classNames from 'classnames';\nimport * as React from 'react';\nimport * as ReactDOM from 'react-dom';\n\nimport Button from '../button';\nimport useEscape from '../hooks/use-escape';\nimport { useIsMounted } from '../hooks/use-is-mounted';\nimport Close from '../icons/18/close';\nimport Text from '../text';\n\nimport { ActionTypes, type Modal as Props, backgrounds } from './modal.types';\nimport TabTrapper from './tab-trapper';\nimport LinkButton from '../link-button';\n\nconst Modal: React.FC<React.PropsWithChildren<Props>> & {\n backgrounds: typeof backgrounds;\n} = ({\n ariaLabel,\n background = backgrounds.primary,\n children,\n closeLabel,\n explanation,\n id,\n onClose = () => {},\n title,\n actions,\n onClick = () => {},\n}) => {\n const modal = React.useRef<HTMLDivElement>(null);\n const isMounted = useIsMounted();\n useEscape(onClose);\n\n if (!isMounted) {\n return null;\n }\n\n const handleModalClick: React.MouseEventHandler = e => {\n if (modal.current && modal.current === e.target) {\n onClose();\n }\n };\n\n return ReactDOM.createPortal(\n <div\n aria-label={ariaLabel}\n className=\"modal\"\n id={id}\n onClick={handleModalClick}\n ref={modal}\n role=\"dialog\"\n >\n <div\n className={classNames('modal__content', {\n [`modal__content--${background}`]: background,\n })}\n >\n <TabTrapper isActive={true} className=\"modal__content-inner\">\n <div\n className={classNames('modal__close-action', {\n 'modal__close-action--always-shown': actions && actions.length,\n })}\n >\n <Button\n leadingIcon={<Close />}\n onClick={onClose}\n size={Button.sizes.small}\n text={closeLabel}\n variant={Button.variants.secondary}\n iconOnly\n />\n </div>\n {title || explanation ? (\n <div className=\"modal__nav\">\n <div className=\"modal__texts\">\n {title ? (\n <Text\n className=\"modal__title\"\n size={Text.sizes.headline2}\n theme={Text.themes.emphasis}\n >\n {title}\n </Text>\n ) : null}\n {explanation ? (\n <div\n className={classNames('modal__explanation', {\n [`modal__explanation--${background}`]: background,\n })}\n >\n <Text size={Text.sizes.small}>{explanation}</Text>\n </div>\n ) : null}\n </div>\n </div>\n ) : null}\n <div className=\"modal__children\">\n <div>{children}</div>\n </div>\n {actions && actions.length ? (\n <div className=\"modal__actions\">\n {actions.map(action =>\n action.type === ActionTypes.LinkButton ? (\n <LinkButton {...action.action} />\n ) : action.type === ActionTypes.Button ? (\n <Button\n {...action.action}\n onClick={e => onClick(action.buttonId, e)}\n />\n ) : null,\n )}\n </div>\n ) : (\n <div className=\"modal__close-action-mobile\">\n <Button\n leadingIcon={<Close />}\n onClick={onClose}\n text={closeLabel}\n variant={Button.variants.secondary}\n />\n </div>\n )}\n </TabTrapper>\n </div>\n </div>,\n document.body,\n );\n};\n\nModal.backgrounds = backgrounds;\n\nexport default Modal;\n"],
|
|
5
|
+
"mappings": "0bAEA,OAAOA,MAAgB,aACvB,UAAYC,MAAW,QACvB,UAAYC,MAAc,YAE1B,OAAOC,MAAY,YACnB,OAAOC,MAAe,sBACtB,OAAS,gBAAAC,MAAoB,0BAC7B,OAAOC,MAAW,oBAClB,OAAOC,MAAU,UAEjB,OAAS,eAAAC,EAAkC,eAAAC,MAAmB,gBAC9D,OAAOC,MAAgB,gBACvB,OAAOC,MAAgB,iBAEvB,MAAMC,EAEF,CAAC,CACH,UAAAC,EACA,WAAAC,EAAaL,EAAY,QACzB,SAAAM,EACA,WAAAC,EACA,YAAAC,EACA,GAAAC,EACA,QAAAC,EAAU,IAAM,CAAC,EACjB,MAAAC,EACA,QAAAC,EACA,QAAAC,EAAU,IAAM,CAAC,CACnB,IAAM,CACJ,MAAMC,EAAQtB,EAAM,OAAuB,IAAI,EACzCuB,EAAYnB,EAAa,EAG/B,GAFAD,EAAUe,CAAO,EAEb,CAACK,EACH,OAAO,KAGT,MAAMC,EAA4CC,GAAK,CACjDH,EAAM,SAAWA,EAAM,UAAYG,EAAE,QACvCP,EAAQ,CAEZ,EAEA,OAAOjB,EAAS,aACdD,EAAA,cAAC,OACC,aAAYY,EACZ,UAAU,QACV,GAAIK,EACJ,QAASO,EACT,IAAKF,EACL,KAAK,UAELtB,EAAA,cAAC,OACC,UAAWD,EAAW,iBAAkB,CACtC,CAAC,mBAAmBc,CAAU,EAAE,EAAGA,CACrC,CAAC,GAEDb,EAAA,cAACS,EAAA,CAAW,SAAU,GAAM,UAAU,wBACpCT,EAAA,cAAC,OACC,UAAWD,EAAW,sBAAuB,CAC3C,oCAAqCqB,GAAWA,EAAQ,MAC1D,CAAC,GAEDpB,EAAA,cAACE,EAAA,CACC,YAAaF,EAAA,cAACK,EAAA,IAAM,EACpB,QAASa,EACT,KAAMhB,EAAO,MAAM,MACnB,KAAMa,EACN,QAASb,EAAO,SAAS,UACzB,SAAQ,GACV,CACF,EACCiB,GAASH,EACRhB,EAAA,cAAC,OAAI,UAAU,cACbA,EAAA,cAAC,OAAI,UAAU,gBACZmB,EACCnB,EAAA,cAACM,EAAA,CACC,UAAU,eACV,KAAMA,EAAK,MAAM,UACjB,MAAOA,EAAK,OAAO,UAElBa,CACH,EACE,KACHH,EACChB,EAAA,cAAC,OACC,UAAWD,EAAW,qBAAsB,CAC1C,CAAC,uBAAuBc,CAAU,EAAE,EAAGA,CACzC,CAAC,GAEDb,EAAA,cAACM,EAAA,CAAK,KAAMA,EAAK,MAAM,OAAQU,CAAY,CAC7C,EACE,IACN,CACF,EACE,KACJhB,EAAA,cAAC,OAAI,UAAU,mBACbA,EAAA,cAAC,WAAKc,CAAS,CACjB,EACCM,GAAWA,EAAQ,OAClBpB,EAAA,cAAC,OAAI,UAAU,kBACZoB,EAAQ,IAAIM,GACXA,EAAO,OAASnB,EAAY,WAC1BP,EAAA,cAACU,EAAAiB,EAAA,GAAeD,EAAO,OAAQ,EAC7BA,EAAO,OAASnB,EAAY,OAC9BP,EAAA,cAACE,EAAA0B,EAAAD,EAAA,GACKD,EAAO,QADZ,CAEC,QAASD,GAAKJ,EAAQK,EAAO,SAAUD,CAAC,GAC1C,EACE,IACN,CACF,EAEAzB,EAAA,cAAC,OAAI,UAAU,8BACbA,EAAA,cAACE,EAAA,CACC,YAAaF,EAAA,cAACK,EAAA,IAAM,EACpB,QAASa,EACT,KAAMH,EACN,QAASb,EAAO,SAAS,UAC3B,CACF,CAEJ,CACF,CACF,EACA,SAAS,IACX,CACF,EAEAS,EAAM,YAAcH,EAEpB,IAAOqB,EAAQlB",
|
|
6
6
|
"names": ["classNames", "React", "ReactDOM", "Button", "useEscape", "useIsMounted", "Close", "Text", "ActionTypes", "backgrounds", "TabTrapper", "LinkButton", "Modal", "ariaLabel", "background", "children", "closeLabel", "explanation", "id", "onClose", "title", "actions", "onClick", "modal", "isMounted", "handleModalClick", "e", "action", "__spreadValues", "__spreadProps", "modal_default"]
|
|
7
7
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import*as n from"react";const c=t=>{var e;(e=t==null?void 0:t.current)==null||e.focus()},f=(t,e)=>{const u=n.useRef(typeof e=="undefined"?null:e);return n.useEffect(()=>{u.current=t},[t]),u.current},a=({children:t,isActive:e,className:u})=>{const l=f(e),r=n.useRef(null),o=n.useRef(null),s=()=>c(r);return n.useEffect(()=>{!l&&e&&(o.current=document.activeElement,s()),l&&!e&&c(o)},[e]),n.useEffect(()=>()=>c(o),[]),n.createElement(n.Fragment,null,e?n.createElement("div",{onFocus:s,tabIndex:0}):null,n.createElement("div",{ref:r,tabIndex:-1,className:u},t),e?n.createElement("div",{onFocus:s,tabIndex:0}):null)};var d=a;export{d as default};
|
|
1
|
+
"use client";import*as n from"react";const c=t=>{var e;(e=t==null?void 0:t.current)==null||e.focus()},f=(t,e)=>{const u=n.useRef(typeof e=="undefined"?null:e);return n.useEffect(()=>{u.current=t},[t]),u.current},a=({children:t,isActive:e,className:u})=>{const l=f(e),r=n.useRef(null),o=n.useRef(null),s=()=>c(r);return n.useEffect(()=>{!l&&e&&(o.current=document.activeElement,s()),l&&!e&&c(o)},[e]),n.useEffect(()=>()=>c(o),[]),n.createElement(n.Fragment,null,e?n.createElement("div",{onFocus:s,tabIndex:0}):null,n.createElement("div",{ref:r,tabIndex:-1,className:u},t),e?n.createElement("div",{onFocus:s,tabIndex:0}):null)};var d=a;export{d as default};
|
|
2
2
|
//# sourceMappingURL=tab-trapper.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../react/modal/tab-trapper.tsx"],
|
|
4
|
-
"sourcesContent": ["
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["'use client';\n\nimport * as React from 'react';\n\nconst focusRef = (ref: React.RefObject<HTMLElement | null>): void => {\n ref?.current?.focus();\n};\n\n/** Returns the value of `value` from the previous render.\n```js\nconst [value, setValue] = useState();\nconst previousValue = usePrevious(value);\n```\n */\n// eslint-disable-next-line\nconst usePrevious = <T extends unknown>(\n value: T,\n initialValue?: T,\n): React.RefObject<T | null>['current'] => {\n const state = React.useRef<T | null>(\n typeof initialValue === 'undefined' ? null : initialValue,\n );\n\n React.useEffect(() => {\n state.current = value;\n }, [value]);\n\n return state.current;\n};\n\nconst TabTrapper: React.FunctionComponent<\n React.PropsWithChildren<{\n isActive: boolean;\n className?: string;\n }>\n> = ({ children, isActive, className }) => {\n const wasActive = usePrevious(isActive);\n const contentRef = React.useRef<HTMLDivElement>(null);\n const previouslyFocusedElement = React.useRef<HTMLElement | null>(null);\n\n const focusContent = () => focusRef(contentRef);\n\n React.useEffect(() => {\n if (!wasActive && isActive) {\n // NOTE: Because document.activeElement is an Element by default, we need\n // to cast this as a HTMLElement to be able to use HTMLElement functions\n previouslyFocusedElement.current = document.activeElement as HTMLElement;\n focusContent();\n }\n\n if (wasActive && !isActive) {\n focusRef(previouslyFocusedElement);\n }\n }, [isActive]);\n\n // NOTE: This happens on unmount only\n React.useEffect(() => () => focusRef(previouslyFocusedElement), []);\n\n return (\n <React.Fragment>\n {isActive ? <div onFocus={focusContent} tabIndex={0} /> : null}\n <div ref={contentRef} tabIndex={-1} className={className}>\n {children}\n </div>\n {isActive ? <div onFocus={focusContent} tabIndex={0} /> : null}\n </React.Fragment>\n );\n};\n\nexport default TabTrapper;\n"],
|
|
5
|
+
"mappings": "aAEA,UAAYA,MAAW,QAEvB,MAAMC,EAAYC,GAAmD,CAJrE,IAAAC,GAKEA,EAAAD,GAAA,YAAAA,EAAK,UAAL,MAAAC,EAAc,OAChB,EASMC,EAAc,CAClBC,EACAC,IACyC,CACzC,MAAMC,EAAQP,EAAM,OAClB,OAAOM,GAAiB,YAAc,KAAOA,CAC/C,EAEA,OAAAN,EAAM,UAAU,IAAM,CACpBO,EAAM,QAAUF,CAClB,EAAG,CAACA,CAAK,CAAC,EAEHE,EAAM,OACf,EAEMC,EAKF,CAAC,CAAE,SAAAC,EAAU,SAAAC,EAAU,UAAAC,CAAU,IAAM,CACzC,MAAMC,EAAYR,EAAYM,CAAQ,EAChCG,EAAab,EAAM,OAAuB,IAAI,EAC9Cc,EAA2Bd,EAAM,OAA2B,IAAI,EAEhEe,EAAe,IAAMd,EAASY,CAAU,EAE9C,OAAAb,EAAM,UAAU,IAAM,CAChB,CAACY,GAAaF,IAGhBI,EAAyB,QAAU,SAAS,cAC5CC,EAAa,GAGXH,GAAa,CAACF,GAChBT,EAASa,CAAwB,CAErC,EAAG,CAACJ,CAAQ,CAAC,EAGbV,EAAM,UAAU,IAAM,IAAMC,EAASa,CAAwB,EAAG,CAAC,CAAC,EAGhEd,EAAA,cAACA,EAAM,SAAN,KACEU,EAAWV,EAAA,cAAC,OAAI,QAASe,EAAc,SAAU,EAAG,EAAK,KAC1Df,EAAA,cAAC,OAAI,IAAKa,EAAY,SAAU,GAAI,UAAWF,GAC5CF,CACH,EACCC,EAAWV,EAAA,cAAC,OAAI,QAASe,EAAc,SAAU,EAAG,EAAK,IAC5D,CAEJ,EAEA,IAAOC,EAAQR",
|
|
6
6
|
"names": ["React", "focusRef", "ref", "_a", "usePrevious", "value", "initialValue", "state", "TabTrapper", "children", "isActive", "className", "wasActive", "contentRef", "previouslyFocusedElement", "focusContent", "tab_trapper_default"]
|
|
7
7
|
}
|
package/react/radio/radio.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
var x=Object.defineProperty;var l=Object.getOwnPropertySymbols;var f=Object.prototype.hasOwnProperty,p=Object.prototype.propertyIsEnumerable;var t=(a,i,o)=>i in a?x(a,i,{enumerable:!0,configurable:!0,writable:!0,value:o}):a[i]=o,u=(a,i)=>{for(var o in i||(i={}))f.call(i,o)&&t(a,o,i[o]);if(l)for(var o of l(i))p.call(i,o)&&t(a,o,i[o]);return a};var
|
|
1
|
+
"use client";var x=Object.defineProperty;var l=Object.getOwnPropertySymbols;var f=Object.prototype.hasOwnProperty,p=Object.prototype.propertyIsEnumerable;var t=(a,i,o)=>i in a?x(a,i,{enumerable:!0,configurable:!0,writable:!0,value:o}):a[i]=o,u=(a,i)=>{for(var o in i||(i={}))f.call(i,o)&&t(a,o,i[o]);if(l)for(var o of l(i))p.call(i,o)&&t(a,o,i[o]);return a};var c=(a,i)=>{var o={};for(var n in a)f.call(a,n)&&i.indexOf(n)<0&&(o[n]=a[n]);if(a!=null&&l)for(var n of l(a))i.indexOf(n)<0&&p.call(a,n)&&(o[n]=a[n]);return o};import R from"classnames";import*as e from"react";import T from"../use-input-validation";import v from"../text";import{colors as z}from"./radio.types";const _=e.forwardRef((k,C)=>{var m=k,{children:a,color:i,description:o,isUnderline:n,label:h,name:I,showCustomError:N=!0,value:g}=m,r=c(m,["children","color","description","isUnderline","label","name","showCustomError","value"]);const[b,y,s]=T();return e.createElement("label",{className:R("radio",{"radio--error":s,"radio--underline":n},i)},e.createElement("input",u({name:I,value:g,ref:C,type:"radio",onChange:d=>{r.onChange&&r.onChange(d),b(d)},onInvalid:d=>{r.onInvalid&&r.onInvalid(d),y(d)}},r)),e.createElement("div",{className:"radio__label"},e.createElement("span",{className:"radio__fake-element"}),e.createElement("span",null,h,a)),s&&N&&e.createElement("div",{"aria-hidden":"true",className:"radio__error"},s),o&&e.createElement(v,{className:"radio__description",size:v.sizes.small},o))});_.displayName="Radio";const j=Object.assign(_,{colors:z});var V=j;export{V as default};
|
|
2
2
|
//# sourceMappingURL=radio.js.map
|
package/react/radio/radio.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../react/radio/radio.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 { colors, Radio as Props } from './radio.types';\n\nconst RefRadio = React.forwardRef<\n HTMLInputElement,\n React.PropsWithChildren<Props>\n>(\n (\n {\n children,\n color,\n description,\n isUnderline,\n label,\n name,\n showCustomError = true,\n value,\n ...restProps\n },\n ref,\n ) => {\n const [onChange, onInvalid, error] = useInputValidation();\n\n return (\n <label\n className={cn(\n 'radio',\n { 'radio--error': error, 'radio--underline': isUnderline },\n color,\n )}\n >\n <input\n name={name}\n value={value}\n ref={ref}\n type=\"radio\"\n onChange={e => {\n // NOTE: To not break compatibility\n if (restProps.onChange) restProps.onChange(e);\n onChange(e);\n }}\n onInvalid={e => {\n // NOTE: To not break compatibility\n if (restProps.onInvalid) restProps.onInvalid(e);\n onInvalid(e);\n }}\n {...restProps}\n />\n <div className=\"radio__label\">\n <span className=\"radio__fake-element\"></span>\n <span>\n {label}\n {children}\n </span>\n </div>\n\n {/* NOTE: This is aria-hidden because reporting of validation errors is handled by the browser */}\n {error && showCustomError && (\n <div aria-hidden=\"true\" className=\"radio__error\">\n {error}\n </div>\n )}\n\n {description && (\n <Text className=\"radio__description\" size={Text.sizes.small}>\n {description}\n </Text>\n )}\n </label>\n );\n },\n);\n\n// NOTE: If this isn't set, stack traces say \"forwardRef\" instead of \"Radio\"\nRefRadio.displayName = 'Radio';\n\n// NOTE: The component is redeclared here because TypeScript doesn't accept assigning extra properties to `RefComponent` when it's declared\nconst Radio: typeof RefRadio & {\n colors: typeof colors;\n} = Object.assign(RefRadio, { colors });\n\nexport default Radio;\n"],
|
|
5
|
+
"mappings": "wgBAEA,OAAOA,MAAQ,aACf,UAAYC,MAAW,QAEvB,OAAOC,MAAwB,0BAC/B,OAAOC,MAAU,UAEjB,OAAS,UAAAC,MAA8B,gBAEvC,MAAMC,EAAWJ,EAAM,WAIrB,CACEK,EAWAC,IACG,CAZH,IAAAC,EAAAF,EACE,UAAAG,EACA,MAAAC,EACA,YAAAC,EACA,YAAAC,EACA,MAAAC,EACA,KAAAC,EACA,gBAAAC,EAAkB,GAClB,MAAAC,CAvBN,EAeIR,EASKS,EAAAC,EATLV,EASK,CARH,WACA,QACA,cACA,cACA,QACA,OACA,kBACA,UAKF,KAAM,CAACW,EAAUC,EAAWC,CAAK,EAAInB,EAAmB,EAExD,OACED,EAAA,cAAC,SACC,UAAWD,EACT,QACA,CAAE,eAAgBqB,EAAO,mBAAoBT,CAAY,EACzDF,CACF,GAEAT,EAAA,cAAC,QAAAqB,EAAA,CACC,KAAMR,EACN,MAAOE,EACP,IAAKT,EACL,KAAK,QACL,SAAUgB,GAAK,CAETN,EAAU,UAAUA,EAAU,SAASM,CAAC,EAC5CJ,EAASI,CAAC,CACZ,EACA,UAAWA,GAAK,CAEVN,EAAU,WAAWA,EAAU,UAAUM,CAAC,EAC9CH,EAAUG,CAAC,CACb,GACIN,EACN,EACAhB,EAAA,cAAC,OAAI,UAAU,gBACbA,EAAA,cAAC,QAAK,UAAU,sBAAsB,EACtCA,EAAA,cAAC,YACEY,EACAJ,CACH,CACF,EAGCY,GAASN,GACRd,EAAA,cAAC,OAAI,cAAY,OAAO,UAAU,gBAC/BoB,CACH,EAGDV,GACCV,EAAA,cAACE,EAAA,CAAK,UAAU,qBAAqB,KAAMA,EAAK,MAAM,OACnDQ,CACH,CAEJ,CAEJ,CACF,EAGAN,EAAS,YAAc,QAGvB,MAAMmB,EAEF,OAAO,OAAOnB,EAAU,CAAE,OAAAD,CAAO,CAAC,EAEtC,IAAOqB,EAAQD",
|
|
6
6
|
"names": ["cn", "React", "useInputValidation", "Text", "colors", "RefRadio", "_a", "ref", "_b", "children", "color", "description", "isUnderline", "label", "name", "showCustomError", "value", "restProps", "__objRest", "onChange", "onInvalid", "error", "__spreadValues", "e", "Radio", "radio_default"]
|
|
7
7
|
}
|
package/react/search/search.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
var Z=Object.defineProperty,b=Object.defineProperties;var R=Object.getOwnPropertyDescriptors;var N=Object.getOwnPropertySymbols;var H=Object.prototype.hasOwnProperty,O=Object.prototype.propertyIsEnumerable;var D=(e,a,i)=>a in e?Z(e,a,{enumerable:!0,configurable:!0,writable:!0,value:i}):e[a]=i,p=(e,a)=>{for(var i in a||(a={}))H.call(a,i)&&D(e,i,a[i]);if(N)for(var i of N(a))O.call(a,i)&&D(e,i,a[i]);return e},f=(e,a)=>b(e,R(a));var P=(e,a)=>{var i={};for(var l in e)H.call(e,l)&&a.indexOf(l)<0&&(i[l]=e[l]);if(e!=null&&N)for(var l of N(e))a.indexOf(l)<0&&O.call(e,l)&&(i[l]=e[l]);return i};import
|
|
1
|
+
"use client";var Z=Object.defineProperty,b=Object.defineProperties;var R=Object.getOwnPropertyDescriptors;var N=Object.getOwnPropertySymbols;var H=Object.prototype.hasOwnProperty,O=Object.prototype.propertyIsEnumerable;var D=(e,a,i)=>a in e?Z(e,a,{enumerable:!0,configurable:!0,writable:!0,value:i}):e[a]=i,p=(e,a)=>{for(var i in a||(a={}))H.call(a,i)&&D(e,i,a[i]);if(N)for(var i of N(a))O.call(a,i)&&D(e,i,a[i]);return e},f=(e,a)=>b(e,R(a));var P=(e,a)=>{var i={};for(var l in e)H.call(e,l)&&a.indexOf(l)<0&&(i[l]=e[l]);if(e!=null&&N)for(var l of N(e))a.indexOf(l)<0&&O.call(e,l)&&(i[l]=e[l]);return i};import t from"classnames";import s,{useRef as ss,useState as V}from"react";import n from"../button";import es from"../hooks/use-click-outside";import{useIsMounted as rs}from"../hooks/use-is-mounted";import as from"../icons/18/close";import is from"../icons/24/search";import _ from"../text";import ns from"../use-input-validation";import{themes as h,inputSizes as m,variants as v,expandDirections as ls}from"./search.types";const j=s.forwardRef((os,G)=>{var x=os,{button:e,customErrorMessages:a,clear:i,disabled:l,label:y,isLabelVisible:$=!0,name:q,onChangeFunc:A=()=>{},onClear:B=()=>{},expandable:c,placeholder:L,required:S,inputSize:o=m.small,theme:d=h.inline,variant:r=v.default,value:W="",helpText:g,helpIcon:z}=x,F=P(x,["button","customErrorMessages","clear","disabled","label","isLabelVisible","name","onChangeFunc","onClear","expandable","placeholder","required","inputSize","theme","variant","value","helpText","helpIcon"]);const[J,K,I]=ns(a),T=ss(null),[w,C]=V(!1),Q=rs();es(T,()=>C(!1));const[E,U]=V(W),M=u=>{A(u),U(u)},X=u=>{M(u.target.value),J(u)},k=()=>{M(""),B()},Y=()=>{k(),C(!1)};return s.createElement("div",{className:t("search",{[`search--expand-direction-${c==null?void 0:c.direction}`]:c==null?void 0:c.direction})},Q?s.createElement("div",{className:t("search__inner",{"search__inner--expandable":c,"search__inner--expand":w}),ref:T},d===h.inline&&$?s.createElement(_,{theme:_.themes.emphasis,size:o===m.large?_.sizes.large:_.sizes.small,className:t("search__header",{[`search__header--variant-${r}`]:r})},y):null,s.createElement("div",{className:t("search__input-wrapper",{[`search__input-wrapper--size-${o}`]:o,[`search__input-wrapper--theme-${d}`]:d,[`search__input-wrapper--variant-${r}`]:r})},s.createElement("label",{className:"search__label"},s.createElement("div",{className:t("search__icon",{[`search__icon--variant-${r}`]:r})},s.createElement(is,null)),s.createElement("input",f(p({},F),{className:t("search__input",{[`search__input--variant-${r}`]:r,[`search__input--size-${o}`]:o}),disabled:l,name:q,onChange:X,onClick:()=>C(!0),value:E,onInvalid:K,placeholder:L,ref:G,required:S,type:"search","aria-label":d===h.floating||!$?y:void 0}))),s.createElement("div",{className:t("search__clear-button",{"search__clear-button--visible":E})},s.createElement(n,f(p({},i),{onClick:k,size:o===m.small?n.sizes.small:n.sizes.basic,type:"button",variant:r===v.fixed?n.variants.fixedTertiary:n.variants.tertiary}))),e?s.createElement(n,f(p({},e),{className:"search__search-button",variant:r===v.fixed?n.variants.secondaryWhite:n.variants.secondary,type:"submit",size:o===m.small?n.sizes.small:n.sizes.basic})):null,c&&w?s.createElement(n,f(p({},c.close),{className:"search__close-button",onClick:Y,leadingIcon:s.createElement(as,null),size:o===m.small?n.sizes.small:n.sizes.basic,type:"button",variant:r===v.fixed?n.variants.fixedTertiary:n.variants.tertiary})):null),I?s.createElement("div",{"aria-hidden":"true",className:"search__error"},s.createElement(_,null,I)):null,d===h.inline&&g?s.createElement(_,{size:_.sizes.interface,className:t("search__help-text",{[`search__help-text--variant-${r}`]:r})},z,g):null):s.createElement("div",{className:"search__loading-inner"},d===h.inline&&$?s.createElement("div",{className:t("search__loading-extra",{[`search__loading-extra--${r}`]:r})},y):null,s.createElement("div",{className:t("search__loading-input",{[`search__loading-input--${r}`]:r,[`search__loading-input--${o}`]:o})}),d===h.inline&&g?s.createElement("div",{className:t("search__loading-extra",{[`search__loading-extra--${r}`]:r})},z,g):null))});j.displayName="Search";const ts=Object.assign(j,{themes:h,variants:v,inputSizes:m,expandDirections:ls});var $s=ts;export{$s as default};
|
|
2
2
|
//# sourceMappingURL=search.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../react/search/search.tsx"],
|
|
4
|
-
"sourcesContent": ["
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["'use client';\n\nimport classNames from 'classnames';\nimport React, { useRef, useState } from 'react';\n\nimport Button from '../button';\nimport useClickOutside from '../hooks/use-click-outside';\nimport { useIsMounted } from '../hooks/use-is-mounted';\nimport CloseIcon from '../icons/18/close';\nimport SearchIcon from '../icons/24/search';\nimport Text from '../text';\nimport useInputValidation from '../use-input-validation';\n\nimport {\n Search as Props,\n themes,\n inputSizes,\n variants,\n expandDirections,\n} from './search.types';\n\nconst RefSearch = React.forwardRef<HTMLInputElement, Props>(\n (\n {\n button,\n customErrorMessages,\n clear,\n disabled,\n label,\n isLabelVisible = true,\n name,\n onChangeFunc = () => {},\n onClear = () => {},\n expandable,\n placeholder,\n required,\n inputSize = inputSizes.small,\n theme = themes.inline,\n variant = variants.default,\n value = '',\n helpText,\n helpIcon,\n ...restProps\n },\n ref,\n ) => {\n const [validationOnChange, handleInvalid, error] =\n useInputValidation(customErrorMessages);\n const searchArea = useRef<HTMLDivElement>(null);\n const [expand, setExpand] = useState(false);\n const isMounted = useIsMounted();\n\n useClickOutside(searchArea, () => setExpand(false));\n\n const [inputValue, setInputValue] = useState(value);\n\n const setValue = (value: string) => {\n onChangeFunc(value);\n setInputValue(value);\n };\n\n const handleChange: React.ChangeEventHandler<HTMLInputElement> = e => {\n setValue(e.target.value);\n validationOnChange(e);\n };\n\n const handleClear = () => {\n setValue('');\n onClear();\n };\n\n const handleClose = () => {\n handleClear();\n setExpand(false);\n };\n\n return (\n <div\n className={classNames('search', {\n [`search--expand-direction-${expandable?.direction}`]:\n expandable?.direction,\n })}\n >\n {isMounted ? (\n <div\n className={classNames('search__inner', {\n 'search__inner--expandable': expandable,\n 'search__inner--expand': expand,\n })}\n ref={searchArea}\n >\n {theme === themes.inline && isLabelVisible ? (\n <Text\n theme={Text.themes.emphasis}\n size={\n inputSize === inputSizes.large\n ? Text.sizes.large\n : Text.sizes.small\n }\n className={classNames('search__header', {\n [`search__header--variant-${variant}`]: variant,\n })}\n >\n {label}\n </Text>\n ) : null}\n <div\n className={classNames('search__input-wrapper', {\n [`search__input-wrapper--size-${inputSize}`]: inputSize,\n [`search__input-wrapper--theme-${theme}`]: theme,\n [`search__input-wrapper--variant-${variant}`]: variant,\n })}\n >\n <label className=\"search__label\">\n <div\n className={classNames('search__icon', {\n [`search__icon--variant-${variant}`]: variant,\n })}\n >\n <SearchIcon />\n </div>\n <input\n {...restProps}\n className={classNames('search__input', {\n [`search__input--variant-${variant}`]: variant,\n [`search__input--size-${inputSize}`]: inputSize,\n })}\n disabled={disabled}\n name={name}\n onChange={handleChange}\n onClick={() => setExpand(true)}\n value={inputValue}\n onInvalid={handleInvalid}\n placeholder={placeholder}\n ref={ref}\n required={required}\n type=\"search\"\n aria-label={\n theme === themes.floating || !isLabelVisible\n ? label\n : undefined\n }\n />\n </label>\n <div\n className={classNames('search__clear-button', {\n 'search__clear-button--visible': inputValue,\n })}\n >\n <Button\n {...clear}\n onClick={handleClear}\n size={\n inputSize === inputSizes.small\n ? Button.sizes.small\n : Button.sizes.basic\n }\n type=\"button\"\n variant={\n variant === variants.fixed\n ? Button.variants.fixedTertiary\n : Button.variants.tertiary\n }\n />\n </div>\n {button ? (\n <Button\n {...button}\n className=\"search__search-button\"\n variant={\n variant === variants.fixed\n ? Button.variants.secondaryWhite\n : Button.variants.secondary\n }\n type=\"submit\"\n size={\n inputSize === inputSizes.small\n ? Button.sizes.small\n : Button.sizes.basic\n }\n />\n ) : null}\n {expandable && expand ? (\n <Button\n {...expandable.close}\n className=\"search__close-button\"\n onClick={handleClose}\n leadingIcon={<CloseIcon />}\n size={\n inputSize === inputSizes.small\n ? Button.sizes.small\n : Button.sizes.basic\n }\n type=\"button\"\n variant={\n variant === variants.fixed\n ? Button.variants.fixedTertiary\n : Button.variants.tertiary\n }\n />\n ) : null}\n </div>\n {error ? (\n <div aria-hidden=\"true\" className=\"search__error\">\n <Text>{error}</Text>\n </div>\n ) : null}\n {theme === themes.inline && helpText ? (\n <Text\n size={Text.sizes.interface}\n className={classNames('search__help-text', {\n [`search__help-text--variant-${variant}`]: variant,\n })}\n >\n {helpIcon}\n {helpText}\n </Text>\n ) : null}\n </div>\n ) : (\n <div className=\"search__loading-inner\">\n {theme === themes.inline && isLabelVisible ? (\n <div\n className={classNames('search__loading-extra', {\n [`search__loading-extra--${variant}`]: variant,\n })}\n >\n {label}\n </div>\n ) : null}\n <div\n className={classNames('search__loading-input', {\n [`search__loading-input--${variant}`]: variant,\n [`search__loading-input--${inputSize}`]: inputSize,\n })}\n ></div>\n {theme === themes.inline && helpText ? (\n <div\n className={classNames('search__loading-extra', {\n [`search__loading-extra--${variant}`]: variant,\n })}\n >\n {helpIcon}\n {helpText}\n </div>\n ) : null}\n </div>\n )}\n </div>\n );\n },\n);\n\n// NOTE: Stack traces will show \"forwardRef\" instead of \"Search\" if this is not set.\nRefSearch.displayName = 'Search';\n\nconst Search: typeof RefSearch & {\n themes: typeof themes;\n variants: typeof variants;\n inputSizes: typeof inputSizes;\n expandDirections: typeof expandDirections;\n} = Object.assign(RefSearch, {\n themes,\n variants,\n inputSizes,\n expandDirections,\n});\n\nexport default Search;\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["classNames", "React", "useRef", "useState", "Button", "useClickOutside", "useIsMounted", "CloseIcon", "SearchIcon", "Text", "useInputValidation", "themes", "inputSizes", "variants", "expandDirections", "RefSearch", "_a", "ref", "_b", "button", "customErrorMessages", "clear", "disabled", "label", "isLabelVisible", "name", "onChangeFunc", "onClear", "expandable", "placeholder", "required", "inputSize", "theme", "variant", "value", "helpText", "helpIcon", "restProps", "__objRest", "validationOnChange", "handleInvalid", "error", "searchArea", "expand", "setExpand", "isMounted", "inputValue", "setInputValue", "setValue", "handleChange", "e", "handleClear", "handleClose", "__spreadProps", "__spreadValues", "Search", "search_default"]
|
|
7
7
|
}
|
package/react/select/select.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
var L=Object.defineProperty;var o=Object.getOwnPropertySymbols;var x=Object.prototype.hasOwnProperty,C=Object.prototype.propertyIsEnumerable;var g=(e,s,t)=>s in e?L(e,s,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[s]=t,v=(e,s)=>{for(var t in s||(s={}))x.call(s,t)&&g(e,t,s[t]);if(o)for(var t of o(s))C.call(s,t)&&g(e,t,s[t]);return e};var E=(e,s)=>{var t={};for(var a in e)x.call(e,a)&&s.indexOf(a)<0&&(t[a]=e[a]);if(e!=null&&o)for(var a of o(e))s.indexOf(a)<0&&C.call(e,a)&&(t[a]=e[a]);return t};import i from"classnames";import*as l from"react";import $ from"../use-input-validation";import j from"../select-option/select-option";import r from"../text";import A from"../icons/18/arrow-down";import{labelPositions as b,variants as f}from"./select.types";const w=l.forwardRef((W,T)=>{var N=W,{children:e,className:s,id:t,isLabelVisible:a=!0,label:c,labelPosition:I=b.stacked,name:y,onChange:O=()=>{},onChangeOption:P=()=>{},options:u=[],required:m,variant:h=f.large,wide:p}=N,_=E(N,["children","className","id","isLabelVisible","label","labelPosition","name","onChange","onChangeOption","options","required","variant","wide"]);const[k,z,d]=$(),H=n=>{O(n),P(u.find(({value:M})=>M===n.target.value)),k(n)},S=m?l.createElement("span",{className:"select__asterisk"},"*"):null;return l.createElement("div",{className:i("select",s,{"select--error":d})},l.createElement("div",{className:i(`select__content select__content--position-${I}`,{"select__content--wide":p})},a?l.createElement("label",{className:"select__label",htmlFor:t},c||e?l.createElement("div",{className:"select__label-text"},l.createElement(r,{size:h===f.small?r.sizes.small:r.sizes.basic,theme:r.themes.emphasis},c),S,e):m?S:null):null,l.createElement("div",{className:i("select__native-wrapper",{"select__native-wrapper--wide":p})},l.createElement("select",v({"aria-label":a?void 0:c,className:i(`select__select select__select--variant-${h}`,{"select__select--wide":p}),id:t,name:y,onChange:H,onInvalid:n=>{_.onInvalid&&_.onInvalid(n),z(n)},ref:T,required:m},_),u.map(n=>l.createElement(j,v({key:n.value},n)))),l.createElement("span",{className:"select__chevron"},l.createElement(A,null))),d?l.createElement("div",{"aria-hidden":"true",className:"select__error"},d):null))});w.displayName="Select";const D=w,F=Object.assign(D,{labelPositions:b,variants:f});var Y=F;export{Y as default};
|
|
1
|
+
"use client";var L=Object.defineProperty;var o=Object.getOwnPropertySymbols;var x=Object.prototype.hasOwnProperty,C=Object.prototype.propertyIsEnumerable;var g=(e,s,t)=>s in e?L(e,s,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[s]=t,v=(e,s)=>{for(var t in s||(s={}))x.call(s,t)&&g(e,t,s[t]);if(o)for(var t of o(s))C.call(s,t)&&g(e,t,s[t]);return e};var E=(e,s)=>{var t={};for(var a in e)x.call(e,a)&&s.indexOf(a)<0&&(t[a]=e[a]);if(e!=null&&o)for(var a of o(e))s.indexOf(a)<0&&C.call(e,a)&&(t[a]=e[a]);return t};import i from"classnames";import*as l from"react";import $ from"../use-input-validation";import j from"../select-option/select-option";import r from"../text";import A from"../icons/18/arrow-down";import{labelPositions as b,variants as f}from"./select.types";const w=l.forwardRef((W,T)=>{var N=W,{children:e,className:s,id:t,isLabelVisible:a=!0,label:c,labelPosition:I=b.stacked,name:y,onChange:O=()=>{},onChangeOption:P=()=>{},options:u=[],required:m,variant:h=f.large,wide:p}=N,_=E(N,["children","className","id","isLabelVisible","label","labelPosition","name","onChange","onChangeOption","options","required","variant","wide"]);const[k,z,d]=$(),H=n=>{O(n),P(u.find(({value:M})=>M===n.target.value)),k(n)},S=m?l.createElement("span",{className:"select__asterisk"},"*"):null;return l.createElement("div",{className:i("select",s,{"select--error":d})},l.createElement("div",{className:i(`select__content select__content--position-${I}`,{"select__content--wide":p})},a?l.createElement("label",{className:"select__label",htmlFor:t},c||e?l.createElement("div",{className:"select__label-text"},l.createElement(r,{size:h===f.small?r.sizes.small:r.sizes.basic,theme:r.themes.emphasis},c),S,e):m?S:null):null,l.createElement("div",{className:i("select__native-wrapper",{"select__native-wrapper--wide":p})},l.createElement("select",v({"aria-label":a?void 0:c,className:i(`select__select select__select--variant-${h}`,{"select__select--wide":p}),id:t,name:y,onChange:H,onInvalid:n=>{_.onInvalid&&_.onInvalid(n),z(n)},ref:T,required:m},_),u.map(n=>l.createElement(j,v({key:n.value},n)))),l.createElement("span",{className:"select__chevron"},l.createElement(A,null))),d?l.createElement("div",{"aria-hidden":"true",className:"select__error"},d):null))});w.displayName="Select";const D=w,F=Object.assign(D,{labelPositions:b,variants:f});var Y=F;export{Y as default};
|
|
2
2
|
//# sourceMappingURL=select.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../react/select/select.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';\n\nimport Option from '../select-option/select-option';\nimport Text from '../text';\nimport SvgArrowDown from '../icons/18/arrow-down';\n\nimport { labelPositions, Select as Props, variants } from './select.types';\n\n// NOTE: `onChangeOption` works like `onChange` but returns the props for that option instead of an event object.\nconst RefSelect = React.forwardRef<\n HTMLSelectElement,\n React.PropsWithChildren<Props>\n>(\n (\n {\n children,\n className,\n id,\n isLabelVisible = true,\n label,\n labelPosition = labelPositions.stacked,\n name,\n onChange = () => {},\n onChangeOption = () => {},\n options = [],\n required,\n variant = variants.large,\n wide,\n ...restProps\n },\n ref,\n ) => {\n const [validationOnChange, onInvalid, error] = useInputValidation();\n\n const onInputChange = (e: React.ChangeEvent<HTMLSelectElement>) => {\n onChange(e);\n onChangeOption(options.find(({ value }) => value === e.target.value));\n validationOnChange(e);\n };\n\n const asterix = required ? (\n <span className=\"select__asterisk\">*</span>\n ) : null;\n\n return (\n <div className={cn('select', className, { 'select--error': error })}>\n <div\n className={cn(\n `select__content select__content--position-${labelPosition}`,\n { 'select__content--wide': wide },\n )}\n >\n {isLabelVisible ? (\n <label className=\"select__label\" htmlFor={id}>\n {label || children ? (\n <div className=\"select__label-text\">\n <Text\n size={\n variant === variants.small\n ? Text.sizes.small\n : Text.sizes.basic\n }\n theme={Text.themes.emphasis}\n >\n {label}\n </Text>\n {asterix}\n {children}\n </div>\n ) : required ? (\n asterix\n ) : null}\n </label>\n ) : null}\n <div\n className={cn('select__native-wrapper', {\n 'select__native-wrapper--wide': wide,\n })}\n >\n <select\n aria-label={isLabelVisible ? undefined : label}\n className={cn(\n `select__select select__select--variant-${variant}`,\n {\n 'select__select--wide': wide,\n },\n )}\n id={id}\n name={name}\n onChange={onInputChange}\n onInvalid={e => {\n // NOTE: To not break compatibility\n if (restProps.onInvalid) restProps.onInvalid(e);\n onInvalid(e);\n }}\n ref={ref}\n required={required}\n {...restProps}\n >\n {options.map(option => (\n <Option key={option.value} {...option} />\n ))}\n </select>\n <span className=\"select__chevron\">\n <SvgArrowDown />\n </span>\n </div>\n\n {/* NOTE: This is aria-hidden because reporting of validation errors is handled by the browser */}\n {error ? (\n <div aria-hidden=\"true\" className=\"select__error\">\n {error}\n </div>\n ) : null}\n </div>\n </div>\n );\n },\n);\n\n// NOTE: If this isn't set, stack traces say \"forwardRef\" instead of \"Select\"\nRefSelect.displayName = 'Select';\n\n// NOTE: Since `React.forwardRef` props aren't generic, the component is cast so that generics work as intended. See https://stackoverflow.com/a/58473012\nconst SelectComponent = RefSelect as <OptionExtra>(\n props: Props<OptionExtra> & {\n ref?: React.Ref<HTMLSelectElement>;\n },\n) => React.ReactElement;\n\nconst Select: typeof SelectComponent & {\n labelPositions: typeof labelPositions;\n variants: typeof variants;\n} = Object.assign(SelectComponent, { labelPositions, variants });\n\nexport default Select;\n"],
|
|
5
|
+
"mappings": "wgBAEA,OAAOA,MAAQ,aACf,UAAYC,MAAW,QAEvB,OAAOC,MAAwB,0BAE/B,OAAOC,MAAY,iCACnB,OAAOC,MAAU,UACjB,OAAOC,MAAkB,yBAEzB,OAAS,kBAAAC,EAAiC,YAAAC,MAAgB,iBAG1D,MAAMC,EAAYP,EAAM,WAItB,CACEQ,EAgBAC,IACG,CAjBH,IAAAC,EAAAF,EACE,UAAAG,EACA,UAAAC,EACA,GAAAC,EACA,eAAAC,EAAiB,GACjB,MAAAC,EACA,cAAAC,EAAgBX,EAAe,QAC/B,KAAAY,EACA,SAAAC,EAAW,IAAM,CAAC,EAClB,eAAAC,EAAiB,IAAM,CAAC,EACxB,QAAAC,EAAU,CAAC,EACX,SAAAC,EACA,QAAAC,EAAUhB,EAAS,MACnB,KAAAiB,CAhCN,EAmBIb,EAcKc,EAAAC,EAdLf,EAcK,CAbH,WACA,YACA,KACA,iBACA,QACA,gBACA,OACA,WACA,iBACA,UACA,WACA,UACA,SAKF,KAAM,CAACgB,EAAoBC,EAAWC,CAAK,EAAI3B,EAAmB,EAE5D4B,EAAiBC,GAA4C,CACjEZ,EAASY,CAAC,EACVX,EAAeC,EAAQ,KAAK,CAAC,CAAE,MAAAW,CAAM,IAAMA,IAAUD,EAAE,OAAO,KAAK,CAAC,EACpEJ,EAAmBI,CAAC,CACtB,EAEME,EAAUX,EACdrB,EAAA,cAAC,QAAK,UAAU,oBAAmB,GAAC,EAClC,KAEJ,OACEA,EAAA,cAAC,OAAI,UAAWD,EAAG,SAAUa,EAAW,CAAE,gBAAiBgB,CAAM,CAAC,GAChE5B,EAAA,cAAC,OACC,UAAWD,EACT,6CAA6CiB,CAAa,GAC1D,CAAE,wBAAyBO,CAAK,CAClC,GAECT,EACCd,EAAA,cAAC,SAAM,UAAU,gBAAgB,QAASa,GACvCE,GAASJ,EACRX,EAAA,cAAC,OAAI,UAAU,sBACbA,EAAA,cAACG,EAAA,CACC,KACEmB,IAAYhB,EAAS,MACjBH,EAAK,MAAM,MACXA,EAAK,MAAM,MAEjB,MAAOA,EAAK,OAAO,UAElBY,CACH,EACCiB,EACArB,CACH,EACEU,EACFW,EACE,IACN,EACE,KACJhC,EAAA,cAAC,OACC,UAAWD,EAAG,yBAA0B,CACtC,+BAAgCwB,CAClC,CAAC,GAEDvB,EAAA,cAAC,SAAAiC,EAAA,CACC,aAAYnB,EAAiB,OAAYC,EACzC,UAAWhB,EACT,0CAA0CuB,CAAO,GACjD,CACE,uBAAwBC,CAC1B,CACF,EACA,GAAIV,EACJ,KAAMI,EACN,SAAUY,EACV,UAAWC,GAAK,CAEVN,EAAU,WAAWA,EAAU,UAAUM,CAAC,EAC9CH,EAAUG,CAAC,CACb,EACA,IAAKrB,EACL,SAAUY,GACNG,GAEHJ,EAAQ,IAAIc,GACXlC,EAAA,cAACE,EAAA+B,EAAA,CAAO,IAAKC,EAAO,OAAWA,EAAQ,CACxC,CACH,EACAlC,EAAA,cAAC,QAAK,UAAU,mBACdA,EAAA,cAACI,EAAA,IAAa,CAChB,CACF,EAGCwB,EACC5B,EAAA,cAAC,OAAI,cAAY,OAAO,UAAU,iBAC/B4B,CACH,EACE,IACN,CACF,CAEJ,CACF,EAGArB,EAAU,YAAc,SAGxB,MAAM4B,EAAkB5B,EAMlB6B,EAGF,OAAO,OAAOD,EAAiB,CAAE,eAAA9B,EAAgB,SAAAC,CAAS,CAAC,EAE/D,IAAO+B,EAAQD",
|
|
6
6
|
"names": ["cn", "React", "useInputValidation", "Option", "Text", "SvgArrowDown", "labelPositions", "variants", "RefSelect", "_a", "ref", "_b", "children", "className", "id", "isLabelVisible", "label", "labelPosition", "name", "onChange", "onChangeOption", "options", "required", "variant", "wide", "restProps", "__objRest", "validationOnChange", "onInvalid", "error", "onInputChange", "e", "value", "asterix", "__spreadValues", "option", "SelectComponent", "Select", "select_default"]
|
|
7
7
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
var O=Object.defineProperty;var p=Object.getOwnPropertySymbols;var b=Object.prototype.hasOwnProperty,y=Object.prototype.propertyIsEnumerable;var g=(e,t,a)=>t in e?O(e,t,{enumerable:!0,configurable:!0,writable:!0,value:a}):e[t]=a,A=(e,t)=>{for(var a in t||(t={}))b.call(t,a)&&g(e,a,t[a]);if(p)for(var a of p(t))y.call(t,a)&&g(e,a,t[a]);return e};var C=(e,t)=>{var a={};for(var i in e)b.call(e,i)&&t.indexOf(i)<0&&(a[i]=e[i]);if(e!=null&&p)for(var i of p(e))t.indexOf(i)<0&&y.call(e,i)&&(a[i]=e[i]);return a};import d from"classnames";import*as r from"react";import n from"../text";import W from"../use-input-validation";import{themes as I,sizes as
|
|
1
|
+
"use client";var O=Object.defineProperty;var p=Object.getOwnPropertySymbols;var b=Object.prototype.hasOwnProperty,y=Object.prototype.propertyIsEnumerable;var g=(e,t,a)=>t in e?O(e,t,{enumerable:!0,configurable:!0,writable:!0,value:a}):e[t]=a,A=(e,t)=>{for(var a in t||(t={}))b.call(t,a)&&g(e,a,t[a]);if(p)for(var a of p(t))y.call(t,a)&&g(e,a,t[a]);return e};var C=(e,t)=>{var a={};for(var i in e)b.call(e,i)&&t.indexOf(i)<0&&(a[i]=e[i]);if(e!=null&&p)for(var i of p(e))t.indexOf(i)<0&&y.call(e,i)&&(a[i]=e[i]);return a};import d from"classnames";import*as r from"react";import n from"../text";import W from"../use-input-validation";import{themes as I,sizes as c}from"./text-area.types";const k=r.forwardRef((B,E)=>{var z=B,{children:e,helpText:t,label:a,name:i,placeholder:w,disabled:u,required:v,isLabelVisible:N=!0,helpIcon:T,size:x=c.default,theme:s=I.light,isShort:$,maxLength:m,defaultValue:l}=z,_=C(z,["children","helpText","label","name","placeholder","disabled","required","isLabelVisible","helpIcon","size","theme","isShort","maxLength","defaultValue"]);const[j,H,f]=W(),[M,h]=r.useState(0);return r.useEffect(()=>{l&&(typeof l=="string"?h(l.length):typeof l=="number"&&h(l))},[_]),r.createElement("label",{className:"text-area"},r.createElement("div",{className:"text-area__wrapper"},N?r.createElement("div",{className:"text-area__header"},r.createElement(n,{theme:n.themes.emphasis,size:x===c.default?n.sizes.basic:n.sizes.small,className:d("text-area__label",{[`text-area__label--theme-${s}-disabled`]:u,[`text-area__label--theme-${s}`]:s})},a,v?r.createElement("span",{className:d("text-area__asterisk",{[`text-area__asterisk--theme-${s}-disabled`]:u,[`text-area__asterisk--theme-${s}`]:s})},"*"):null,e),m?r.createElement(n,{className:"text-area__max",size:n.sizes.small},M,"/",m):null):null,r.createElement("textarea",A({className:d("text-area__input",{[`text-area__input--theme-${s}`]:s,[`text-area__input--theme-${s}-error`]:f,[`text-area__input--size-${x}-short`]:$,[`text-area__input--size-${x}`]:x}),"aria-label":N?a:void 0,name:i,maxLength:m,ref:E,cols:1,required:v,defaultValue:l,rows:$?1:2,onChange:o=>{_.onChange&&_.onChange(o),j(o),m&&h(o.target.value.length)},onInvalid:o=>{_.onInvalid&&_.onInvalid(o),H(o)},placeholder:w,disabled:u},_))),t?r.createElement("div",{className:"text-area__help"},r.createElement(n,{size:n.sizes.interface,className:d("text-area__help-text",{[`text-area__help-text--theme-${s}-error`]:f,[`text-area__help-text--theme-${s}`]:s})},T||null,t)):null,f&&r.createElement("div",{"aria-hidden":"true",className:"text-area__error"},r.createElement(n,null,f)))});k.displayName="TextArea";const q=Object.assign(k,{themes:I,sizes:c});var S=q;export{S as default};
|
|
2
2
|
//# sourceMappingURL=text-area.js.map
|