@vibe/core 3.45.0-alpha-816b6.0 → 3.45.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/dist/mocked_classnames/src/components/Dropdown/components/MultiValueContainer/MultiValueContainer.js +1 -1
- package/dist/mocked_classnames/src/components/Dropdown/components/MultiValueContainer/MultiValueContainer.js.map +1 -1
- package/dist/src/components/Dropdown/components/MultiValueContainer/MultiValueContainer.js +1 -1
- package/dist/src/components/Dropdown/components/MultiValueContainer/MultiValueContainer.js.map +1 -1
- package/package.json +2 -2
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{objectWithoutProperties as e,slicedToArray as t,defineProperty as n,extends as o}from"../../../../../_virtual/_rollupPluginBabelHelpers.js";import
|
|
1
|
+
import{objectWithoutProperties as e,slicedToArray as t,defineProperty as n,extends as o}from"../../../../../_virtual/_rollupPluginBabelHelpers.js";import i,{useState as a,useEffect as l,useCallback as r}from"react";import{components as s}from"react-select";import c from"classnames";import{useHiddenOptionsData as p}from"../../hooks/useHiddenOptionsData.js";import u from"../../../Counter/Counter.js";import m from"../../../Dialog/Dialog.js";import d from"../../../DialogContentContainer/DialogContentContainer.js";import h from"../../../Chips/Chips.js";import f from"./MultiValueContainer.module.scss.js";var v=["children","selectProps"];function g(g){var C=g.children,E=g.selectProps,D=e(g,v),w=E.isDisabled,P=E.placeholder,N=E.inputValue,b=E.selectProps,y=void 0===b?{}:b,j=E.withMandatoryDefaultOptions,M=E.readOnly,O=y.selectedOptions,k=y.onSelectedDelete,x=y.isMultiline,A=y.popupsContainerSelector,S=y.size,T=y.dialogClassName,V=C[1],B=a(),I=t(B,2),F=I[0],H=I[1],R=a(!1),W=t(R,2),_=W[0],z=W[1],q=0===O.length&&!N,G=f["chip-with-input-wrapper"],J=c(x?f["multiselect-chip-multi-line"]:f["multiselect-chip-single-line-".concat(S)],n({},f["multiselect-chip-disabled"],w)),K=p({isMultiline:x,ref:F,chipClassName:J,chipWrapperClassName:G,selectedOptionsCount:O.length,isCounterShown:_}),L=K.overflowIndex,Q=K.hiddenOptionsCount;l((function(){z(Q>0)}),[Q]);var U=r((function(e){k(e.value,{action:"remove-value",removedValue:e})}),[k]),X=["primary","negative","positive"],Y=r((function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:0,t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:O.length;return O.map((function(n,o){var a=X.includes(n.chipColor)?n.chipColor:"primary";return o>=e&&t>o?i.createElement(h,{"data-testid":"value-container-chip",key:n.value,className:c(f.chips,J),noAnimation:!0,disabled:w,id:n.value,label:n.label,onDelete:function(){return U(n)},disableClickableBehavior:!0,onMouseDown:function(e){e.stopPropagation()},readOnly:M||j&&n.isMandatory,allowTextSelection:M,leftRenderer:n.leftRenderer,leftAvatar:n.leftAvatar,leftIcon:n.leftIcon,color:a}):null}))}),[O,J,w,M,j,U,S]);return i.createElement(s.ValueContainer,o({selectProps:E},D),i.createElement("div",{className:f["value-container"],onTouchEndCapture:function(e){e.stopPropagation()}},q&&i.createElement("div",{className:f["placeholder-container"]},i.createElement(s.Placeholder,D,P)),i.createElement("div",{className:c(f["value-container-chips"],n({},f["without-placeholder"],!q)),ref:function(e){return H(e)},"data-testid":"value-container-chips"},_?i.createElement(i.Fragment,null,Y(0,L-1),i.createElement("div",{className:G},Y(L-1,L),V),Y(L)):i.createElement(i.Fragment,null,Y(0,O.length-1),i.createElement("div",{className:G},Y(O.length-1),V))),i.createElement("div",null,_&&i.createElement(m,{content:function(){return i.createElement(d,{className:f.valueDialogContent,onMouseDown:function(e){e.stopPropagation()}},Y(L))},containerSelector:A,tooltip:!0,showTrigger:"click",hideTrigger:"clickoutside",position:"bottom",moveBy:{main:5},wrapperClassName:T},i.createElement(u,{kind:"line",prefix:"+",count:Q,onMouseDown:function(e){e.stopPropagation()},noAnimation:!0})))))}export{g as default};
|
|
2
2
|
//# sourceMappingURL=MultiValueContainer.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MultiValueContainer.js","sources":["../../../../../../../src/components/Dropdown/components/MultiValueContainer/MultiValueContainer.jsx"],"sourcesContent":["import React, { useCallback, useEffect, useState } from \"react\";\nimport { components } from \"react-select\";\nimport cx from \"classnames\";\nimport { useHiddenOptionsData } from \"../../hooks/useHiddenOptionsData\";\nimport Counter from \"../../../Counter/Counter\";\nimport Dialog from \"../../../Dialog/Dialog\";\nimport DialogContentContainer from \"../../../DialogContentContainer/DialogContentContainer\";\nimport Chips from \"../../../Chips/Chips\";\nimport classes from \"./MultiValueContainer.module.scss\";\n\nconst DIALOG_OFFSET_Y = 5;\n\nexport default function Container({ children, selectProps, ...otherProps }) {\n const {\n isDisabled,\n placeholder,\n inputValue,\n selectProps: customProps = {},\n withMandatoryDefaultOptions,\n readOnly\n } = selectProps;\n const { selectedOptions, onSelectedDelete, isMultiline, popupsContainerSelector, size, dialogClassName } =\n customProps;\n const clickHandler = children[1];\n const [ref, setRef] = useState();\n const [isCounterShown, setIsCounterShown] = useState(false);\n const showPlaceholder = selectedOptions.length === 0 && !inputValue;\n const chipWrapperClassName = classes[\"chip-with-input-wrapper\"];\n const chipClassName = cx(\n isMultiline ? classes[\"multiselect-chip-multi-line\"] : classes[`multiselect-chip-single-line-${size}`],\n { [classes[\"multiselect-chip-disabled\"]]: isDisabled }\n );\n\n const { overflowIndex, hiddenOptionsCount } = useHiddenOptionsData({\n isMultiline,\n ref,\n chipClassName,\n chipWrapperClassName,\n selectedOptionsCount: selectedOptions.length,\n isCounterShown\n });\n\n useEffect(() => {\n setIsCounterShown(hiddenOptionsCount > 0);\n }, [hiddenOptionsCount]);\n\n const onDelete = useCallback(\n option => {\n onSelectedDelete(option.value, { action: \"remove-value\", removedValue: option });\n },\n [onSelectedDelete]\n );\n\n const DropdownChipColors = [\"primary\", \"negative\", \"positive\"];\n const renderOptions = useCallback(\n (from = 0, to = selectedOptions.length) =>\n selectedOptions.map((option, index) => {\n const overrideChipColor = DropdownChipColors.includes(option.chipColor) ? option.chipColor : \"primary\";\n return index >= from && index < to ? (\n <Chips\n data-testid=\"value-container-chip\"\n key={option.value}\n className={cx(classes.chips, chipClassName)}\n noAnimation\n disabled={isDisabled}\n id={option.value}\n label={option.label}\n onDelete={() => onDelete(option)}\n disableClickableBehavior\n onMouseDown={e => {\n e.stopPropagation();\n }}\n readOnly={readOnly || (withMandatoryDefaultOptions && option.isMandatory)}\n allowTextSelection={readOnly}\n leftRenderer={option.leftRenderer}\n leftAvatar={option.leftAvatar}\n leftIcon={option.leftIcon}\n color={overrideChipColor}\n />\n ) : null;\n }),\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [selectedOptions, chipClassName, isDisabled, readOnly, withMandatoryDefaultOptions, onDelete, size]\n );\n\n return (\n <components.ValueContainer selectProps={selectProps} {...otherProps}>\n <div\n className={classes[\"value-container\"]}\n onTouchEndCapture={e => {\n e.stopPropagation();\n }}\n >\n {showPlaceholder && (\n <div className={classes[\"placeholder-container\"]}>\n <components.Placeholder {...otherProps}>{placeholder}</components.Placeholder>\n </div>\n )}\n <div\n className={cx(classes[\"value-container-chips\"], { [classes[\"without-placeholder\"]]: !showPlaceholder })}\n ref={newRef => setRef(newRef)}\n data-testid=\"value-container-chips\"\n >\n {isCounterShown ? (\n <>\n {renderOptions(0, overflowIndex - 1)}\n <div className={chipWrapperClassName}>\n {renderOptions(overflowIndex - 1, overflowIndex)}\n {clickHandler}\n </div>\n {renderOptions(overflowIndex)}\n </>\n ) : (\n <>\n {renderOptions(0, selectedOptions.length - 1)}\n <div className={chipWrapperClassName}>\n {renderOptions(selectedOptions.length - 1)}\n {clickHandler}\n </div>\n </>\n )}\n </div>\n <div>\n {isCounterShown && (\n <Dialog\n content={() => (\n <DialogContentContainer className={classes.valueDialogContent}>\n {renderOptions(overflowIndex)}\n </DialogContentContainer>\n )}\n containerSelector={popupsContainerSelector}\n tooltip\n showTrigger=\"click\"\n hideTrigger=\"clickoutside\"\n position=\"bottom\"\n moveBy={{ main: DIALOG_OFFSET_Y }}\n wrapperClassName={dialogClassName}\n >\n <Counter\n kind=\"line\"\n prefix=\"+\"\n count={hiddenOptionsCount}\n onMouseDown={e => {\n e.stopPropagation();\n }}\n noAnimation\n />\n </Dialog>\n )}\n </div>\n </div>\n </components.ValueContainer>\n );\n}\n"],"names":["Container","_ref","children","selectProps","otherProps","_objectWithoutProperties","_excluded","isDisabled","placeholder","inputValue","_selectProps$selectPr","customProps","withMandatoryDefaultOptions","readOnly","selectedOptions","onSelectedDelete","isMultiline","popupsContainerSelector","size","dialogClassName","clickHandler","_useState","useState","_useState2","_slicedToArray","ref","setRef","_useState3","_useState4","isCounterShown","setIsCounterShown","showPlaceholder","length","chipWrapperClassName","classes","chipClassName","cx","concat","_defineProperty","_useHiddenOptionsData","useHiddenOptionsData","selectedOptionsCount","overflowIndex","hiddenOptionsCount","useEffect","onDelete","useCallback","option","value","action","removedValue","DropdownChipColors","renderOptions","from","arguments","undefined","to","map","index","overrideChipColor","includes","chipColor","React","createElement","Chips","key","className","chips","noAnimation","disabled","id","label","disableClickableBehavior","onMouseDown","e","stopPropagation","isMandatory","allowTextSelection","leftRenderer","leftAvatar","leftIcon","color","components","ValueContainer","_extends","onTouchEndCapture","Placeholder","newRef","Fragment","Dialog","content","DialogContentContainer","valueDialogContent","containerSelector","tooltip","showTrigger","hideTrigger","position","moveBy","main","wrapperClassName","Counter","kind","prefix","count"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"MultiValueContainer.js","sources":["../../../../../../../src/components/Dropdown/components/MultiValueContainer/MultiValueContainer.jsx"],"sourcesContent":["import React, { useCallback, useEffect, useState } from \"react\";\nimport { components } from \"react-select\";\nimport cx from \"classnames\";\nimport { useHiddenOptionsData } from \"../../hooks/useHiddenOptionsData\";\nimport Counter from \"../../../Counter/Counter\";\nimport Dialog from \"../../../Dialog/Dialog\";\nimport DialogContentContainer from \"../../../DialogContentContainer/DialogContentContainer\";\nimport Chips from \"../../../Chips/Chips\";\nimport classes from \"./MultiValueContainer.module.scss\";\n\nconst DIALOG_OFFSET_Y = 5;\n\nexport default function Container({ children, selectProps, ...otherProps }) {\n const {\n isDisabled,\n placeholder,\n inputValue,\n selectProps: customProps = {},\n withMandatoryDefaultOptions,\n readOnly\n } = selectProps;\n const { selectedOptions, onSelectedDelete, isMultiline, popupsContainerSelector, size, dialogClassName } =\n customProps;\n const clickHandler = children[1];\n const [ref, setRef] = useState();\n const [isCounterShown, setIsCounterShown] = useState(false);\n const showPlaceholder = selectedOptions.length === 0 && !inputValue;\n const chipWrapperClassName = classes[\"chip-with-input-wrapper\"];\n const chipClassName = cx(\n isMultiline ? classes[\"multiselect-chip-multi-line\"] : classes[`multiselect-chip-single-line-${size}`],\n { [classes[\"multiselect-chip-disabled\"]]: isDisabled }\n );\n\n const { overflowIndex, hiddenOptionsCount } = useHiddenOptionsData({\n isMultiline,\n ref,\n chipClassName,\n chipWrapperClassName,\n selectedOptionsCount: selectedOptions.length,\n isCounterShown\n });\n\n useEffect(() => {\n setIsCounterShown(hiddenOptionsCount > 0);\n }, [hiddenOptionsCount]);\n\n const onDelete = useCallback(\n option => {\n onSelectedDelete(option.value, { action: \"remove-value\", removedValue: option });\n },\n [onSelectedDelete]\n );\n\n const DropdownChipColors = [\"primary\", \"negative\", \"positive\"];\n const renderOptions = useCallback(\n (from = 0, to = selectedOptions.length) =>\n selectedOptions.map((option, index) => {\n const overrideChipColor = DropdownChipColors.includes(option.chipColor) ? option.chipColor : \"primary\";\n return index >= from && index < to ? (\n <Chips\n data-testid=\"value-container-chip\"\n key={option.value}\n className={cx(classes.chips, chipClassName)}\n noAnimation\n disabled={isDisabled}\n id={option.value}\n label={option.label}\n onDelete={() => onDelete(option)}\n disableClickableBehavior\n onMouseDown={e => {\n e.stopPropagation();\n }}\n readOnly={readOnly || (withMandatoryDefaultOptions && option.isMandatory)}\n allowTextSelection={readOnly}\n leftRenderer={option.leftRenderer}\n leftAvatar={option.leftAvatar}\n leftIcon={option.leftIcon}\n color={overrideChipColor}\n />\n ) : null;\n }),\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [selectedOptions, chipClassName, isDisabled, readOnly, withMandatoryDefaultOptions, onDelete, size]\n );\n\n return (\n <components.ValueContainer selectProps={selectProps} {...otherProps}>\n <div\n className={classes[\"value-container\"]}\n onTouchEndCapture={e => {\n e.stopPropagation();\n }}\n >\n {showPlaceholder && (\n <div className={classes[\"placeholder-container\"]}>\n <components.Placeholder {...otherProps}>{placeholder}</components.Placeholder>\n </div>\n )}\n <div\n className={cx(classes[\"value-container-chips\"], { [classes[\"without-placeholder\"]]: !showPlaceholder })}\n ref={newRef => setRef(newRef)}\n data-testid=\"value-container-chips\"\n >\n {isCounterShown ? (\n <>\n {renderOptions(0, overflowIndex - 1)}\n <div className={chipWrapperClassName}>\n {renderOptions(overflowIndex - 1, overflowIndex)}\n {clickHandler}\n </div>\n {renderOptions(overflowIndex)}\n </>\n ) : (\n <>\n {renderOptions(0, selectedOptions.length - 1)}\n <div className={chipWrapperClassName}>\n {renderOptions(selectedOptions.length - 1)}\n {clickHandler}\n </div>\n </>\n )}\n </div>\n <div>\n {isCounterShown && (\n <Dialog\n content={() => (\n <DialogContentContainer\n className={classes.valueDialogContent}\n onMouseDown={e => {\n e.stopPropagation();\n }}\n >\n {renderOptions(overflowIndex)}\n </DialogContentContainer>\n )}\n containerSelector={popupsContainerSelector}\n tooltip\n showTrigger=\"click\"\n hideTrigger=\"clickoutside\"\n position=\"bottom\"\n moveBy={{ main: DIALOG_OFFSET_Y }}\n wrapperClassName={dialogClassName}\n >\n <Counter\n kind=\"line\"\n prefix=\"+\"\n count={hiddenOptionsCount}\n onMouseDown={e => {\n e.stopPropagation();\n }}\n noAnimation\n />\n </Dialog>\n )}\n </div>\n </div>\n </components.ValueContainer>\n );\n}\n"],"names":["Container","_ref","children","selectProps","otherProps","_objectWithoutProperties","_excluded","isDisabled","placeholder","inputValue","_selectProps$selectPr","customProps","withMandatoryDefaultOptions","readOnly","selectedOptions","onSelectedDelete","isMultiline","popupsContainerSelector","size","dialogClassName","clickHandler","_useState","useState","_useState2","_slicedToArray","ref","setRef","_useState3","_useState4","isCounterShown","setIsCounterShown","showPlaceholder","length","chipWrapperClassName","classes","chipClassName","cx","concat","_defineProperty","_useHiddenOptionsData","useHiddenOptionsData","selectedOptionsCount","overflowIndex","hiddenOptionsCount","useEffect","onDelete","useCallback","option","value","action","removedValue","DropdownChipColors","renderOptions","from","arguments","undefined","to","map","index","overrideChipColor","includes","chipColor","React","createElement","Chips","key","className","chips","noAnimation","disabled","id","label","disableClickableBehavior","onMouseDown","e","stopPropagation","isMandatory","allowTextSelection","leftRenderer","leftAvatar","leftIcon","color","components","ValueContainer","_extends","onTouchEndCapture","Placeholder","newRef","Fragment","Dialog","content","DialogContentContainer","valueDialogContent","containerSelector","tooltip","showTrigger","hideTrigger","position","moveBy","main","wrapperClassName","Counter","kind","prefix","count"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{objectWithoutProperties as e,slicedToArray as t,defineProperty as n,extends as o}from"../../../../../_virtual/_rollupPluginBabelHelpers.js";import
|
|
1
|
+
import{objectWithoutProperties as e,slicedToArray as t,defineProperty as n,extends as o}from"../../../../../_virtual/_rollupPluginBabelHelpers.js";import i,{useState as a,useEffect as l,useCallback as r}from"react";import{components as s}from"react-select";import c from"classnames";import{useHiddenOptionsData as p}from"../../hooks/useHiddenOptionsData.js";import u from"../../../Counter/Counter.js";import m from"../../../Dialog/Dialog.js";import d from"../../../DialogContentContainer/DialogContentContainer.js";import h from"../../../Chips/Chips.js";import f from"./MultiValueContainer.module.scss.js";var v=["children","selectProps"];function g(g){var C=g.children,E=g.selectProps,D=e(g,v),w=E.isDisabled,P=E.placeholder,N=E.inputValue,b=E.selectProps,y=void 0===b?{}:b,j=E.withMandatoryDefaultOptions,M=E.readOnly,O=y.selectedOptions,k=y.onSelectedDelete,x=y.isMultiline,A=y.popupsContainerSelector,S=y.size,T=y.dialogClassName,V=C[1],B=a(),I=t(B,2),F=I[0],H=I[1],R=a(!1),W=t(R,2),_=W[0],z=W[1],q=0===O.length&&!N,G=f["chip-with-input-wrapper"],J=c(x?f["multiselect-chip-multi-line"]:f["multiselect-chip-single-line-".concat(S)],n({},f["multiselect-chip-disabled"],w)),K=p({isMultiline:x,ref:F,chipClassName:J,chipWrapperClassName:G,selectedOptionsCount:O.length,isCounterShown:_}),L=K.overflowIndex,Q=K.hiddenOptionsCount;l((function(){z(Q>0)}),[Q]);var U=r((function(e){k(e.value,{action:"remove-value",removedValue:e})}),[k]),X=["primary","negative","positive"],Y=r((function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:0,t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:O.length;return O.map((function(n,o){var a=X.includes(n.chipColor)?n.chipColor:"primary";return o>=e&&t>o?i.createElement(h,{"data-testid":"value-container-chip",key:n.value,className:c(f.chips,J),noAnimation:!0,disabled:w,id:n.value,label:n.label,onDelete:function(){return U(n)},disableClickableBehavior:!0,onMouseDown:function(e){e.stopPropagation()},readOnly:M||j&&n.isMandatory,allowTextSelection:M,leftRenderer:n.leftRenderer,leftAvatar:n.leftAvatar,leftIcon:n.leftIcon,color:a}):null}))}),[O,J,w,M,j,U,S]);return i.createElement(s.ValueContainer,o({selectProps:E},D),i.createElement("div",{className:f["value-container"],onTouchEndCapture:function(e){e.stopPropagation()}},q&&i.createElement("div",{className:f["placeholder-container"]},i.createElement(s.Placeholder,D,P)),i.createElement("div",{className:c(f["value-container-chips"],n({},f["without-placeholder"],!q)),ref:function(e){return H(e)},"data-testid":"value-container-chips"},_?i.createElement(i.Fragment,null,Y(0,L-1),i.createElement("div",{className:G},Y(L-1,L),V),Y(L)):i.createElement(i.Fragment,null,Y(0,O.length-1),i.createElement("div",{className:G},Y(O.length-1),V))),i.createElement("div",null,_&&i.createElement(m,{content:function(){return i.createElement(d,{className:f.valueDialogContent,onMouseDown:function(e){e.stopPropagation()}},Y(L))},containerSelector:A,tooltip:!0,showTrigger:"click",hideTrigger:"clickoutside",position:"bottom",moveBy:{main:5},wrapperClassName:T},i.createElement(u,{kind:"line",prefix:"+",count:Q,onMouseDown:function(e){e.stopPropagation()},noAnimation:!0})))))}export{g as default};
|
|
2
2
|
//# sourceMappingURL=MultiValueContainer.js.map
|
package/dist/src/components/Dropdown/components/MultiValueContainer/MultiValueContainer.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MultiValueContainer.js","sources":["../../../../../../src/components/Dropdown/components/MultiValueContainer/MultiValueContainer.jsx"],"sourcesContent":["import React, { useCallback, useEffect, useState } from \"react\";\nimport { components } from \"react-select\";\nimport cx from \"classnames\";\nimport { useHiddenOptionsData } from \"../../hooks/useHiddenOptionsData\";\nimport Counter from \"../../../Counter/Counter\";\nimport Dialog from \"../../../Dialog/Dialog\";\nimport DialogContentContainer from \"../../../DialogContentContainer/DialogContentContainer\";\nimport Chips from \"../../../Chips/Chips\";\nimport classes from \"./MultiValueContainer.module.scss\";\n\nconst DIALOG_OFFSET_Y = 5;\n\nexport default function Container({ children, selectProps, ...otherProps }) {\n const {\n isDisabled,\n placeholder,\n inputValue,\n selectProps: customProps = {},\n withMandatoryDefaultOptions,\n readOnly\n } = selectProps;\n const { selectedOptions, onSelectedDelete, isMultiline, popupsContainerSelector, size, dialogClassName } =\n customProps;\n const clickHandler = children[1];\n const [ref, setRef] = useState();\n const [isCounterShown, setIsCounterShown] = useState(false);\n const showPlaceholder = selectedOptions.length === 0 && !inputValue;\n const chipWrapperClassName = classes[\"chip-with-input-wrapper\"];\n const chipClassName = cx(\n isMultiline ? classes[\"multiselect-chip-multi-line\"] : classes[`multiselect-chip-single-line-${size}`],\n { [classes[\"multiselect-chip-disabled\"]]: isDisabled }\n );\n\n const { overflowIndex, hiddenOptionsCount } = useHiddenOptionsData({\n isMultiline,\n ref,\n chipClassName,\n chipWrapperClassName,\n selectedOptionsCount: selectedOptions.length,\n isCounterShown\n });\n\n useEffect(() => {\n setIsCounterShown(hiddenOptionsCount > 0);\n }, [hiddenOptionsCount]);\n\n const onDelete = useCallback(\n option => {\n onSelectedDelete(option.value, { action: \"remove-value\", removedValue: option });\n },\n [onSelectedDelete]\n );\n\n const DropdownChipColors = [\"primary\", \"negative\", \"positive\"];\n const renderOptions = useCallback(\n (from = 0, to = selectedOptions.length) =>\n selectedOptions.map((option, index) => {\n const overrideChipColor = DropdownChipColors.includes(option.chipColor) ? option.chipColor : \"primary\";\n return index >= from && index < to ? (\n <Chips\n data-testid=\"value-container-chip\"\n key={option.value}\n className={cx(classes.chips, chipClassName)}\n noAnimation\n disabled={isDisabled}\n id={option.value}\n label={option.label}\n onDelete={() => onDelete(option)}\n disableClickableBehavior\n onMouseDown={e => {\n e.stopPropagation();\n }}\n readOnly={readOnly || (withMandatoryDefaultOptions && option.isMandatory)}\n allowTextSelection={readOnly}\n leftRenderer={option.leftRenderer}\n leftAvatar={option.leftAvatar}\n leftIcon={option.leftIcon}\n color={overrideChipColor}\n />\n ) : null;\n }),\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [selectedOptions, chipClassName, isDisabled, readOnly, withMandatoryDefaultOptions, onDelete, size]\n );\n\n return (\n <components.ValueContainer selectProps={selectProps} {...otherProps}>\n <div\n className={classes[\"value-container\"]}\n onTouchEndCapture={e => {\n e.stopPropagation();\n }}\n >\n {showPlaceholder && (\n <div className={classes[\"placeholder-container\"]}>\n <components.Placeholder {...otherProps}>{placeholder}</components.Placeholder>\n </div>\n )}\n <div\n className={cx(classes[\"value-container-chips\"], { [classes[\"without-placeholder\"]]: !showPlaceholder })}\n ref={newRef => setRef(newRef)}\n data-testid=\"value-container-chips\"\n >\n {isCounterShown ? (\n <>\n {renderOptions(0, overflowIndex - 1)}\n <div className={chipWrapperClassName}>\n {renderOptions(overflowIndex - 1, overflowIndex)}\n {clickHandler}\n </div>\n {renderOptions(overflowIndex)}\n </>\n ) : (\n <>\n {renderOptions(0, selectedOptions.length - 1)}\n <div className={chipWrapperClassName}>\n {renderOptions(selectedOptions.length - 1)}\n {clickHandler}\n </div>\n </>\n )}\n </div>\n <div>\n {isCounterShown && (\n <Dialog\n content={() => (\n <DialogContentContainer className={classes.valueDialogContent}>\n {renderOptions(overflowIndex)}\n </DialogContentContainer>\n )}\n containerSelector={popupsContainerSelector}\n tooltip\n showTrigger=\"click\"\n hideTrigger=\"clickoutside\"\n position=\"bottom\"\n moveBy={{ main: DIALOG_OFFSET_Y }}\n wrapperClassName={dialogClassName}\n >\n <Counter\n kind=\"line\"\n prefix=\"+\"\n count={hiddenOptionsCount}\n onMouseDown={e => {\n e.stopPropagation();\n }}\n noAnimation\n />\n </Dialog>\n )}\n </div>\n </div>\n </components.ValueContainer>\n );\n}\n"],"names":["Container","_ref","children","selectProps","otherProps","_objectWithoutProperties","_excluded","isDisabled","placeholder","inputValue","_selectProps$selectPr","customProps","withMandatoryDefaultOptions","readOnly","selectedOptions","onSelectedDelete","isMultiline","popupsContainerSelector","size","dialogClassName","clickHandler","_useState","useState","_useState2","_slicedToArray","ref","setRef","_useState3","_useState4","isCounterShown","setIsCounterShown","showPlaceholder","length","chipWrapperClassName","classes","chipClassName","cx","concat","_defineProperty","_useHiddenOptionsData","useHiddenOptionsData","selectedOptionsCount","overflowIndex","hiddenOptionsCount","useEffect","onDelete","useCallback","option","value","action","removedValue","DropdownChipColors","renderOptions","from","arguments","undefined","to","map","index","overrideChipColor","includes","chipColor","React","createElement","Chips","key","className","chips","noAnimation","disabled","id","label","disableClickableBehavior","onMouseDown","e","stopPropagation","isMandatory","allowTextSelection","leftRenderer","leftAvatar","leftIcon","color","components","ValueContainer","_extends","onTouchEndCapture","Placeholder","newRef","Fragment","Dialog","content","DialogContentContainer","valueDialogContent","containerSelector","tooltip","showTrigger","hideTrigger","position","moveBy","main","wrapperClassName","Counter","kind","prefix","count"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"MultiValueContainer.js","sources":["../../../../../../src/components/Dropdown/components/MultiValueContainer/MultiValueContainer.jsx"],"sourcesContent":["import React, { useCallback, useEffect, useState } from \"react\";\nimport { components } from \"react-select\";\nimport cx from \"classnames\";\nimport { useHiddenOptionsData } from \"../../hooks/useHiddenOptionsData\";\nimport Counter from \"../../../Counter/Counter\";\nimport Dialog from \"../../../Dialog/Dialog\";\nimport DialogContentContainer from \"../../../DialogContentContainer/DialogContentContainer\";\nimport Chips from \"../../../Chips/Chips\";\nimport classes from \"./MultiValueContainer.module.scss\";\n\nconst DIALOG_OFFSET_Y = 5;\n\nexport default function Container({ children, selectProps, ...otherProps }) {\n const {\n isDisabled,\n placeholder,\n inputValue,\n selectProps: customProps = {},\n withMandatoryDefaultOptions,\n readOnly\n } = selectProps;\n const { selectedOptions, onSelectedDelete, isMultiline, popupsContainerSelector, size, dialogClassName } =\n customProps;\n const clickHandler = children[1];\n const [ref, setRef] = useState();\n const [isCounterShown, setIsCounterShown] = useState(false);\n const showPlaceholder = selectedOptions.length === 0 && !inputValue;\n const chipWrapperClassName = classes[\"chip-with-input-wrapper\"];\n const chipClassName = cx(\n isMultiline ? classes[\"multiselect-chip-multi-line\"] : classes[`multiselect-chip-single-line-${size}`],\n { [classes[\"multiselect-chip-disabled\"]]: isDisabled }\n );\n\n const { overflowIndex, hiddenOptionsCount } = useHiddenOptionsData({\n isMultiline,\n ref,\n chipClassName,\n chipWrapperClassName,\n selectedOptionsCount: selectedOptions.length,\n isCounterShown\n });\n\n useEffect(() => {\n setIsCounterShown(hiddenOptionsCount > 0);\n }, [hiddenOptionsCount]);\n\n const onDelete = useCallback(\n option => {\n onSelectedDelete(option.value, { action: \"remove-value\", removedValue: option });\n },\n [onSelectedDelete]\n );\n\n const DropdownChipColors = [\"primary\", \"negative\", \"positive\"];\n const renderOptions = useCallback(\n (from = 0, to = selectedOptions.length) =>\n selectedOptions.map((option, index) => {\n const overrideChipColor = DropdownChipColors.includes(option.chipColor) ? option.chipColor : \"primary\";\n return index >= from && index < to ? (\n <Chips\n data-testid=\"value-container-chip\"\n key={option.value}\n className={cx(classes.chips, chipClassName)}\n noAnimation\n disabled={isDisabled}\n id={option.value}\n label={option.label}\n onDelete={() => onDelete(option)}\n disableClickableBehavior\n onMouseDown={e => {\n e.stopPropagation();\n }}\n readOnly={readOnly || (withMandatoryDefaultOptions && option.isMandatory)}\n allowTextSelection={readOnly}\n leftRenderer={option.leftRenderer}\n leftAvatar={option.leftAvatar}\n leftIcon={option.leftIcon}\n color={overrideChipColor}\n />\n ) : null;\n }),\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [selectedOptions, chipClassName, isDisabled, readOnly, withMandatoryDefaultOptions, onDelete, size]\n );\n\n return (\n <components.ValueContainer selectProps={selectProps} {...otherProps}>\n <div\n className={classes[\"value-container\"]}\n onTouchEndCapture={e => {\n e.stopPropagation();\n }}\n >\n {showPlaceholder && (\n <div className={classes[\"placeholder-container\"]}>\n <components.Placeholder {...otherProps}>{placeholder}</components.Placeholder>\n </div>\n )}\n <div\n className={cx(classes[\"value-container-chips\"], { [classes[\"without-placeholder\"]]: !showPlaceholder })}\n ref={newRef => setRef(newRef)}\n data-testid=\"value-container-chips\"\n >\n {isCounterShown ? (\n <>\n {renderOptions(0, overflowIndex - 1)}\n <div className={chipWrapperClassName}>\n {renderOptions(overflowIndex - 1, overflowIndex)}\n {clickHandler}\n </div>\n {renderOptions(overflowIndex)}\n </>\n ) : (\n <>\n {renderOptions(0, selectedOptions.length - 1)}\n <div className={chipWrapperClassName}>\n {renderOptions(selectedOptions.length - 1)}\n {clickHandler}\n </div>\n </>\n )}\n </div>\n <div>\n {isCounterShown && (\n <Dialog\n content={() => (\n <DialogContentContainer\n className={classes.valueDialogContent}\n onMouseDown={e => {\n e.stopPropagation();\n }}\n >\n {renderOptions(overflowIndex)}\n </DialogContentContainer>\n )}\n containerSelector={popupsContainerSelector}\n tooltip\n showTrigger=\"click\"\n hideTrigger=\"clickoutside\"\n position=\"bottom\"\n moveBy={{ main: DIALOG_OFFSET_Y }}\n wrapperClassName={dialogClassName}\n >\n <Counter\n kind=\"line\"\n prefix=\"+\"\n count={hiddenOptionsCount}\n onMouseDown={e => {\n e.stopPropagation();\n }}\n noAnimation\n />\n </Dialog>\n )}\n </div>\n </div>\n </components.ValueContainer>\n );\n}\n"],"names":["Container","_ref","children","selectProps","otherProps","_objectWithoutProperties","_excluded","isDisabled","placeholder","inputValue","_selectProps$selectPr","customProps","withMandatoryDefaultOptions","readOnly","selectedOptions","onSelectedDelete","isMultiline","popupsContainerSelector","size","dialogClassName","clickHandler","_useState","useState","_useState2","_slicedToArray","ref","setRef","_useState3","_useState4","isCounterShown","setIsCounterShown","showPlaceholder","length","chipWrapperClassName","classes","chipClassName","cx","concat","_defineProperty","_useHiddenOptionsData","useHiddenOptionsData","selectedOptionsCount","overflowIndex","hiddenOptionsCount","useEffect","onDelete","useCallback","option","value","action","removedValue","DropdownChipColors","renderOptions","from","arguments","undefined","to","map","index","overrideChipColor","includes","chipColor","React","createElement","Chips","key","className","chips","noAnimation","disabled","id","label","disableClickableBehavior","onMouseDown","e","stopPropagation","isMandatory","allowTextSelection","leftRenderer","leftAvatar","leftIcon","color","components","ValueContainer","_extends","onTouchEndCapture","Placeholder","newRef","Fragment","Dialog","content","DialogContentContainer","valueDialogContent","containerSelector","tooltip","showTrigger","hideTrigger","position","moveBy","main","wrapperClassName","Counter","kind","prefix","count"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@vibe/core",
|
|
3
|
-
"version": "3.45.0
|
|
3
|
+
"version": "3.45.0",
|
|
4
4
|
"description": "Official monday.com UI resources for application development in React.js",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -287,5 +287,5 @@
|
|
|
287
287
|
"gzip": true
|
|
288
288
|
}
|
|
289
289
|
],
|
|
290
|
-
"gitHead": "
|
|
290
|
+
"gitHead": "5f4b1b21ab433a3627f72fab16b45cba1be1e98e"
|
|
291
291
|
}
|