iguazio.dashboard-react-controls 3.0.4 → 3.1.1

package/dist/components/ChipCell/ChipCell.mjs

@@ -0,0 +1,212 @@
+import { jsx as f, jsxs as R } from "react/jsx-runtime";
+import G, { useState as J, useMemo as Q, useCallback as I } from "react";
+import A from "classnames";
+import r from "prop-types";
+import X from "../Chip/Chip.mjs";
+import Y from "./ChipTooltip/ChipTooltip.mjs";
+import Z from "./HiddenChipsBlock/HiddenChipsBlock.mjs";
+import { CHIP_OPTIONS as O } from "../../types.mjs";
+import { CLICK as L, TAB as M, TAB_SHIFT as ee } from "../../constants.mjs";
+import { cutChips as ie } from "../../utils/chips.util.mjs";
+import { isEveryObjectValueEmpty as se } from "../../utils/common.util.mjs";
+import "../../hooks/index.mjs";
+import re from "../../images/add.svg.mjs";
+/* empty css               */
+import { useChipCell as oe } from "../../hooks/useChipCell.hook.mjs";
+const H = ({
+  addChip: N = () => {
+  },
+  chipOptions: l = {
+    background: "purple",
+    boldValue: !1,
+    borderRadius: "primary",
+    borderColor: "transparent",
+    density: "dense",
+    font: "purple"
+  },
+  className: b,
+  delimiter: x = null,
+  editChip: F = () => {
+  },
+  elements: o = [],
+  isEditMode: t = !1,
+  onClick: y = () => {
+  },
+  removeChip: g = () => {
+  },
+  shortChips: S = !1,
+  setValidation: j = null,
+  visibleChipsMaxLength: u = null
+}) => {
+  const {
+    chipsCellRef: k,
+    chipsWrapperRef: B,
+    handleShowElements: v,
+    hiddenChipsCounterRef: T,
+    hiddenChipsPopUpRef: D,
+    setChipsSizes: V,
+    setShowHiddenChips: $,
+    showChips: z,
+    showHiddenChips: w,
+    visibleChipsCount: E
+  } = oe(t, u), [s, n] = J({
+    chipIndex: null,
+    isEdit: !1,
+    isKeyFocused: !0,
+    isValueFocused: !1,
+    isNewChip: !1
+  }), U = A(
+    "button-add",
+    b,
+    l.background && `button-add-background_${l.background}`,
+    l.borderColor && `button-add-border_${l.borderColor}`,
+    l.font && `button-add-font_${l.font}`,
+    l.density && `button-add-density_${l.density}`
+  ), W = A("chips-wrapper", t && "fixed-max-width");
+  let C = Q(() => t && !u || u === "all" ? {
+    visibleChips: o.map((e) => ({
+      value: e,
+      delimiter: x
+    }))
+  } : ie(
+    o,
+    u || E,
+    x
+  ), [x, o, t, E, u]);
+  const q = I(
+    (e, i) => {
+      e.preventDefault(), !s.isEdit && !s.chipIndex && N(i, o), w && $(!1), n({
+        chipIndex: o.length,
+        isEdit: !0,
+        isKeyFocused: !0,
+        isValueFocused: !1,
+        isNewChip: !0
+      });
+    },
+    [
+      s.isEdit,
+      s.chipIndex,
+      w,
+      o,
+      N,
+      $
+    ]
+  ), a = I(
+    (e, i) => {
+      e.stopPropagation();
+      const c = o.filter((h, m) => m !== i);
+      g(c);
+    },
+    [o, g]
+  ), _ = I(
+    (e, i, c) => {
+      var m, P;
+      e.preventDefault();
+      const h = !!(i.key && i.value && ((m = i.key) != null && m.trim()) && ((P = i.value) != null && P.trim()));
+      if (h) {
+        const d = [...o];
+        d[s.chipIndex] = `${i.key}: ${i.value}`, F(d);
+      }
+      c === L ? (s.isNewChip && !h && a(e, s.chipIndex), n({
+        chipIndex: null,
+        isEdit: !1,
+        isKeyFocused: !0,
+        isValueFocused: !1,
+        isNewChip: !1
+      })) : c === M ? (s.isNewChip && !h && a(e, s.chipIndex), n((d) => {
+        const p = d.chipIndex + 1 > o.length - 1;
+        return {
+          chipIndex: p ? null : d.chipIndex + 1,
+          isEdit: !p,
+          isKeyFocused: !0,
+          isValueFocused: !1,
+          isNewChip: !1
+        };
+      })) : c === ee && (s.isNewChip && !h && a(e, s.chipIndex), n((d) => {
+        const p = d.chipIndex - 1 < 0;
+        return {
+          chipIndex: p ? null : d.chipIndex - 1,
+          isEdit: !p,
+          isKeyFocused: p,
+          isValueFocused: !p,
+          isNewChip: !1
+        };
+      }));
+    },
+    [o, s.chipIndex, s.isNewChip, F, a]
+  ), K = I(
+    (e, i) => {
+      t && (e.stopPropagation(), n({
+        chipIndex: i,
+        isEdit: !0,
+        isKeyFocused: !0,
+        isValueFocused: !1
+      })), y && y();
+    },
+    [t, y]
+  );
+  return (t || !se(C)) && /* @__PURE__ */ f("div", { className: "chips-cell", ref: k, children: /* @__PURE__ */ R("div", { className: W, ref: B, children: [
+    C.visibleChips.map((e, i) => /* @__PURE__ */ R("div", { className: "chip-block", children: [
+      /* @__PURE__ */ f(Y, { chip: e, editConfig: s, children: /* @__PURE__ */ f(
+        X,
+        {
+          chip: e,
+          chipIndex: i,
+          chipOptions: l,
+          className: b,
+          editConfig: s,
+          handleEditChip: _,
+          handleIsEdit: K,
+          handleRemoveChip: a,
+          isEditMode: t,
+          onClick: v,
+          ref: { chipsCellRef: k, hiddenChipsCounterRef: T },
+          setChipsSizes: V,
+          setEditConfig: n,
+          setValidation: j,
+          shortChip: S,
+          showChips: z,
+          textOverflowEllipsis: !0
+        }
+      ) }, e.value),
+      C.visibleChips.length - 1 === i && w && /* @__PURE__ */ f(
+        Z,
+        {
+          chipOptions: l,
+          className: b,
+          chips: C.hiddenChips,
+          chipIndex: i,
+          editConfig: s,
+          handleEditChip: _,
+          handleIsEdit: K,
+          handleRemoveChip: a,
+          handleShowElements: v,
+          isEditMode: t,
+          setEditConfig: n,
+          setChipsSizes: V,
+          ref: { hiddenChipsCounterRef: T, hiddenChipsPopUpRef: D }
+        }
+      )
+    ] }, `${e.value}${i}`)),
+    t && /* @__PURE__ */ f("button", { className: U, onClick: (e) => q(e, ":"), children: /* @__PURE__ */ f(re, {}) })
+  ] }) });
+};
+H.propTypes = {
+  addChip: r.func,
+  chipOptions: O,
+  className: r.string,
+  delimiter: r.oneOfType([r.string, r.element]),
+  editChip: r.func,
+  elements: r.arrayOf(r.string),
+  isEditMode: r.bool,
+  onClick: r.func,
+  removeChip: r.func,
+  setValidation: r.func,
+  shortChips: r.bool,
+  visibleChipsMaxLength: r.oneOfType([r.string, r.number])
+};
+const ye = G.memo(H);
+export {
+  ye as default
+};
+//# sourceMappingURL=ChipCell.mjs.map

