@box/unified-share-modal 3.7.13 → 3.7.15
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.
|
@@ -1 +1 @@
|
|
|
1
|
-
import{isDomainValid,isEmailValid}from"../esm/lib/utils/validation.js";import messages from"../esm/lib/components/manage-access-list-modal/messages.js";import{t as AccessList}from"./access-list.js";import{useEffect,useMemo,useState}from"react";import clsx from"clsx";import noop from"lodash/noop";import{useIntl}from"react-intl";import{Button,Divider,Modal,SearchInput,Text,TextInput}from"@box/blueprint-web";import{Plus}from"@box/blueprint-web-assets/icons/Medium";import{jsx,jsxs}from"react/jsx-runtime";import '../styles/manage-access-list-modal.css';var manage_access_list_modal_module_default={content:`_content_1hi1x_1`,isFullscreen:`_isFullscreen_1hi1x_1`,body:`_body_1hi1x_10`,divider:`_divider_1hi1x_23`,add:`_add_1hi1x_31`},INPUT_MAX_LENGTH=255;function ManageAccessListModal({entries:initialEntries,isDesktop=!1,isOpen,isSubmitting=!1,onOpenChange,onSubmit}){let{formatMessage}=useIntl(),[entries,setEntries]=useState(initialEntries),[inputValue,setInputValue]=useState(``),[inputError,setInputError]=useState(``),[searchValue,setSearchValue]=useState(``),[isInputVisible,setIsInputVisible]=useState(!1);useEffect(()=>{entries.length||setIsInputVisible(!0)},[entries]);let listItems=useMemo(()=>{let query=searchValue.trim().toLowerCase(),items=[...entries].sort((a,b)=>b.createdAt-a.createdAt);return query?items.filter(({value})=>value.toLowerCase().includes(query)):items},[entries,searchValue]),handleInputSubmit=()=>{let input=inputValue.trim();if(!input||entries.some(({value})=>value.toLowerCase()===input.toLowerCase()))return setInputValue(``),entries;if(input.length>INPUT_MAX_LENGTH)return setInputError(formatMessage(messages.inputMaxLengthError)),null;let type=input.includes(`@`)?`email`:`domain`;if(type===`email`&&!isEmailValid(input)||type===`domain`&&!isDomainValid(input))return setInputError(formatMessage(messages.inputInvalidError)),null;let nextEntries=[{createdAt:Date.now(),type,value:input},...entries];return setInputValue(``),setEntries(nextEntries),nextEntries};return jsx(Modal,{onOpenChange:isSubmitting?noop:onOpenChange,open:isOpen,children:jsxs(Modal.Content,{className:clsx(manage_access_list_modal_module_default.content,isDesktop&&manage_access_list_modal_module_default.isFullscreen),onEscapeKeyDown:event=>{event.stopPropagation()},onPointerDownOutside:event=>{event.preventDefault()},size:`large`,children:[jsx(Modal.Header,{children:formatMessage(messages.title)}),jsx(Modal.ScrollableContainer,{children:jsxs(Modal.Body,{className:manage_access_list_modal_module_default.body,children:[isDesktop&&jsx(Divider,{className:manage_access_list_modal_module_default.divider}),jsx(Text,{as:`p`,children:formatMessage(messages.description)}),jsx(SearchInput.Controlled,{onChange:event=>setSearchValue(event.target.value),onClearInput:()=>setSearchValue(``),placeholder:formatMessage(messages.searchPlaceholder),searchInputAriaLabel:formatMessage(messages.searchLabel),searchInputClearAriaLabel:formatMessage(messages.clearButton),value:searchValue}),isInputVisible&&jsx(TextInput,{autoFocus:!0,disabled:isSubmitting,error:inputError,hideLabel:!0,label:formatMessage(messages.inputLabel),onChange:event=>{setInputError(``),setInputValue(event.target.value)},onKeyDown:event=>{event.key===`Enter`&&!isSubmitting&&handleInputSubmit()},placeholder:formatMessage(messages.inputPlaceholder),value:inputValue}),jsx(AccessList,{entries:listItems,isDisabled:isSubmitting,onRemove:target=>{setEntries(prev=>prev.filter(({value})=>value!==target))}}),listItems.length===0&&jsx(Text,{as:`p`,color:`textOnLightSecondary`,children:formatMessage(searchValue.trim()?messages.noSearchResults:messages.emptyAccessList)})]})}),jsxs(Modal.Footer,{children:[jsx(Button,{className:manage_access_list_modal_module_default.add,disabled:isSubmitting,onClick:()=>setIsInputVisible(!0),size:`large`,startIcon:Plus,variant:`tertiary`,children:formatMessage(messages.addButton)}),jsx(Modal.Footer.SecondaryButton,{disabled:isSubmitting,onClick:()=>onOpenChange(!1),children:formatMessage(messages.cancelButton)}),jsx(Modal.Footer.PrimaryButton,{loading:isSubmitting,loadingAriaLabel:formatMessage(messages.loadingLabel),onClick:()=>{let validEntries=handleInputSubmit();validEntries&&onSubmit(validEntries)},children:formatMessage(messages.saveButton)})]}),!isDesktop&&jsx(Modal.Close,{"aria-label":formatMessage(messages.closeButton),disabled:isSubmitting})]})})}export{ManageAccessListModal as t};
|
|
1
|
+
import{isDomainValid,isEmailValid}from"../esm/lib/utils/validation.js";import messages from"../esm/lib/components/manage-access-list-modal/messages.js";import{t as AccessList}from"./access-list.js";import{useEffect,useMemo,useState}from"react";import clsx from"clsx";import noop from"lodash/noop";import{useIntl}from"react-intl";import{Button,Divider,Modal,SearchInput,Text,TextInput}from"@box/blueprint-web";import{Plus}from"@box/blueprint-web-assets/icons/Medium";import{jsx,jsxs}from"react/jsx-runtime";import '../styles/manage-access-list-modal.css';var manage_access_list_modal_module_default={content:`_content_1hi1x_1`,isFullscreen:`_isFullscreen_1hi1x_1`,body:`_body_1hi1x_10`,divider:`_divider_1hi1x_23`,add:`_add_1hi1x_31`},INPUT_MAX_LENGTH=255;function ManageAccessListModal({entries:initialEntries,isDesktop=!1,isOpen,isSubmitting=!1,onOpenChange,onSubmit}){let{formatMessage}=useIntl(),[entries,setEntries]=useState(initialEntries),[inputValue,setInputValue]=useState(``),[inputError,setInputError]=useState(``),[searchValue,setSearchValue]=useState(``),[isInputVisible,setIsInputVisible]=useState(!1);useEffect(()=>{entries.length||setIsInputVisible(!0)},[entries]);let listItems=useMemo(()=>{let query=searchValue.trim().toLowerCase(),items=[...entries].sort((a,b)=>b.createdAt-a.createdAt);return query?items.filter(({value})=>value.toLowerCase().includes(query)):items},[entries,searchValue]),handleInputSubmit=()=>{let input=inputValue.trim();if(!input||entries.some(({value})=>value.toLowerCase()===input.toLowerCase()))return setInputValue(``),entries;if(input.length>INPUT_MAX_LENGTH)return setInputError(formatMessage(messages.inputMaxLengthError)),null;let type=input.includes(`@`)?`email`:`domain`;if(type===`email`&&!isEmailValid(input)||type===`domain`&&!isDomainValid(input))return setInputError(formatMessage(messages.inputInvalidError)),null;let nextEntries=[{createdAt:Date.now(),type,value:input},...entries];return setInputValue(``),setEntries(nextEntries),nextEntries};return jsx(Modal,{onOpenChange:isSubmitting?noop:onOpenChange,open:isOpen,children:jsxs(Modal.Content,{className:clsx(manage_access_list_modal_module_default.content,isDesktop&&manage_access_list_modal_module_default.isFullscreen),onEscapeKeyDown:event=>{event.stopPropagation()},onPointerDownOutside:event=>{event.preventDefault()},size:`large`,children:[jsx(Modal.Header,{children:formatMessage(messages.title)}),jsx(Modal.ScrollableContainer,{children:jsxs(Modal.Body,{className:manage_access_list_modal_module_default.body,children:[isDesktop&&jsx(Divider,{className:manage_access_list_modal_module_default.divider}),jsx(Text,{as:`p`,children:formatMessage(messages.description)}),jsx(SearchInput.Controlled,{onChange:event=>setSearchValue(event.target.value),onClearInput:()=>setSearchValue(``),placeholder:formatMessage(messages.searchPlaceholder),searchInputAriaLabel:formatMessage(messages.searchLabel),searchInputClearAriaLabel:formatMessage(messages.clearButton),value:searchValue}),isInputVisible&&jsx(TextInput,{autoFocus:!0,disabled:isSubmitting,error:inputError,hideLabel:!0,label:formatMessage(messages.inputLabel),onChange:event=>{setInputError(``),setInputValue(event.target.value)},onKeyDown:event=>{event.key===`Enter`&&!isSubmitting&&handleInputSubmit()},placeholder:formatMessage(messages.inputPlaceholder),value:inputValue}),jsx(AccessList,{entries:listItems,isDisabled:isSubmitting,onRemove:target=>{setEntries(prev=>prev.filter(({value})=>value!==target))}}),listItems.length===0&&jsx(Text,{as:`p`,color:`textOnLightSecondary`,children:formatMessage(searchValue.trim()?messages.noSearchResults:messages.emptyAccessList)})]})}),jsxs(Modal.Footer,{children:[jsx(Button,{className:manage_access_list_modal_module_default.add,disabled:isSubmitting,onClick:()=>{if(!isInputVisible){setIsInputVisible(!0);return}handleInputSubmit()},size:`large`,startIcon:Plus,variant:`tertiary`,children:formatMessage(messages.addButton)}),jsx(Modal.Footer.SecondaryButton,{disabled:isSubmitting,onClick:()=>onOpenChange(!1),children:formatMessage(messages.cancelButton)}),jsx(Modal.Footer.PrimaryButton,{loading:isSubmitting,loadingAriaLabel:formatMessage(messages.loadingLabel),onClick:()=>{let validEntries=handleInputSubmit();validEntries&&onSubmit(validEntries)},children:formatMessage(messages.saveButton)})]}),!isDesktop&&jsx(Modal.Close,{"aria-label":formatMessage(messages.closeButton),disabled:isSubmitting})]})})}export{ManageAccessListModal as t};
|