@idea-fragments/react-components-zendesk 0.1.34 → 0.1.35

package/dist/tables.js

@@ -11846,7 +11846,7 @@ TextField=styled__default["default"](TextField)(templateObject_1$f||(templateObj
 TextField.COMPONENT_NAME="TextField";var templateObject_1$f;var logger$1=new Logger("TableFilter");var TableFilter=function(_a){var _b,_c;var fieldName=_a.fieldName,label=_a.label,onChange=_a.onChange,options=_a.options,type=_a.type,value=_a.value;logger$1.writeInfo("render",fieldName,value);var sendChanges=React__default.useCallback(function(v){onChange(fieldName,v);},[fieldName,onChange]);// @ts-ignore
 var SelectorComponent=React__default.useMemo(function(){if(type==="multi-select")return MultiSelector;if(type==="select")return Selector;if(type==="searchable-select")return SearchableSelector;return undefined;},[type]);var selectorEmptyState=function(){if(type==="multi-select")return"Select one or more";if(type==="searchable-select")return"Type to search";if(type==="select")return"Select one";return"";};if(SelectorComponent){return jsxRuntime.jsx(SelectorComponent,__assign({appendMenuToNode:document.body,clearable:true,emptyState:selectorEmptyState(),keyField:"value",label:label,labelField:"label",maxMenuHeight:"200px",menuPopperModifiers:[{name:"flip",enabled:true}],// @ts-ignore
 onChange:sendChanges,options:options,placement:"bottom"},type==="multi-select"?{selectedKeys:(_b=value)!==null&&_b!==void 0?_b:[],maxItems:2}:{selectedKey:value},{small:true}));}return jsxRuntime.jsx(TextField,{label:label,emptyState:label,onChange:sendChanges,small:true,useNewOnChange:true,value:(_c=value)!==null&&_c!==void 0?_c:""});};var useTheme=function(){return React__default.useContext(styled.ThemeContext);};// export const setThemeContext = (ctx :)
-var IGNORABLE_STATE_CHANGES=[Downshift$1.stateChangeTypes.blurInput,Downshift$1.stateChangeTypes.blurButton,Downshift$1.stateChangeTypes.mouseUp];var Filters=function(_a){var columnConfigs=_a.columnConfigs,filterState=_a.filterState,onFiltersChange=_a.onFiltersChange;var theme=useTheme();var _b=__read(React__default.useState(filterState!==null&&filterState!==void 0?filterState:{}),2),state=_b[0],setState=_b[1];var _c=__read(React__default.useState({isOpen:false}),2),dropdownState=_c[0],setDropdownState=_c[1];var filters=React__default.useMemo(function(){return columnConfigs.filter(function(c){return c.filter;}).map(function(c){return c.filter;});},[columnConfigs]);var closeMenu=React__default.useCallback(function(){setDropdownState({isOpen:false});},[]);var applyFilters=React__default.useCallback(function(){onFiltersChange(state);closeMenu();},[closeMenu,onFiltersChange,state]);var clearFilters=React__default.useCallback(function(){onFiltersChange({});setState({});closeMenu();},[closeMenu,onFiltersChange]);var processDropdownStateChange=function(_a){var isOpen=_a.isOpen,type=_a.type;if(isOpen==null||IGNORABLE_STATE_CHANGES.includes(type))return;setDropdownState({isOpen:isOpen});};var trackChanges=React__default.useCallback(function(fieldName,value){setState(function(prev){var _a;return __assign(__assign({},prev),(_a={},_a[fieldName]=value,_a));});},[]);if(isEmpty(filters))return null;return jsxRuntime.jsx(FlexBox,{children:jsxRuntime.jsx(Dropdown,{appendMenuToNode:document.body,isOpen:dropdownState.isOpen,menuCSS:styled.css(templateObject_1$e||(templateObject_1$e=__makeTemplateObject(["&& { font-size: ","; }"],["&& { font-size: ","; }"])),function(_a){var theme=_a.theme;return theme.styles.font.size;}),onStateChange:processDropdownStateChange,options:[jsxRuntime.jsxs(FlexBox,__assign({as:"li",_css:styled.css(templateObject_2$9||(templateObject_2$9=__makeTemplateObject(["padding: ","; width: 300px; max-width: 100%; max-height: 100%;"],["padding: ","; width: 300px; max-width: 100%; max-height: 100%;"])),SPACINGS.SM),withRows:true},{children:[jsxRuntime.jsx(IconButton,{_css:styled.css(templateObject_3$7||(templateObject_3$7=__makeTemplateObject(["align-self: flex-end; padding: .5rem; margin-bottom: -2rem;"],["align-self: flex-end; padding: .5rem; margin-bottom: -2rem;"]))),color:theme.styles.textColorPrimary,compact:true,icon:js.mdiClose,onClick:closeMenu}),filters.map(function(f){return(// @ts-ignore
+var IGNORABLE_STATE_CHANGES=[Downshift$1.stateChangeTypes.blurInput,Downshift$1.stateChangeTypes.blurButton,Downshift$1.stateChangeTypes.mouseUp,Downshift$1.stateChangeTypes.touchEnd];var Filters=function(_a){var columnConfigs=_a.columnConfigs,filterState=_a.filterState,onFiltersChange=_a.onFiltersChange;var theme=useTheme();var _b=__read(React__default.useState(filterState!==null&&filterState!==void 0?filterState:{}),2),state=_b[0],setState=_b[1];var _c=__read(React__default.useState({isOpen:false}),2),dropdownState=_c[0],setDropdownState=_c[1];var filters=React__default.useMemo(function(){return columnConfigs.filter(function(c){return c.filter;}).map(function(c){return c.filter;});},[columnConfigs]);var closeMenu=React__default.useCallback(function(){setDropdownState({isOpen:false});},[]);var applyFilters=React__default.useCallback(function(){onFiltersChange(state);closeMenu();},[closeMenu,onFiltersChange,state]);var clearFilters=React__default.useCallback(function(){onFiltersChange({});setState({});closeMenu();},[closeMenu,onFiltersChange]);var processDropdownStateChange=function(_a){var isOpen=_a.isOpen,type=_a.type;console.log("processDropdownStateChange",isOpen,type);if(isOpen==null||IGNORABLE_STATE_CHANGES.includes(type))return;setDropdownState({isOpen:isOpen});};var trackChanges=React__default.useCallback(function(fieldName,value){setState(function(prev){var _a;return __assign(__assign({},prev),(_a={},_a[fieldName]=value,_a));});},[]);if(isEmpty(filters))return null;return jsxRuntime.jsx(FlexBox,{children:jsxRuntime.jsx(Dropdown,{appendMenuToNode:document.body,isOpen:dropdownState.isOpen,menuCSS:styled.css(templateObject_1$e||(templateObject_1$e=__makeTemplateObject(["&& { font-size: ","; }"],["&& { font-size: ","; }"])),function(_a){var theme=_a.theme;return theme.styles.font.size;}),onStateChange:processDropdownStateChange,options:[jsxRuntime.jsxs(FlexBox,__assign({as:"li",_css:styled.css(templateObject_2$9||(templateObject_2$9=__makeTemplateObject(["padding: ","; width: 300px; max-width: 100%; max-height: 100%;"],["padding: ","; width: 300px; max-width: 100%; max-height: 100%;"])),SPACINGS.SM),withRows:true},{children:[jsxRuntime.jsx(IconButton,{_css:styled.css(templateObject_3$7||(templateObject_3$7=__makeTemplateObject(["align-self: flex-end; padding: .5rem; margin-bottom: -2rem;"],["align-self: flex-end; padding: .5rem; margin-bottom: -2rem;"]))),color:theme.styles.textColorPrimary,compact:true,icon:js.mdiClose,onClick:closeMenu}),filters.map(function(f){return(// @ts-ignore
 jsxRuntime.jsx(TableFilter,{fieldName:f.fieldName,label:f.label,onChange:trackChanges,options:f.options,type:f.type,value:state[f.fieldName]},f.fieldName));}),jsxRuntime.jsxs(FlexBox,__assign({_css:styled.css(templateObject_4$3||(templateObject_4$3=__makeTemplateObject(["margin-top: ",";"],["margin-top: ",";"])),SPACINGS.SM),withRows:true},{children:[jsxRuntime.jsx(Button,__assign({fluid:true,onClick:applyFilters},{children:"Apply"})),jsxRuntime.jsx(Button,__assign({fluid:true,danger:true,onClick:clearFilters,primary:false},{children:"Clear All"}))]}))]}),"table_filters_menu")],trigger:jsxRuntime.jsx(Button,__assign({icon:js.mdiFilterVariant,onClick:DO_NOTHING,primary:false},{children:"Filter"})),useRawOptions:true})});};var templateObject_1$e,templateObject_2$9,templateObject_3$7,templateObject_4$3;var Message=styled__default["default"](Message$3)(templateObject_1$d||(templateObject_1$d=__makeTemplateObject(["\n  &&& {\n    font-size: ",";\n  }\n"],["\n  &&& {\n    font-size: ",";\n  }\n"])),FONT_SIZES.XS);var templateObject_1$d;var Checkbox=function(_a){var _b,_c,_d;var checkedProp=(_b=_a.checked,_b===void 0?false:_b);_a.compact;_a.emptyState;var fluid=_a.fluid,hint=_a.hint,indeterminate=_a.indeterminate,label=_a.label,message=_a.message,validation=(_c=_a.validation,_c===void 0?{validation:VALIDATION_STATES.NONE}:_c),onChange=_a.onChange,props=__rest(_a,["checked","compact","emptyState","fluid","hint","indeterminate","label","message","validation","onChange"]);var checked=(_d=__read(React__default.useState(checkedProp),2),_d[0]),setCheckedTo=_d[1];var handleCheck=function(e){var checked=e.target.checked;setCheckedTo(checked);onChange(checked);};React__default.useEffect(function(){setCheckedTo(checkedProp);},[checkedProp]);return jsxRuntime.jsx(Container$2,__assign({fluid:fluid,gap:null,withRows:true},{children:jsxRuntime.jsx(Field$2,{children:jsxRuntime.jsxs(Checkbox$1,__assign({checked:checked,indeterminate:indeterminate},props,{onChange:handleCheck},{children:[jsxRuntime.jsx(Label$1$1,__assign({hidden:!label},{children:label!==null&&label!==void 0?label:""})),hint?jsxRuntime.jsx(Hint,{children:hint}):null,message?jsxRuntime.jsx(Message,__assign({validation:validation===null||validation===void 0?void 0:validation.validation},{children:message})):null]}))})}));};Checkbox=styled__default["default"](Checkbox)(templateObject_1$c||(templateObject_1$c=__makeTemplateObject(["\n  &&&& {\n    font-size: inherit;\n\n    :hover {\n      border-color: ",";\n    }\n\n    :focus {\n      border-color: ",";\n      box-shadow: ",";\n    }\n  }\n"],["\n  &&&& {\n    font-size: inherit;\n\n    :hover {\n      border-color: ",";\n    }\n\n    :focus {\n      border-color: ",";\n      box-shadow: ",";\n    }\n  }\n"])),function(_a){var theme=_a.theme;return theme.styles.colorPrimary;},function(_a){var theme=_a.theme;return dark(theme.styles.colorPrimary);},function(_a){var theme=_a.theme;return"0 0 0 3px ".concat(fade(theme.styles.colorPrimary));});var Container$2=styled__default["default"](FlexBox)(templateObject_2$8||(templateObject_2$8=__makeTemplateObject(["\n  ","\n  && * {\n    font-size: inherit;\n  }\n"],["\n  ","\n  && * {\n    font-size: inherit;\n  }\n"])),function(_a){var fluid=_a.fluid;return fluid?"width: 100%;":"";});var templateObject_1$c,templateObject_2$8;/**
  * Copyright Zendesk, Inc.
  *