package/dist/components/ChipCell/ChipCell.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChipCell.mjs","sources":["../../../src/lib/components/ChipCell/ChipCell.jsx"],"sourcesContent":["/*\nCopyright 2019 Iguazio Systems Ltd.\n\nLicensed under the Apache License, Version 2.0 (the \"License\") with\nan addition restriction as set forth herein. You may not use this\nfile except in compliance with the License. You may obtain a copy of\nthe License at http://www.apache.org/licenses/LICENSE-2.0.\n\nUnless required by applicable law or agreed to in writing, software\ndistributed under the License is distributed on an \"AS IS\" BASIS,\nWITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or\nimplied. See the License for the specific language governing\npermissions and limitations under the License.\n\nIn addition, you may not use the software for any purposes that are\nillegal under applicable law, and the grant of the foregoing license\nunder the Apache 2.0 license is conditioned upon your compliance with\nsuch restriction.\n*/\nimport React, { useState, useCallback, useMemo } from 'react'\nimport classnames from 'classnames'\nimport PropTypes from 'prop-types'\n\nimport Chip from '../Chip/Chip'\nimport ChipTooltip from './ChipTooltip/ChipTooltip'\nimport HiddenChipsBlock from './HiddenChipsBlock/HiddenChipsBlock'\n\nimport { CHIP_OPTIONS } from '../../types'\nimport { CLICK, TAB, TAB_SHIFT } from '../../constants'\nimport { cutChips } from '../../utils/chips.util'\nimport { isEveryObjectValueEmpty } from '../../utils/common.util'\nimport { useChipCell } from '../../hooks'\n\nimport Add from '../../images/add.svg'\n\nimport './chipCell.scss'\n\nconst ChipCell = ({\n  addChip = () => {},\n  chipOptions = {\n    background: 'purple',\n    boldValue: false,\n    borderRadius: 'primary',\n    borderColor: 'transparent',\n    density: 'dense',\n    font: 'purple'\n  },\n  className,\n  delimiter = null,\n  editChip = () => {},\n  elements = [],\n  isEditMode = false,\n  onClick = () => {},\n  removeChip = () => {},\n  shortChips = false,\n  setValidation = null,\n  visibleChipsMaxLength = null\n}) => {\n  const {\n    chipsCellRef,\n    chipsWrapperRef,\n    handleShowElements,\n    hiddenChipsCounterRef,\n    hiddenChipsPopUpRef,\n    setChipsSizes,\n    setShowHiddenChips,\n    showChips,\n    showHiddenChips,\n    visibleChipsCount\n  } = useChipCell(isEditMode, visibleChipsMaxLength)\n  const [editConfig, setEditConfig] = useState({\n    chipIndex: null,\n    isEdit: false,\n    isKeyFocused: true,\n    isValueFocused: false,\n    isNewChip: false\n  })\n\n  const buttonAddClassNames = classnames(\n    'button-add',\n    className,\n    chipOptions.background && `button-add-background_${chipOptions.background}`,\n    chipOptions.borderColor && `button-add-border_${chipOptions.borderColor}`,\n    chipOptions.font && `button-add-font_${chipOptions.font}`,\n    chipOptions.density && `button-add-density_${chipOptions.density}`\n  )\n  const wrapperClassNames = classnames('chips-wrapper', isEditMode && 'fixed-max-width')\n\n  let chips = useMemo(() => {\n    return (isEditMode && !visibleChipsMaxLength) || visibleChipsMaxLength === 'all'\n      ? {\n          visibleChips: elements.map(chip => ({\n            value: chip,\n            delimiter\n          }))\n        }\n      : cutChips(\n          elements,\n          visibleChipsMaxLength ? visibleChipsMaxLength : visibleChipsCount,\n          delimiter\n        )\n  }, [delimiter, elements, isEditMode, visibleChipsCount, visibleChipsMaxLength])\n\n  const handleAddNewChip = useCallback(\n    (event, chip) => {\n      event.preventDefault()\n\n      if (!editConfig.isEdit && !editConfig.chipIndex) {\n        addChip(chip, elements)\n      }\n\n      if (showHiddenChips) {\n        setShowHiddenChips(false)\n      }\n\n      setEditConfig({\n        chipIndex: elements.length,\n        isEdit: true,\n        isKeyFocused: true,\n        isValueFocused: false,\n        isNewChip: true\n      })\n    },\n    [\n      editConfig.isEdit,\n      editConfig.chipIndex,\n      showHiddenChips,\n      elements,\n      addChip,\n      setShowHiddenChips\n    ]\n  )\n\n  const handleRemoveChip = useCallback(\n    (event, chipIndex) => {\n      event.stopPropagation()\n\n      const newChips = elements.filter((value, index) => index !== chipIndex)\n\n      removeChip(newChips)\n    },\n    [elements, removeChip]\n  )\n\n  const handleEditChip = useCallback(\n    (event, chip, nameEvent) => {\n      event.preventDefault()\n      const isChipNotEmpty = !!(chip.key && chip.value && chip.key?.trim() && chip.value?.trim())\n\n      if (isChipNotEmpty) {\n        const newChips = [...elements]\n        newChips[editConfig.chipIndex] = `${chip.key}: ${chip.value}`\n\n        editChip(newChips)\n      }\n\n      if (nameEvent === CLICK) {\n        if (editConfig.isNewChip && !isChipNotEmpty) {\n          handleRemoveChip(event, editConfig.chipIndex)\n        }\n\n        setEditConfig({\n          chipIndex: null,\n          isEdit: false,\n          isKeyFocused: true,\n          isValueFocused: false,\n          isNewChip: false\n        })\n      } else if (nameEvent === TAB) {\n        if (editConfig.isNewChip && !isChipNotEmpty) {\n          handleRemoveChip(event, editConfig.chipIndex)\n        }\n\n        setEditConfig(prevState => {\n          const isNextChipIndexExists = prevState.chipIndex + 1 > elements.length - 1\n\n          return {\n            chipIndex: isNextChipIndexExists ? null : prevState.chipIndex + 1,\n            isEdit: !isNextChipIndexExists,\n            isKeyFocused: true,\n            isValueFocused: false,\n            isNewChip: false\n          }\n        })\n      } else if (nameEvent === TAB_SHIFT) {\n        if (editConfig.isNewChip && !isChipNotEmpty) {\n          handleRemoveChip(event, editConfig.chipIndex)\n        }\n\n        setEditConfig(prevState => {\n          const isPrevChipIndexExists = prevState.chipIndex - 1 < 0\n\n          return {\n            chipIndex: isPrevChipIndexExists ? null : prevState.chipIndex - 1,\n            isEdit: !isPrevChipIndexExists,\n            isKeyFocused: isPrevChipIndexExists,\n            isValueFocused: !isPrevChipIndexExists,\n            isNewChip: false\n          }\n        })\n      }\n    },\n    [elements, editConfig.chipIndex, editConfig.isNewChip, editChip, handleRemoveChip]\n  )\n\n  const handleIsEdit = useCallback(\n    (event, index) => {\n      if (isEditMode) {\n        event.stopPropagation()\n\n        setEditConfig({\n          chipIndex: index,\n          isEdit: true,\n          isKeyFocused: true,\n          isValueFocused: false\n        })\n      }\n\n      onClick && onClick()\n    },\n    [isEditMode, onClick]\n  )\n\n  return (\n    (isEditMode || !isEveryObjectValueEmpty(chips)) && (\n      <div className=\"chips-cell\" ref={chipsCellRef}>\n        <div className={wrapperClassNames} ref={chipsWrapperRef}>\n          {chips.visibleChips.map((chip, index) => {\n            return (\n              <div className=\"chip-block\" key={`${chip.value}${index}`}>\n                <ChipTooltip chip={chip} editConfig={editConfig} key={chip.value}>\n                  <Chip\n                    chip={chip}\n                    chipIndex={index}\n                    chipOptions={chipOptions}\n                    className={className}\n                    editConfig={editConfig}\n                    handleEditChip={handleEditChip}\n                    handleIsEdit={handleIsEdit}\n                    handleRemoveChip={handleRemoveChip}\n                    isEditMode={isEditMode}\n                    onClick={handleShowElements}\n                    ref={{ chipsCellRef, hiddenChipsCounterRef }}\n                    setChipsSizes={setChipsSizes}\n                    setEditConfig={setEditConfig}\n                    setValidation={setValidation}\n                    shortChip={shortChips}\n                    showChips={showChips}\n                    textOverflowEllipsis\n                  />\n                </ChipTooltip>\n                {chips.visibleChips.length - 1 === index && showHiddenChips && (\n                  <HiddenChipsBlock\n                    chipOptions={chipOptions}\n                    className={className}\n                    chips={chips.hiddenChips}\n                    chipIndex={index}\n                    editConfig={editConfig}\n                    handleEditChip={handleEditChip}\n                    handleIsEdit={handleIsEdit}\n                    handleRemoveChip={handleRemoveChip}\n                    handleShowElements={handleShowElements}\n                    isEditMode={isEditMode}\n                    setEditConfig={setEditConfig}\n                    setChipsSizes={setChipsSizes}\n                    ref={{ hiddenChipsCounterRef, hiddenChipsPopUpRef }}\n                  />\n                )}\n              </div>\n            )\n          })}\n          {isEditMode && (\n            <button className={buttonAddClassNames} onClick={e => handleAddNewChip(e, ':')}>\n              <Add />\n            </button>\n          )}\n        </div>\n      </div>\n    )\n  )\n}\n\nChipCell.propTypes = {\n  addChip: PropTypes.func,\n  chipOptions: CHIP_OPTIONS,\n  className: PropTypes.string,\n  delimiter: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),\n  editChip: PropTypes.func,\n  elements: PropTypes.arrayOf(PropTypes.string),\n  isEditMode: PropTypes.bool,\n  onClick: PropTypes.func,\n  removeChip: PropTypes.func,\n  setValidation: PropTypes.func,\n  shortChips: PropTypes.bool,\n  visibleChipsMaxLength: PropTypes.oneOfType([PropTypes.string, PropTypes.number])\n}\n\nexport default React.memo(ChipCell)\n"],"names":["ChipCell","addChip","chipOptions","className","delimiter","editChip","elements","isEditMode","onClick","removeChip","shortChips","setValidation","visibleChipsMaxLength","chipsCellRef","chipsWrapperRef","handleShowElements","hiddenChipsCounterRef","hiddenChipsPopUpRef","setChipsSizes","setShowHiddenChips","showChips","showHiddenChips","visibleChipsCount","useChipCell","editConfig","setEditConfig","useState","buttonAddClassNames","classnames","wrapperClassNames","chips","useMemo","chip","cutChips","handleAddNewChip","useCallback","event","handleRemoveChip","chipIndex","newChips","value","index","handleEditChip","nameEvent","isChipNotEmpty","_a","_b","CLICK","TAB","prevState","isNextChipIndexExists","TAB_SHIFT","isPrevChipIndexExists","handleIsEdit","isEveryObjectValueEmpty","jsxs","jsx","ChipTooltip","Chip","HiddenChipsBlock","Add","PropTypes","CHIP_OPTIONS","ChipCell$1","React"],"mappings":"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"}

package/dist/components/ChipCell/ChipTooltip/ChipTooltip.d.ts

@@ -0,0 +1,15 @@
+export default ChipTooltip;
+declare function ChipTooltip({ children, chip, editConfig }: {
+    children: any;
+    chip: any;
+    editConfig?: {};
+}): JSX.Element;
+declare namespace ChipTooltip {
+    namespace propTypes {
+        export let children: any;
+        export { CHIP as chip };
+        export let editConfig: any;
+    }
+}
+import { CHIP } from '../../../types';
+//# sourceMappingURL=ChipTooltip.d.ts.map

package/dist/components/ChipCell/ChipTooltip/ChipTooltip.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChipTooltip.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/ChipCell/ChipTooltip/ChipTooltip.jsx"],"names":[],"mappings":";AA4BA;;;;gBAyBC;;;;;;;;qBA3BoB,gBAAgB"}

package/dist/components/ChipCell/ChipTooltip/ChipTooltip.mjs

@@ -0,0 +1,36 @@
+import { jsx as t, jsxs as l } from "react/jsx-runtime";
+import { useMemo as s } from "react";
+import o from "prop-types";
+import a from "../../Tooltip/Tooltip.mjs";
+import d from "../../TooltipTemplate/TextTooltipTemplate.mjs";
+import { getChipLabelAndValue as n } from "../../../utils/chips.util.mjs";
+import { CHIP as c } from "../../../types.mjs";
+const f = ({ children: i, chip: e, editConfig: r = {} }) => {
+  const { chipLabel: m, chipValue: p } = s(() => n(e), [e]);
+  return /* @__PURE__ */ t(
+    a,
+    {
+      hidden: r.isEdit || /^\+ [\d]+/g.test(e.value),
+      template: /* @__PURE__ */ t(
+        d,
+        {
+          text: e.delimiter ? /* @__PURE__ */ l("span", { className: "chip__content", children: [
+            m,
+            /* @__PURE__ */ t("span", { className: "chip__delimiter", children: e.delimiter }),
+            p
+          ] }) : e.value
+        }
+      ),
+      children: i
+    }
+  );
+};
+f.propTypes = {
+  children: o.node.isRequired,
+  chip: c,
+  editConfig: o.object
+};
+export {
+  f as default
+};
+//# sourceMappingURL=ChipTooltip.mjs.map

package/dist/components/ChipCell/ChipTooltip/ChipTooltip.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChipTooltip.mjs","sources":["../../../../src/lib/components/ChipCell/ChipTooltip/ChipTooltip.jsx"],"sourcesContent":["/*\nCopyright 2019 Iguazio Systems Ltd.\n\nLicensed under the Apache License, Version 2.0 (the \"License\") with\nan addition restriction as set forth herein. You may not use this\nfile except in compliance with the License. You may obtain a copy of\nthe License at http://www.apache.org/licenses/LICENSE-2.0.\n\nUnless required by applicable law or agreed to in writing, software\ndistributed under the License is distributed on an \"AS IS\" BASIS,\nWITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or\nimplied. See the License for the specific language governing\npermissions and limitations under the License.\n\nIn addition, you may not use the software for any purposes that are\nillegal under applicable law, and the grant of the foregoing license\nunder the Apache 2.0 license is conditioned upon your compliance with\nsuch restriction.\n*/\nimport React, { useMemo } from 'react'\nimport PropTypes from 'prop-types'\n\nimport Tooltip from '../../../components/Tooltip/Tooltip'\nimport TextTooltipTemplate from '../../../components/TooltipTemplate/TextTooltipTemplate'\n\nimport { getChipLabelAndValue } from '../../../utils/chips.util'\nimport { CHIP } from '../../../types'\n\nconst ChipTooltip = ({ children, chip, editConfig = {} }) => {\n  const { chipLabel, chipValue } = useMemo(() => getChipLabelAndValue(chip), [chip])\n\n  return (\n    <Tooltip\n      hidden={editConfig.isEdit || /^\\+ [\\d]+/g.test(chip.value)}\n      template={\n        <TextTooltipTemplate\n          text={\n            chip.delimiter ? (\n              <span className=\"chip__content\">\n                {chipLabel}\n                <span className=\"chip__delimiter\">{chip.delimiter}</span>\n                {chipValue}\n              </span>\n            ) : (\n              chip.value\n            )\n          }\n        />\n      }\n    >\n      {children}\n    </Tooltip>\n  )\n}\n\nChipTooltip.propTypes = {\n  children: PropTypes.node.isRequired,\n  chip: CHIP,\n  editConfig: PropTypes.object\n}\n\nexport default ChipTooltip\n"],"names":["ChipTooltip","children","chip","editConfig","chipLabel","chipValue","useMemo","getChipLabelAndValue","jsx","Tooltip","TextTooltipTemplate","jsxs","PropTypes","CHIP"],"mappings":";;;;;;;AA4BM,MAAAA,IAAc,CAAC,EAAE,UAAAC,GAAU,MAAAC,GAAM,YAAAC,IAAa,SAAS;AACrD,QAAA,EAAE,WAAAC,GAAW,WAAAC,EAAA,IAAcC,EAAQ,MAAMC,EAAqBL,CAAI,GAAG,CAACA,CAAI,CAAC;AAG/E,SAAA,gBAAAM;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,QAAQN,EAAW,UAAU,aAAa,KAAKD,EAAK,KAAK;AAAA,MACzD,UACE,gBAAAM;AAAA,QAACE;AAAA,QAAA;AAAA,UACC,MACER,EAAK,YACF,gBAAAS,EAAA,QAAA,EAAK,WAAU,iBACb,UAAA;AAAA,YAAAP;AAAA,YACA,gBAAAI,EAAA,QAAA,EAAK,WAAU,mBAAmB,YAAK,WAAU;AAAA,YACjDH;AAAA,UAAA,EACH,CAAA,IAEAH,EAAK;AAAA,QAAA;AAAA,MAGX;AAAA,MAGD,UAAAD;AAAA,IAAA;AAAA,EACH;AAEJ;AAEAD,EAAY,YAAY;AAAA,EACtB,UAAUY,EAAU,KAAK;AAAA,EACzB,MAAMC;AAAA,EACN,YAAYD,EAAU;AACxB;"}

package/dist/components/ChipCell/HiddenChipsBlock/HiddenChipsBlock.d.ts

@@ -0,0 +1,35 @@
+export default HiddenChipsBlock;
+declare function HiddenChipsBlock({ chips, chipIndex, chipOptions, className, editConfig, handleEditChip, handleIsEdit, handleRemoveChip, handleShowElements, isEditMode, setEditConfig }: {
+    chips?: any[];
+    chipIndex?: number;
+    chipOptions: any;
+    className: any;
+    editConfig?: {};
+    handleEditChip: any;
+    handleIsEdit?: () => void;
+    handleRemoveChip: any;
+    handleShowElements: any;
+    isEditMode?: boolean;
+    setEditConfig?: () => void;
+}, { hiddenChipsCounterRef, hiddenChipsPopUpRef }: {
+    hiddenChipsCounterRef: any;
+    hiddenChipsPopUpRef: any;
+}): import("react").ReactPortal;
+declare namespace HiddenChipsBlock {
+    let displayName: string;
+    namespace propTypes {
+        export let className: any;
+        export { CHIPS as chips };
+        export let chipOptions: any;
+        export let chipIndex: any;
+        export let editConfig: any;
+        export let handleEditChip: any;
+        export let handleIsEdit: any;
+        export let handleRemoveChip: any;
+        export let handleShowElements: any;
+        export let isEditMode: any;
+        export let setEditConfig: any;
+    }
+}
+import { CHIPS } from '../../../types';
+//# sourceMappingURL=HiddenChipsBlock.d.ts.map

package/dist/components/ChipCell/HiddenChipsBlock/HiddenChipsBlock.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"HiddenChipsBlock.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/ChipCell/HiddenChipsBlock/HiddenChipsBlock.jsx"],"names":[],"mappings":";AA6BA;;;;;;;;;;;;;;;gCAwDC;;;;;;;;;;;;;;;;;sBA3DmC,gBAAgB"}

package/dist/components/ChipCell/HiddenChipsBlock/HiddenChipsBlock.mjs

@@ -0,0 +1,73 @@
+import { jsx as r } from "react/jsx-runtime";
+import k, { useEffect as v } from "react";
+import e from "prop-types";
+import { createPortal as B } from "react-dom";
+import H from "../../Chip/Chip.mjs";
+import N from "../ChipTooltip/ChipTooltip.mjs";
+import { CHIP_OPTIONS as _, CHIPS as b } from "../../../types.mjs";
+import "../../../hooks/index.mjs";
+import { useHiddenChipsBlock as g } from "../../../hooks/useHiddenChipsBlock.hook.mjs";
+let i = ({
+  chips: o = [],
+  chipIndex: l = 0,
+  chipOptions: n,
+  className: s,
+  editConfig: c = {},
+  handleEditChip: a,
+  handleIsEdit: p = () => {
+  },
+  handleRemoveChip: m,
+  handleShowElements: f,
+  isEditMode: h = !1,
+  setEditConfig: u = () => {
+  }
+}, { hiddenChipsCounterRef: C, hiddenChipsPopUpRef: t }) => {
+  const { hiddenChipsBlockClassNames: E } = g(
+    C,
+    t
+  );
+  return v(() => {
+    o.length === 0 && f();
+  }), B(
+    /* @__PURE__ */ r("div", { ref: t, className: E, children: /* @__PURE__ */ r("div", { className: "chip-block-hidden__scrollable-container", children: o == null ? void 0 : o.map((d, I) => /* @__PURE__ */ r(N, { chip: d, children: /* @__PURE__ */ r(
+      H,
+      {
+        chip: d,
+        chipIndex: I + l,
+        chipOptions: n,
+        className: s,
+        editConfig: c,
+        handleEditChip: a,
+        handleIsEdit: p,
+        handleRemoveChip: m,
+        hiddenChips: !0,
+        isEditMode: h,
+        ref: t,
+        setEditConfig: u,
+        showChips: !0,
+        textOverflowEllipsis: !0
+      }
+    ) }, d.value)) }) }),
+    document.getElementById("overlay_container")
+  );
+};
+i = k.forwardRef(i);
+i.displayName = "HiddenChipsBlock";
+i.propTypes = {
+  className: e.string,
+  chips: b,
+  chipOptions: _.isRequired,
+  chipIndex: e.number,
+  editConfig: e.object,
+  handleEditChip: e.func,
+  handleIsEdit: e.func,
+  handleRemoveChip: e.func,
+  handleShowElements: e.func.isRequired,
+  isEditMode: e.bool,
+  setEditConfig: e.func
+};
+const q = i;
+export {
+  q as default
+};
+//# sourceMappingURL=HiddenChipsBlock.mjs.map

package/dist/components/ChipCell/HiddenChipsBlock/HiddenChipsBlock.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"HiddenChipsBlock.mjs","sources":["../../../../src/lib/components/ChipCell/HiddenChipsBlock/HiddenChipsBlock.jsx"],"sourcesContent":["/*\nCopyright 2019 Iguazio Systems Ltd.\n\nLicensed under the Apache License, Version 2.0 (the \"License\") with\nan addition restriction as set forth herein. You may not use this\nfile except in compliance with the License. You may obtain a copy of\nthe License at http://www.apache.org/licenses/LICENSE-2.0.\n\nUnless required by applicable law or agreed to in writing, software\ndistributed under the License is distributed on an \"AS IS\" BASIS,\nWITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or\nimplied. See the License for the specific language governing\npermissions and limitations under the License.\n\nIn addition, you may not use the software for any purposes that are\nillegal under applicable law, and the grant of the foregoing license\nunder the Apache 2.0 license is conditioned upon your compliance with\nsuch restriction.\n*/\nimport React, { useEffect } from 'react'\nimport PropTypes from 'prop-types'\nimport { createPortal } from 'react-dom'\n\nimport Chip from '../../Chip/Chip'\nimport ChipTooltip from '../ChipTooltip/ChipTooltip'\n\nimport { CHIP_OPTIONS, CHIPS } from '../../../types'\nimport { useHiddenChipsBlock } from '../../../hooks'\n\nlet HiddenChipsBlock = (\n  {\n    chips = [],\n    chipIndex = 0,\n    chipOptions,\n    className,\n    editConfig = {},\n    handleEditChip,\n    handleIsEdit = () => {},\n    handleRemoveChip,\n    handleShowElements,\n    isEditMode = false,\n    setEditConfig = () => {}\n  },\n  { hiddenChipsCounterRef, hiddenChipsPopUpRef }\n) => {\n  const { hiddenChipsBlockClassNames } = useHiddenChipsBlock(\n    hiddenChipsCounterRef,\n    hiddenChipsPopUpRef\n  )\n\n  useEffect(() => {\n    if (chips.length === 0) {\n      handleShowElements()\n    }\n  })\n\n  return createPortal(\n    <div ref={hiddenChipsPopUpRef} className={hiddenChipsBlockClassNames}>\n      <div className=\"chip-block-hidden__scrollable-container\">\n        {chips?.map((element, index) => {\n          return (\n            <ChipTooltip chip={element} key={element.value}>\n              <Chip\n                chip={element}\n                chipIndex={index + chipIndex}\n                chipOptions={chipOptions}\n                className={className}\n                editConfig={editConfig}\n                handleEditChip={handleEditChip}\n                handleIsEdit={handleIsEdit}\n                handleRemoveChip={handleRemoveChip}\n                hiddenChips\n                isEditMode={isEditMode}\n                ref={hiddenChipsPopUpRef}\n                setEditConfig={setEditConfig}\n                showChips={true}\n                textOverflowEllipsis\n              />\n            </ChipTooltip>\n          )\n        })}\n      </div>\n    </div>,\n    document.getElementById('overlay_container')\n  )\n}\n\nHiddenChipsBlock = React.forwardRef(HiddenChipsBlock)\n\nHiddenChipsBlock.displayName = 'HiddenChipsBlock'\n\nHiddenChipsBlock.propTypes = {\n  className: PropTypes.string,\n  chips: CHIPS,\n  chipOptions: CHIP_OPTIONS.isRequired,\n  chipIndex: PropTypes.number,\n  editConfig: PropTypes.object,\n  handleEditChip: PropTypes.func,\n  handleIsEdit: PropTypes.func,\n  handleRemoveChip: PropTypes.func,\n  handleShowElements: PropTypes.func.isRequired,\n  isEditMode: PropTypes.bool,\n  setEditConfig: PropTypes.func\n}\n\nexport default HiddenChipsBlock\n"],"names":["HiddenChipsBlock","chips","chipIndex","chipOptions","className","editConfig","handleEditChip","handleIsEdit","handleRemoveChip","handleShowElements","isEditMode","setEditConfig","hiddenChipsCounterRef","hiddenChipsPopUpRef","hiddenChipsBlockClassNames","useHiddenChipsBlock","useEffect","createPortal","jsx","element","index","ChipTooltip","Chip","React","PropTypes","CHIPS","CHIP_OPTIONS","HiddenChipsBlock$1"],"mappings":";;;;;;;;;AA6BA,IAAIA,IAAmB,CACrB;AAAA,EACE,OAAAC,IAAQ,CAAC;AAAA,EACT,WAAAC,IAAY;AAAA,EACZ,aAAAC;AAAA,EACA,WAAAC;AAAA,EACA,YAAAC,IAAa,CAAC;AAAA,EACd,gBAAAC;AAAA,EACA,cAAAC,IAAe,MAAM;AAAA,EAAC;AAAA,EACtB,kBAAAC;AAAA,EACA,oBAAAC;AAAA,EACA,YAAAC,IAAa;AAAA,EACb,eAAAC,IAAgB,MAAM;AAAA,EAAA;AACxB,GACA,EAAE,uBAAAC,GAAuB,qBAAAC,QACtB;AACG,QAAA,EAAE,4BAAAC,MAA+BC;AAAA,IACrCH;AAAA,IACAC;AAAA,EACF;AAEA,SAAAG,EAAU,MAAM;AACV,IAAAf,EAAM,WAAW,KACAQ,EAAA;AAAA,EACrB,CACD,GAEMQ;AAAA,IACJ,gBAAAC,EAAA,OAAA,EAAI,KAAKL,GAAqB,WAAWC,GACxC,UAAA,gBAAAI,EAAC,OAAI,EAAA,WAAU,2CACZ,UAAAjB,KAAA,gBAAAA,EAAO,IAAI,CAACkB,GAASC,MAElB,gBAAAF,EAACG,GAAY,EAAA,MAAMF,GACjB,UAAA,gBAAAD;AAAA,MAACI;AAAA,MAAA;AAAA,QACC,MAAMH;AAAA,QACN,WAAWC,IAAQlB;AAAA,QACnB,aAAAC;AAAA,QACA,WAAAC;AAAA,QACA,YAAAC;AAAA,QACA,gBAAAC;AAAA,QACA,cAAAC;AAAA,QACA,kBAAAC;AAAA,QACA,aAAW;AAAA,QACX,YAAAE;AAAA,QACA,KAAKG;AAAA,QACL,eAAAF;AAAA,QACA,WAAW;AAAA,QACX,sBAAoB;AAAA,MAAA;AAAA,IAAA,EACtB,GAhB+BQ,EAAQ,KAiBzC,IAGN,EACF,CAAA;AAAA,IACA,SAAS,eAAe,mBAAmB;AAAA,EAC7C;AACF;AAEAnB,IAAmBuB,EAAM,WAAWvB,CAAgB;AAEpDA,EAAiB,cAAc;AAE/BA,EAAiB,YAAY;AAAA,EAC3B,WAAWwB,EAAU;AAAA,EACrB,OAAOC;AAAA,EACP,aAAaC,EAAa;AAAA,EAC1B,WAAWF,EAAU;AAAA,EACrB,YAAYA,EAAU;AAAA,EACtB,gBAAgBA,EAAU;AAAA,EAC1B,cAAcA,EAAU;AAAA,EACxB,kBAAkBA,EAAU;AAAA,EAC5B,oBAAoBA,EAAU,KAAK;AAAA,EACnC,YAAYA,EAAU;AAAA,EACtB,eAAeA,EAAU;AAC3B;AAEA,MAAAG,IAAe3B;"}

package/dist/components/ChipForm/ChipForm.d.ts

@@ -0,0 +1,25 @@
+export default ChipForm;
+declare function ChipForm({ checkValidation, chipOptions, className, editConfig, onChange, setEditConfig, validationRules, value }: {
+    checkValidation?: any;
+    chipOptions: any;
+    className?: string;
+    editConfig: any;
+    onChange: any;
+    setEditConfig: any;
+    validationRules?: any[];
+    value: any;
+}, ref: any): JSX.Element;
+declare namespace ChipForm {
+    let displayName: string;
+    namespace propTypes {
+        let checkValidation: any;
+        let chipOptions: any;
+        let className: any;
+        let editConfig: any;
+        let onChange: any;
+        let setEditConfig: any;
+        let validationRules: any;
+        let value: any;
+    }
+}
+//# sourceMappingURL=ChipForm.d.ts.map

package/dist/components/ChipForm/ChipForm.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChipForm.d.ts","sourceRoot":"","sources":["../../../src/lib/components/ChipForm/ChipForm.jsx"],"names":[],"mappings":";AAgCA;;;;;;;;;0BAiPC"}

package/dist/components/ChipForm/ChipForm.mjs

@@ -0,0 +1,184 @@
+import { jsx as m, jsxs as x, Fragment as S } from "react/jsx-runtime";
+import A, { useState as H, useMemo as z, useRef as _, useLayoutEffect as G, useEffect as O, useCallback as y } from "react";
+import a from "prop-types";
+import b from "classnames";
+import { isEmpty as J } from "lodash";
+import Q from "../../elements/OptionsMenu/OptionsMenu.mjs";
+import U from "../../elements/ValidationTemplate/ValidationTemplate.mjs";
+import { TAB as I, TAB_SHIFT as X } from "../../constants.mjs";
+import { CHIP_OPTIONS as Y } from "../../types.mjs";
+/* empty css               */
+let F = ({
+  checkValidation: W = null,
+  chipOptions: $,
+  className: q = "",
+  editConfig: r,
+  onChange: o,
+  setEditConfig: k,
+  validationRules: d = [],
+  value: j
+}, V) => {
+  const [i, n] = H({
+    ...j,
+    keyFieldWidth: 0,
+    valueFieldWidth: 0
+  }), c = z(() => {
+    var e;
+    return ((e = V.current) == null ? void 0 : e.clientWidth) - 50;
+  }, [V]), { background: v, borderColor: N, density: E, font: P, borderRadius: R } = $, h = 25, p = 35, s = _(), l = _(), f = _(), B = b(
+    q,
+    !r.isKeyFocused && "item_edited",
+    !J(d) && "item_edited_invalid"
+  ), C = b(
+    "edit-chip-container",
+    v && `edit-chip-container-background_${v}`,
+    N && `edit-chip-container-border_${N}`,
+    P && `edit-chip-container-font_${P}`,
+    E && `edit-chip-container-density_${E}`,
+    R && `edit-chip-container-border_${R}`,
+    (r.isEdit || r.isNewChip) && "edit-chip-container_edited"
+  ), D = b(
+    "input-label-value",
+    !r.isValueFocused && "item_edited"
+  );
+  G(() => {
+    if (!i.keyFieldWidth && !i.valueFieldWidth) {
+      const e = s.current.scrollWidth + 1, t = l.current.scrollWidth + 1;
+      i.key && i.value ? n((u) => ({
+        ...u,
+        keyFieldWidth: e >= c ? c : e,
+        valueFieldWidth: t >= c ? c : t
+      })) : n((u) => ({
+        ...u,
+        keyFieldWidth: h,
+        valueFieldWidth: p
+      }));
+    }
+  }, [
+    i.key,
+    i.keyFieldWidth,
+    i.value,
+    i.valueFieldWidth,
+    c,
+    s,
+    l
+  ]), O(() => {
+    r.isKeyFocused ? s.current.focus() : r.isValueFocused && l.current.focus();
+  }, [r.isKeyFocused, r.isValueFocused, s, l]);
+  const K = y(
+    (e) => {
+      var u;
+      e.stopPropagation(), (e.path ?? ((u = e.composedPath) == null ? void 0 : u.call(e))).includes(f.current) || o(e, i, "Click");
+    },
+    [i, o, f]
+  );
+  O(() => {
+    if (r.isEdit)
+      return document.addEventListener("click", K, !0), () => {
+        document.removeEventListener("click", K, !0);
+      };
+  }, [K, r.isEdit]);
+  const L = y(
+    (e) => {
+      e.stopPropagation(), !e.shiftKey && e.key === I && r.isValueFocused ? o(e, i, I) : e.shiftKey && e.key === I && r.isKeyFocused && o(e, i, X), (e.key === "Backspace" || e.key === "Delete") && n((t) => ({
+        ...t,
+        keyFieldWidth: r.isKeyFocused ? h : t.keyFieldWidth,
+        valueFieldWidth: r.isValueFocused ? p : t.valueFieldWidth
+      }));
+    },
+    [r, o, i]
+  ), T = y(
+    (e) => {
+      e.target.name === "key" ? (s.current.selectionStart = s.current.selectionEnd, k((t) => ({
+        ...t,
+        isKeyFocused: !0,
+        isValueFocused: !1
+      }))) : (l.current.selectionStart = l.current.selectionEnd, k((t) => ({
+        ...t,
+        isKeyFocused: !1,
+        isValueFocused: !0
+      })));
+    },
+    [s, l, k]
+  ), w = y(
+    (e) => {
+      if (e.preventDefault(), e.target.name === "key") {
+        const t = s.current.scrollWidth;
+        W && W(s.current.value), n((u) => ({
+          ...u,
+          key: s.current.value,
+          keyFieldWidth: s.current.value.length <= 1 ? h : t >= c ? c : t > h ? t + 2 : h
+        }));
+      } else {
+        const t = l.current.scrollWidth;
+        n((u) => ({
+          ...u,
+          value: l.current.value,
+          valueFieldWidth: l.current.value.length <= 1 ? p : t >= c ? c : t > p ? t + 2 : p
+        }));
+      }
+    },
+    [W, c, s, l]
+  ), M = y(() => d.map(({ isValid: e = !1, label: t, name: u }) => /* @__PURE__ */ m(U, { valid: e, validationMessage: t }, u)), [d]);
+  return /* @__PURE__ */ x(S, { children: [
+    /* @__PURE__ */ x(
+      "div",
+      {
+        ref: f,
+        className: C,
+        onKeyDown: (e) => r.isEdit && L(e),
+        children: [
+          /* @__PURE__ */ m(
+            "input",
+            {
+              autoComplete: "off",
+              className: B,
+              name: "key",
+              style: { width: i.keyFieldWidth },
+              onChange: w,
+              onFocus: T,
+              placeholder: "key",
+              ref: s,
+              type: "text",
+              value: i.key
+            }
+          ),
+          /* @__PURE__ */ m("div", { className: "edit-chip-separator", children: ":" }),
+          /* @__PURE__ */ m(
+            "input",
+            {
+              autoComplete: "off",
+              className: D,
+              name: "value",
+              onChange: w,
+              onFocus: T,
+              placeholder: "value",
+              ref: l,
+              style: { width: i.valueFieldWidth },
+              type: "text",
+              value: i.value
+            }
+          )
+        ]
+      }
+    ),
+    d.length > 0 && /* @__PURE__ */ m(Q, { show: d.length > 0, ref: { refInputContainer: f }, children: M() })
+  ] });
+};
+F = A.forwardRef(F);
+F.displayName = "ChipForm";
+F.propTypes = {
+  checkValidation: a.func,
+  chipOptions: Y.isRequired,
+  className: a.string,
+  editConfig: a.object.isRequired,
+  onChange: a.func.isRequired,
+  setEditConfig: a.func.isRequired,
+  validationRules: a.array,
+  value: a.object.isRequired
+};
+const ae = F;
+export {
+  ae as default
+};
+//# sourceMappingURL=ChipForm.mjs.map