@geneui/components 2.11.1

package/TransferList.js

@@ -0,0 +1,502 @@
+import React__default, { useRef, useEffect, forwardRef, useState, useMemo, useCallback } from 'react';
+import { p as propTypesExports } from './index-e0af0caf.js';
+import { P as PublicDraggable, C as ConnectedDroppable, D as DragDropContext } from './react-beautiful-dnd.esm-38c37304.js';
+import { c as classnames } from './index-6ff23041.js';
+import { n as noop } from './index-ac59cb10.js';
+import './configs-91c86664.js';
+import { _ as _extends } from './_rollupPluginBabelHelpers-e8fb2e5c.js';
+import Icon from './Icon.js';
+import Empty from './Empty.js';
+import Search from './Search.js';
+import Checkbox from './Checkbox.js';
+import CustomScrollbar from './Scrollbar.js';
+import './Label.js';
+import { s as styleInject } from './style-inject.es-746bb8ed.js';
+import Button from './Button.js';
+import Tooltip from './Tooltip.js';
+import './objectWithoutPropertiesLoose-299691d8.js';
+import './index-e8776f3d.js';
+import 'react-dom';
+import './dateValidation-67caec66.js';
+import './_commonjsHelpers-24198af3.js';
+import './globalStyling-9c60a159.js';
+import './ExtendedInput.js';
+import './useDeviceType-dd51db38.js';
+import './useWindowSize-80369d76.js';
+import './index-5cea9a7d.js';
+import './useKeyDown-38102ae7.js';
+import './useClickOutside-5183e396.js';
+import './Popover-f4d1cac0.js';
+import './GeneUIProvider.js';
+import './checkboxRadioSwitcher-5b69d7bd.js';
+import './guid-8ddf77b3.js';
+
+const useDidMount = function () {
+  let callback = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : () => {};
+  let deps = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
+  const _isFirstUpdate = useRef(true);
+  useEffect(() => {
+    if (!_isFirstUpdate.current) {
+      callback();
+    }
+    _isFirstUpdate.current = false;
+  }, deps);
+};
+
+function n(n){for(var r=arguments.length,t=Array(r>1?r-1:0),e=1;e<r;e++)t[e-1]=arguments[e];if("production"!==process.env.NODE_ENV){var i=Y[n],o=i?"function"==typeof i?i.apply(null,t):i:"unknown error nr: "+n;throw Error("[Immer] "+o)}throw Error("[Immer] minified error nr: "+n+(t.length?" "+t.map((function(n){return "'"+n+"'"})).join(","):"")+". Find the full error at: https://bit.ly/3cXEKWf")}function r(n){return !!n&&!!n[Q]}function t(n){var r;return !!n&&(function(n){if(!n||"object"!=typeof n)return !1;var r=Object.getPrototypeOf(n);if(null===r)return !0;var t=Object.hasOwnProperty.call(r,"constructor")&&r.constructor;return t===Object||"function"==typeof t&&Function.toString.call(t)===Z}(n)||Array.isArray(n)||!!n[L]||!!(null===(r=n.constructor)||void 0===r?void 0:r[L])||s(n)||v(n))}function i(n,r,t){void 0===t&&(t=!1),0===o(n)?(t?Object.keys:nn)(n).forEach((function(e){t&&"symbol"==typeof e||r(e,n[e],n);})):n.forEach((function(t,e){return r(e,t,n)}));}function o(n){var r=n[Q];return r?r.i>3?r.i-4:r.i:Array.isArray(n)?1:s(n)?2:v(n)?3:0}function u(n,r){return 2===o(n)?n.has(r):Object.prototype.hasOwnProperty.call(n,r)}function a(n,r){return 2===o(n)?n.get(r):n[r]}function f(n,r,t){var e=o(n);2===e?n.set(r,t):3===e?n.add(t):n[r]=t;}function c(n,r){return n===r?0!==n||1/n==1/r:n!=n&&r!=r}function s(n){return X&&n instanceof Map}function v(n){return q&&n instanceof Set}function p(n){return n.o||n.t}function l(n){if(Array.isArray(n))return Array.prototype.slice.call(n);var r=rn(n);delete r[Q];for(var t=nn(r),e=0;e<t.length;e++){var i=t[e],o=r[i];!1===o.writable&&(o.writable=!0,o.configurable=!0),(o.get||o.set)&&(r[i]={configurable:!0,writable:!0,enumerable:o.enumerable,value:n[i]});}return Object.create(Object.getPrototypeOf(n),r)}function d(n,e){return void 0===e&&(e=!1),y(n)||r(n)||!t(n)||(o(n)>1&&(n.set=n.add=n.clear=n.delete=h),Object.freeze(n),e&&i(n,(function(n,r){return d(r,!0)}),!0)),n}function h(){n(2);}function y(n){return null==n||"object"!=typeof n||Object.isFrozen(n)}function b(r){var t=tn[r];return t||n(18,r),t}function _(){return "production"===process.env.NODE_ENV||U||n(0),U}function j(n,r){r&&(b("Patches"),n.u=[],n.s=[],n.v=r);}function g(n){O(n),n.p.forEach(S),n.p=null;}function O(n){n===U&&(U=n.l);}function w(n){return U={p:[],l:U,h:n,m:!0,_:0}}function S(n){var r=n[Q];0===r.i||1===r.i?r.j():r.g=!0;}function P(r,e){e._=e.p.length;var i=e.p[0],o=void 0!==r&&r!==i;return e.h.O||b("ES5").S(e,r,o),o?(i[Q].P&&(g(e),n(4)),t(r)&&(r=M(e,r),e.l||x(e,r)),e.u&&b("Patches").M(i[Q].t,r,e.u,e.s)):r=M(e,i,[]),g(e),e.u&&e.v(e.u,e.s),r!==H?r:void 0}function M(n,r,t){if(y(r))return r;var e=r[Q];if(!e)return i(r,(function(i,o){return A(n,e,r,i,o,t)}),!0),r;if(e.A!==n)return r;if(!e.P)return x(n,e.t,!0),e.t;if(!e.I){e.I=!0,e.A._--;var o=4===e.i||5===e.i?e.o=l(e.k):e.o,u=o,a=!1;3===e.i&&(u=new Set(o),o.clear(),a=!0),i(u,(function(r,i){return A(n,e,o,r,i,t,a)})),x(n,o,!1),t&&n.u&&b("Patches").N(e,t,n.u,n.s);}return e.o}function A(e,i,o,a,c,s,v){if("production"!==process.env.NODE_ENV&&c===o&&n(5),r(c)){var p=M(e,c,s&&i&&3!==i.i&&!u(i.R,a)?s.concat(a):void 0);if(f(o,a,p),!r(p))return;e.m=!1;}else v&&o.add(c);if(t(c)&&!y(c)){if(!e.h.D&&e._<1)return;M(e,c),i&&i.A.l||x(e,c);}}function x(n,r,t){void 0===t&&(t=!1),!n.l&&n.h.D&&n.m&&d(r,t);}function z(n,r){var t=n[Q];return (t?p(t):n)[r]}function I(n,r){if(r in n)for(var t=Object.getPrototypeOf(n);t;){var e=Object.getOwnPropertyDescriptor(t,r);if(e)return e;t=Object.getPrototypeOf(t);}}function k(n){n.P||(n.P=!0,n.l&&k(n.l));}function E(n){n.o||(n.o=l(n.t));}function N(n,r,t){var e=s(r)?b("MapSet").F(r,t):v(r)?b("MapSet").T(r,t):n.O?function(n,r){var t=Array.isArray(n),e={i:t?1:0,A:r?r.A:_(),P:!1,I:!1,R:{},l:r,t:n,k:null,o:null,j:null,C:!1},i=e,o=en;t&&(i=[e],o=on);var u=Proxy.revocable(i,o),a=u.revoke,f=u.proxy;return e.k=f,e.j=a,f}(r,t):b("ES5").J(r,t);return (t?t.A:_()).p.push(e),e}function R(e){return r(e)||n(22,e),function n(r){if(!t(r))return r;var e,u=r[Q],c=o(r);if(u){if(!u.P&&(u.i<4||!b("ES5").K(u)))return u.t;u.I=!0,e=D(r,c),u.I=!1;}else e=D(r,c);return i(e,(function(r,t){u&&a(u.t,r)===t||f(e,r,n(t));})),3===c?new Set(e):e}(e)}function D(n,r){switch(r){case 2:return new Map(n);case 3:return Array.from(n)}return l(n)}var G,U,W="undefined"!=typeof Symbol&&"symbol"==typeof Symbol("x"),X="undefined"!=typeof Map,q="undefined"!=typeof Set,B="undefined"!=typeof Proxy&&void 0!==Proxy.revocable&&"undefined"!=typeof Reflect,H=W?Symbol.for("immer-nothing"):((G={})["immer-nothing"]=!0,G),L=W?Symbol.for("immer-draftable"):"__$immer_draftable",Q=W?Symbol.for("immer-state"):"__$immer_state",Y={0:"Illegal state",1:"Immer drafts cannot have computed properties",2:"This object has been frozen and should not be mutated",3:function(n){return "Cannot use a proxy that has been revoked. Did you pass an object from inside an immer function to an async process? "+n},4:"An immer producer returned a new value *and* modified its draft. Either return a new value *or* modify the draft.",5:"Immer forbids circular references",6:"The first or second argument to `produce` must be a function",7:"The third argument to `produce` must be a function or undefined",8:"First argument to `createDraft` must be a plain object, an array, or an immerable object",9:"First argument to `finishDraft` must be a draft returned by `createDraft`",10:"The given draft is already finalized",11:"Object.defineProperty() cannot be used on an Immer draft",12:"Object.setPrototypeOf() cannot be used on an Immer draft",13:"Immer only supports deleting array indices",14:"Immer only supports setting array indices and the 'length' property",15:function(n){return "Cannot apply patch, path doesn't resolve: "+n},16:'Sets cannot have "replace" patches.',17:function(n){return "Unsupported patch operation: "+n},18:function(n){return "The plugin for '"+n+"' has not been loaded into Immer. To enable the plugin, import and call `enable"+n+"()` when initializing your application."},20:"Cannot use proxies if Proxy, Proxy.revocable or Reflect are not available",21:function(n){return "produce can only be called on things that are draftable: plain objects, arrays, Map, Set or classes that are marked with '[immerable]: true'. Got '"+n+"'"},22:function(n){return "'current' expects a draft, got: "+n},23:function(n){return "'original' expects a draft, got: "+n},24:"Patching reserved attributes like __proto__, prototype and constructor is not allowed"},Z=""+Object.prototype.constructor,nn="undefined"!=typeof Reflect&&Reflect.ownKeys?Reflect.ownKeys:void 0!==Object.getOwnPropertySymbols?function(n){return Object.getOwnPropertyNames(n).concat(Object.getOwnPropertySymbols(n))}:Object.getOwnPropertyNames,rn=Object.getOwnPropertyDescriptors||function(n){var r={};return nn(n).forEach((function(t){r[t]=Object.getOwnPropertyDescriptor(n,t);})),r},tn={},en={get:function(n,r){if(r===Q)return n;var e=p(n);if(!u(e,r))return function(n,r,t){var e,i=I(r,t);return i?"value"in i?i.value:null===(e=i.get)||void 0===e?void 0:e.call(n.k):void 0}(n,e,r);var i=e[r];return n.I||!t(i)?i:i===z(n.t,r)?(E(n),n.o[r]=N(n.A.h,i,n)):i},has:function(n,r){return r in p(n)},ownKeys:function(n){return Reflect.ownKeys(p(n))},set:function(n,r,t){var e=I(p(n),r);if(null==e?void 0:e.set)return e.set.call(n.k,t),!0;if(!n.P){var i=z(p(n),r),o=null==i?void 0:i[Q];if(o&&o.t===t)return n.o[r]=t,n.R[r]=!1,!0;if(c(t,i)&&(void 0!==t||u(n.t,r)))return !0;E(n),k(n);}return n.o[r]===t&&(void 0!==t||r in n.o)||Number.isNaN(t)&&Number.isNaN(n.o[r])||(n.o[r]=t,n.R[r]=!0),!0},deleteProperty:function(n,r){return void 0!==z(n.t,r)||r in n.t?(n.R[r]=!1,E(n),k(n)):delete n.R[r],n.o&&delete n.o[r],!0},getOwnPropertyDescriptor:function(n,r){var t=p(n),e=Reflect.getOwnPropertyDescriptor(t,r);return e?{writable:!0,configurable:1!==n.i||"length"!==r,enumerable:e.enumerable,value:t[r]}:e},defineProperty:function(){n(11);},getPrototypeOf:function(n){return Object.getPrototypeOf(n.t)},setPrototypeOf:function(){n(12);}},on={};i(en,(function(n,r){on[n]=function(){return arguments[0]=arguments[0][0],r.apply(this,arguments)};})),on.deleteProperty=function(r,t){return "production"!==process.env.NODE_ENV&&isNaN(parseInt(t))&&n(13),on.set.call(this,r,t,void 0)},on.set=function(r,t,e){return "production"!==process.env.NODE_ENV&&"length"!==t&&isNaN(parseInt(t))&&n(14),en.set.call(this,r[0],t,e,r[0])};var un=function(){function e(r){var e=this;this.O=B,this.D=!0,this.produce=function(r,i,o){if("function"==typeof r&&"function"!=typeof i){var u=i;i=r;var a=e;return function(n){var r=this;void 0===n&&(n=u);for(var t=arguments.length,e=Array(t>1?t-1:0),o=1;o<t;o++)e[o-1]=arguments[o];return a.produce(n,(function(n){var t;return (t=i).call.apply(t,[r,n].concat(e))}))}}var f;if("function"!=typeof i&&n(6),void 0!==o&&"function"!=typeof o&&n(7),t(r)){var c=w(e),s=N(e,r,void 0),v=!0;try{f=i(s),v=!1;}finally{v?g(c):O(c);}return "undefined"!=typeof Promise&&f instanceof Promise?f.then((function(n){return j(c,o),P(n,c)}),(function(n){throw g(c),n})):(j(c,o),P(f,c))}if(!r||"object"!=typeof r){if(void 0===(f=i(r))&&(f=r),f===H&&(f=void 0),e.D&&d(f,!0),o){var p=[],l=[];b("Patches").M(r,f,p,l),o(p,l);}return f}n(21,r);},this.produceWithPatches=function(n,r){if("function"==typeof n)return function(r){for(var t=arguments.length,i=Array(t>1?t-1:0),o=1;o<t;o++)i[o-1]=arguments[o];return e.produceWithPatches(r,(function(r){return n.apply(void 0,[r].concat(i))}))};var t,i,o=e.produce(n,r,(function(n,r){t=n,i=r;}));return "undefined"!=typeof Promise&&o instanceof Promise?o.then((function(n){return [n,t,i]})):[o,t,i]},"boolean"==typeof(null==r?void 0:r.useProxies)&&this.setUseProxies(r.useProxies),"boolean"==typeof(null==r?void 0:r.autoFreeze)&&this.setAutoFreeze(r.autoFreeze);}var i=e.prototype;return i.createDraft=function(e){t(e)||n(8),r(e)&&(e=R(e));var i=w(this),o=N(this,e,void 0);return o[Q].C=!0,O(i),o},i.finishDraft=function(r,t){var e=r&&r[Q];"production"!==process.env.NODE_ENV&&(e&&e.C||n(9),e.I&&n(10));var i=e.A;return j(i,t),P(void 0,i)},i.setAutoFreeze=function(n){this.D=n;},i.setUseProxies=function(r){r&&!B&&n(20),this.O=r;},i.applyPatches=function(n,t){var e;for(e=t.length-1;e>=0;e--){var i=t[e];if(0===i.path.length&&"replace"===i.op){n=i.value;break}}e>-1&&(t=t.slice(e+1));var o=b("Patches").$;return r(n)?o(n,t):this.produce(n,(function(n){return o(n,t)}))},e}(),an=new un,fn=an.produce;an.produceWithPatches.bind(an);an.setAutoFreeze.bind(an);an.setUseProxies.bind(an);an.applyPatches.bind(an);an.createDraft.bind(an);an.finishDraft.bind(an);var produce = fn;
+
+const reorderElement = (container, startIndex, endIndex) => produce(container, draft => {
+  const [removed] = draft.splice(startIndex, 1);
+  draft.splice(endIndex, 0, removed);
+});
+const moveElement = (containers, source, destination) => produce(containers, draft => {
+  const [removed] = draft[source.droppableId].splice(source.index, 1);
+  draft[destination.droppableId].splice(destination.index, 0, removed);
+});
+const multiMoveElement = _ref => {
+  let {
+    containers,
+    selectedElements,
+    destination
+  } = _ref;
+  return produce(containers, draft => {
+    let removed = [];
+    Object.entries(selectedElements).forEach(_ref2 => {
+      let [source, elements] = _ref2;
+      removed = [...removed, ...draft[source].filter((_, index) => elements.includes(index))];
+      draft[source] = draft[source].filter((_, index) => !elements.includes(index));
+    });
+    draft[destination.droppableId].splice(destination.index, 0, ...removed);
+  });
+};
+const selectedInitialState = containers => {
+  const data = {};
+  Object.keys(containers).forEach(key => {
+    data[key] = [];
+  });
+  return data;
+};
+const unionIndexes = arr => Array.from(new Set(arr));
+const addOrRemove = (data, value) => produce(data, draft => {
+  const index = draft.indexOf(value);
+  if (index === -1) {
+    draft.push(value);
+  } else {
+    draft.splice(index, 1);
+  }
+});
+
+const DEFAULT_TRANSLATE_MESSAGE = {
+  empty: 'No data',
+  dropHere: 'Drop Element Here',
+  multiSelectText: 'Elements',
+  moveTo: 'Move to'
+};
+const DEFAULT_DATA_ERROR_MESSAGE = 'TransferList: Be sure to send the defaultDate according to the documentation standard';
+
+var css_248z$2 = "[data-gene-ui-version=\"2.11.0\"] .bc-transfer-element{grid-column-gap:1.2rem;--crs-grid-column-gap:2rem;align-items:center;cursor:pointer;display:grid;grid-template-columns:1fr auto;margin:.75rem 0;overflow:hidden;padding:0 1.5rem 0 2rem;transition:color .4s,background .4s,opacity .4s,box-shadow .4s;width:100%}[data-gene-ui-version=\"2.11.0\"] .bc-transfer-element:not(.minimalistic){background:var(--background);border:1px solid rgba(var(--background-sc-rgb),.1);border-radius:1rem;box-shadow:inset 0 0 0 4.2rem rgba(var(--hero-rgb),0),0 .2rem .4rem 0 rgba(var(--hero-rgb),0);height:4.2rem}@media (hover:hover){[data-gene-ui-version=\"2.11.0\"] .bc-transfer-element:not(.minimalistic):hover{border-color:rgba(var(--hero-rgb),.2);box-shadow:inset 0 0 0 4.2rem rgba(var(--hero-rgb),.1),0 .2rem .4rem 0 rgba(var(--hero-rgb),0);color:var(--hero)}}[data-gene-ui-version=\"2.11.0\"] .bc-transfer-element.hovered{border-color:rgba(var(--hero-rgb),.2);box-shadow:inset 0 0 0 4.2rem rgba(var(--hero-rgb),.1),0 .2rem .4rem 0 rgba(var(--hero-rgb),0);color:var(--hero)}[data-gene-ui-version=\"2.11.0\"] .bc-transfer-element.disabled{opacity:.5;pointer-events:none}[data-gene-ui-version=\"2.11.0\"] .bc-transfer-element.dragged{border-color:rgba(var(--hero-rgb),.1);box-shadow:inset 0 0 0 4.2rem rgba(var(--hero-rgb),.1),0 .2rem .4rem 0 rgba(var(--hero-rgb),.1);color:var(--hero)}[data-gene-ui-version=\"2.11.0\"] .bc-transfer-element.readOnly{cursor:default}[data-gene-ui-version=\"2.11.0\"] .bc-transfer-element.readOnly .crs-holder .crs-component{display:none}[data-gene-ui-version=\"2.11.0\"] .bc-transfer-element>.icon{cursor:grab}[data-gene-ui-version=\"2.11.0\"] .bc-transfer-element>.icon:active{cursor:grabbing}[data-gene-ui-version=\"2.11.0\"] .bc-transfer-element .crs-holder{pointer-events:none}";
+styleInject(css_248z$2);
+
+const TransferElement = /*#__PURE__*/forwardRef((_ref, ref) => {
+  let {
+    disabled,
+    hovered,
+    dragged,
+    checked,
+    label,
+    onClick,
+    readOnly,
+    minimalistic,
+    indeterminate
+  } = _ref;
+  return /*#__PURE__*/React__default.createElement("div", {
+    ref: ref,
+    onClick: onClick,
+    className: classnames('bc-transfer-element', 'crs-external-hover', 'crs-external-active', {
+      minimalistic,
+      disabled,
+      hovered,
+      dragged,
+      readOnly
+    })
+  }, /*#__PURE__*/React__default.createElement(Checkbox, {
+    indeterminate: indeterminate,
+    checked: checked,
+    label: label
+  }), !readOnly && !minimalistic && /*#__PURE__*/React__default.createElement(Icon, {
+    type: "bc-icon-drag"
+  }));
+});
+
+function TransferListItem(_ref) {
+  let {
+    index,
+    element,
+    onClick,
+    selected,
+    readOnly,
+    isDragActive,
+    multiSelectText,
+    selectedElementsLength
+  } = _ref;
+  const isDisabled = readOnly || element.disabled;
+  const handleClick = event => !isDisabled && onClick(index, event);
+  return /*#__PURE__*/React__default.createElement(PublicDraggable, {
+    isDragDisabled: isDisabled,
+    draggableId: element.id,
+    index: index
+  }, (_ref2, _ref3) => {
+    let {
+      innerRef,
+      draggableProps,
+      dragHandleProps
+    } = _ref2;
+    let {
+      isDragging
+    } = _ref3;
+    return /*#__PURE__*/React__default.createElement("div", _extends({
+      ref: innerRef
+    }, draggableProps, dragHandleProps, {
+      onClick: handleClick,
+      className: "bc-tl-item"
+    }), /*#__PURE__*/React__default.createElement(TransferElement, {
+      label: isDragging && selectedElementsLength > 1 ? "".concat(selectedElementsLength, " ").concat(multiSelectText) : element.title,
+      checked: selected,
+      readOnly: readOnly,
+      dragged: isDragging,
+      disabled: element.disabled || selected && isDragActive && !isDragging
+    }));
+  });
+}
+
+function TransferListButtons(_ref) {
+  let {
+    onTransmit,
+    send,
+    receive,
+    readOnly
+  } = _ref;
+  const handleReceive = () => onTransmit(send.id, receive.id);
+  const handleSend = () => onTransmit(receive.id, send.id);
+  return /*#__PURE__*/React__default.createElement("div", {
+    className: "bc-tl-buttons"
+  }, /*#__PURE__*/React__default.createElement(Tooltip, {
+    text: send.title
+  }, /*#__PURE__*/React__default.createElement(Button, {
+    onClick: handleSend,
+    disabled: readOnly || send.disabled,
+    icon: "bc-icon-arrow-right",
+    appearance: "clean"
+  })), /*#__PURE__*/React__default.createElement(Tooltip, {
+    text: receive.title
+  }, /*#__PURE__*/React__default.createElement(Button, {
+    onClick: handleReceive,
+    disabled: readOnly || receive.disabled,
+    icon: "bc-icon-arrow-left",
+    appearance: "clean"
+  })));
+}
+
+var css_248z$1 = "[data-gene-ui-version=\"2.11.0\"] .bc-transfer-container{width:100%}[data-gene-ui-version=\"2.11.0\"] .bc-transfer-container>li+li{border-top:1px solid var(--transfer-container-border-color,#0000)}[data-gene-ui-version=\"2.11.0\"] .bc-tl-head{align-items:center;display:flex;font:600 1.4rem/1.8rem var(--font-family);height:5.1rem;justify-content:space-between;padding:0 2rem}[data-gene-ui-version=\"2.11.0\"] .bc-tl-head h5{color:var(--hero)}[data-gene-ui-version=\"2.11.0\"] .bc-tl-head span{color:rgba(var(--background-sc-rgb),.5)}[data-gene-ui-version=\"2.11.0\"] .bc-tl-buttons{--button-external-size:4rem;border-width:medium;border-bottom:0 solid rgba(var(--background-sc-rgb),.1);border-left:1px solid rgba(var(--background-sc-rgb),.1);border-right:1px solid rgba(var(--background-sc-rgb),.1);border-top:0 solid rgba(var(--background-sc-rgb),.1);display:flex;flex-direction:column;flex-shrink:0;justify-content:center;padding:0 1rem}[data-gene-ui-version=\"2.11.0\"] .bc-tl-buttons>*+*{margin:1rem 0 0}[data-gene-ui-version=\"2.11.0\"] .bc-tl-search{padding:2rem}[data-gene-ui-version=\"2.11.0\"] .bc-tl-content-holder{height:var(--transfer-container-content-height);overflow:hidden;position:relative}[data-gene-ui-version=\"2.11.0\"] .bc-tl-content{display:flex;flex-direction:column;justify-content:flex-start;min-height:100%;padding:.7rem 2rem;width:100%}[data-gene-ui-version=\"2.11.0\"] .bc-tl-content>.bc-tl-item{opacity:1!important}[data-gene-ui-version=\"2.11.0\"] .bc-tl-placeholder{align-items:center;display:flex;height:100%;justify-content:center;left:0;padding:0 0 3.6rem;position:absolute;top:0;width:100%}[data-gene-ui-version=\"2.11.0\"] .bc-tl-drop-here{align-items:center;display:flex;flex-direction:column;font:600 1.4rem/1.8rem var(--font-family);text-align:center;width:100%}[data-gene-ui-version=\"2.11.0\"] .bc-tl-drop-here i{color:rgba(var(--hero-rgb),.1);font-size:11rem}";
+styleInject(css_248z$1);
+
+function TransferListContainer(_ref) {
+  let {
+    data,
+    isEditable,
+    messages,
+    onTransmit,
+    containerId,
+    isDragActive,
+    onElementSelect,
+    selectedElements,
+    onSelectAllElements,
+    transmissionButtons,
+    selectedElementsLength
+  } = _ref;
+  const [searchText, setSearchText] = useState('');
+  const filteredData = useMemo(() => {
+    const elements = [];
+    data.forEach((element, index) => {
+      if (element.title.toLowerCase().includes(searchText)) {
+        elements.push({
+          ...element,
+          index
+        });
+      }
+    });
+    return elements;
+  }, [data, searchText]);
+  const selectableElements = useMemo(() => filteredData.filter(_ref2 => {
+    let {
+      disabled
+    } = _ref2;
+    return !disabled;
+  }), [filteredData]);
+  const isAllSelected = useMemo(() => {
+    const selectableElements = filteredData.filter(_ref3 => {
+      let {
+        disabled
+      } = _ref3;
+      return !disabled;
+    });
+    const filteredSelectedElements = selectableElements.filter(_ref4 => {
+      let {
+        index
+      } = _ref4;
+      return selectedElements.includes(index);
+    });
+    return !!selectableElements.length && selectableElements.length === filteredSelectedElements.length && selectedElements.length === filteredSelectedElements.length;
+  }, [selectedElements, filteredData]);
+  const handleSelectAll = () => onSelectAllElements(containerId, isAllSelected);
+  const handleElementClick = index => onElementSelect(containerId, index);
+  const handleSearchChange = event => {
+    setSearchText(event.target.value.toLowerCase());
+  };
+  return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(ConnectedDroppable, {
+    key: containerId,
+    droppableId: containerId,
+    isDropDisabled: isEditable,
+    children: (_ref5, _ref6) => {
+      let {
+        innerRef,
+        placeholder,
+        droppableProps
+      } = _ref5;
+      let {
+        isDraggingOver
+      } = _ref6;
+      return /*#__PURE__*/React__default.createElement("ul", {
+        className: classnames('bc-transfer-container', {
+          isDraggingOver,
+          isDragActive
+        })
+      }, /*#__PURE__*/React__default.createElement("li", {
+        className: "bc-tl-head"
+      }, /*#__PURE__*/React__default.createElement("h5", null, messages && messages.titles ? messages.titles[containerId] : containerId), /*#__PURE__*/React__default.createElement("span", null, messages && messages.countTitle && messages.countTitle[containerId], " (", selectedElements.length, "/", data.length, ")")), /*#__PURE__*/React__default.createElement("li", {
+        className: "bc-tl-search"
+      }, /*#__PURE__*/React__default.createElement(Search, {
+        inputSize: "big",
+        disabled: !data.length,
+        onChange: handleSearchChange
+      })), /*#__PURE__*/React__default.createElement("li", {
+        className: "bc-tl-content-holder"
+      }, /*#__PURE__*/React__default.createElement(CustomScrollbar, null, /*#__PURE__*/React__default.createElement("div", _extends({
+        ref: innerRef
+      }, droppableProps, {
+        className: "bc-tl-content"
+      }), filteredData.length ? /*#__PURE__*/React__default.createElement(React__default.Fragment, null, !isEditable && /*#__PURE__*/React__default.createElement(TransferElement, {
+        minimalistic: true,
+        label: "Select All",
+        checked: isAllSelected,
+        onClick: handleSelectAll,
+        disabled: !selectableElements.length,
+        indeterminate: !isAllSelected && !!selectedElements.length
+      }), filteredData.map(element => /*#__PURE__*/React__default.createElement(TransferListItem, {
+        key: element.id,
+        element: element,
+        readOnly: isEditable,
+        index: element.index,
+        isDragActive: isDragActive,
+        onClick: handleElementClick,
+        selectedElementsLength: selectedElementsLength,
+        selected: selectedElements.includes(element.index),
+        multiSelectText: messages.multiSelectText
+      }))) : /*#__PURE__*/React__default.createElement("div", {
+        className: "bc-tl-placeholder pointer-events-none"
+      }, isDraggingOver ? /*#__PURE__*/React__default.createElement("div", {
+        className: "bc-tl-drop-here"
+      }, /*#__PURE__*/React__default.createElement(Icon, {
+        type: "bc-icon-drag-here"
+      }), /*#__PURE__*/React__default.createElement("p", null, messages.dropHere)) : /*#__PURE__*/React__default.createElement(Empty, {
+        size: "medium",
+        type: "data",
+        appearance: "greyscale",
+        title: messages.empty
+      }))), placeholder)));
+    }
+  }), transmissionButtons && /*#__PURE__*/React__default.createElement(TransferListButtons, _extends({
+    readOnly: isEditable,
+    onTransmit: onTransmit
+  }, transmissionButtons)));
+}
+
+var css_248z = "[data-gene-ui-version=\"2.11.0\"] .bc-transfer-list{--transfer-container-border-color:rgba(var(--background-sc-rgb),0.1);--transfer-container-content-height:33.4rem;background:var(--background);box-shadow:0 0 0 1px var(--transfer-container-border-color);display:flex;grid-template-columns:1fr auto 1fr;-webkit-user-select:none;user-select:none;width:100%}[data-gene-ui-version=\"2.11.0\"] .bc-transfer-list .scroll-holder .scroll-content{z-index:inherit}";
+styleInject(css_248z);
+
+function TransferList(_ref) {
+  let {
+    onChange,
+    className,
+    isEditable,
+    defaultData,
+    translateMessages,
+    ...props
+  } = _ref;
+  if (!(defaultData && Object.keys(defaultData).length)) {
+    console.error(DEFAULT_DATA_ERROR_MESSAGE);
+    return null;
+  }
+  const [isDragActive, setIsDragActive] = useState(false);
+  const [containers, setContainers] = useState(defaultData);
+  const [selectedElements, setSelectedElements] = useState(selectedInitialState(defaultData));
+  useEffect(() => {
+    setContainers(defaultData);
+    setSelectedElements(selectedInitialState(defaultData));
+  }, [defaultData, isEditable]);
+  const messages = useMemo(() => ({
+    ...DEFAULT_TRANSLATE_MESSAGE,
+    ...translateMessages
+  }), [translateMessages]);
+  const containersEntries = useMemo(() => Object.entries(containers), [containers]);
+  const selectedElementsLength = useMemo(() => selectedElements && Object.values(selectedElements).reduce((length, data) => {
+    length += data.length;
+    return length;
+  }, 0), [selectedElements]);
+  useDidMount(() => {
+    onChange(containers);
+  }, [onChange, containers]);
+  function handleDragStart() {
+    setIsDragActive(true);
+  }
+  function handleDragEnd(_ref2) {
+    let {
+      destination,
+      source
+    } = _ref2;
+    if (destination && source) {
+      if (selectedElementsLength) {
+        setContainers(containers => multiMoveElement({
+          containers,
+          destination,
+          selectedElements: {
+            ...selectedElements,
+            [source.droppableId]: unionIndexes([...selectedElements[source.droppableId], source.index])
+          }
+        }));
+      } else if (destination.droppableId === source.droppableId) {
+        setContainers(prev => ({
+          ...prev,
+          [source.droppableId]: reorderElement(prev[source.droppableId], source.index, destination.index)
+        }));
+      } else {
+        setContainers(prev => moveElement(prev, source, destination));
+      }
+      setSelectedElements(selectedInitialState(containers));
+    }
+    setIsDragActive(false);
+  }
+  const handleElementSelect = useCallback((source, index) => {
+    setSelectedElements(prev => ({
+      ...prev,
+      [source]: addOrRemove(prev[source], index)
+    }));
+  }, []);
+  const handleSelectAllElements = useCallback((containerId, isUnselect) => {
+    let indexes = [];
+    if (!isUnselect) {
+      indexes = containers[containerId].map((_ref3, index) => {
+        let {
+          disabled
+        } = _ref3;
+        return !disabled && index;
+      }).filter(index => typeof index === 'number');
+    }
+    setSelectedElements(prev => ({
+      ...prev,
+      [containerId]: indexes
+    }));
+  }, [containers]);
+  const transmissionButtons = useCallback(index => {
+    var _containersEntries$in, _containersEntries;
+    const prev = (_containersEntries$in = containersEntries[index]) === null || _containersEntries$in === void 0 ? void 0 : _containersEntries$in[0];
+    const next = (_containersEntries = containersEntries[index + 1]) === null || _containersEntries === void 0 ? void 0 : _containersEntries[0];
+    if (prev && next) {
+      return {
+        send: {
+          id: next,
+          disabled: !selectedElements[prev].length,
+          title: "".concat(messages.moveTo, " ").concat(messages.titles[next])
+        },
+        receive: {
+          id: prev,
+          disabled: !selectedElements[next].length,
+          title: "".concat(messages.moveTo, " ").concat(messages.titles[prev])
+        }
+      };
+    }
+  }, [messages, containersEntries, selectedElements]);
+  const handleTransmit = useCallback((ofContainer, toConteiner) => {
+    setContainers(prev => multiMoveElement({
+      containers: prev,
+      selectedElements: {
+        [ofContainer]: selectedElements[ofContainer]
+      },
+      destination: {
+        index: 0,
+        droppableId: toConteiner
+      }
+    }));
+    setSelectedElements(prev => ({
+      ...prev,
+      [toConteiner]: prev[toConteiner].map(i => i + prev[ofContainer].length),
+      [ofContainer]: []
+    }));
+  }, [selectedElements]);
+  return /*#__PURE__*/React__default.createElement("div", {
+    className: classnames('bc-transfer-list', className)
+  }, /*#__PURE__*/React__default.createElement(DragDropContext, {
+    onDragEnd: handleDragEnd,
+    onDragStart: handleDragStart
+  }, containersEntries.map((_ref4, index) => {
+    let [id, data] = _ref4;
+    return /*#__PURE__*/React__default.createElement(TransferListContainer, {
+      key: id,
+      data: data,
+      containerId: id,
+      messages: messages,
+      isEditable: isEditable,
+      onTransmit: handleTransmit,
+      isDragActive: isDragActive,
+      onElementSelect: handleElementSelect,
+      selectedElements: selectedElements[id],
+      onSelectAllElements: handleSelectAllElements,
+      selectedElementsLength: selectedElementsLength,
+      transmissionButtons: transmissionButtons(index)
+    });
+  })));
+}
+TransferList.propTypes = {
+  /**
+   * DefaultData there should be objects with different keys names, inside which there should be container data
+   * { taskts: [], toDo: [{ id: 1, name: "Element 1", disabled: false }] }
+   */
+  defaultData: propTypesExports.object.isRequired,
+  /**
+   * onChange listen to the change in the container and return you the new object
+   */
+  onChange: propTypesExports.func,
+  /**
+   * Using translateMessages prop you can add/change the text title of the containers, count subtitle, empty Text, etc.
+   */
+  translateMessages: propTypesExports.shape({
+    titles: propTypesExports.object,
+    countTitle: propTypesExports.object,
+    dropHere: propTypesExports.string,
+    empty: propTypesExports.string
+  }),
+  /**
+   * CSS classname to add on the outer container.
+   */
+  className: propTypesExports.string,
+  /**
+   * When do you send: false
+   * Hide Select All buttons / items checkboxes / disabled all drag and drop functionality
+   */
+  isEditable: propTypesExports.bool
+};
+TransferList.defaultProps = {
+  onChange: noop
+};
+
+export { TransferList as default };

package/Uploader.js

@@ -0,0 +1,32 @@
+import './_rollupPluginBabelHelpers-e8fb2e5c.js';
+import 'react';
+import './index-e0af0caf.js';
+import './index-6ff23041.js';
+import './configs-91c86664.js';
+import './index-ac59cb10.js';
+export { U as default } from './index-d9e8a888.js';
+import './Grid.js';
+import './Button.js';
+import './ExtendedInput.js';
+import './globalStyling-9c60a159.js';
+import './dateValidation-67caec66.js';
+import './_commonjsHelpers-24198af3.js';
+import 'react-dom';
+import './useKeyDown-38102ae7.js';
+import './BusyLoader.js';
+import './Icon.js';
+import './style-inject.es-746bb8ed.js';
+import './Image.js';
+import './Empty.js';
+import './Tooltip.js';
+import './Popover-f4d1cac0.js';
+import './useDeviceType-dd51db38.js';
+import './useWindowSize-80369d76.js';
+import './GeneUIProvider.js';
+import './Checkbox.js';
+import './checkboxRadioSwitcher-5b69d7bd.js';
+import './guid-8ddf77b3.js';
+import './useWidth-9f4647f8.js';
+import './index-5cea9a7d.js';
+import './useClickOutside-5183e396.js';
+import './Scrollbar.js';

package/ValidatableCheckbox.js

@@ -0,0 +1,126 @@
+import { _ as _extends } from './_rollupPluginBabelHelpers-e8fb2e5c.js';
+import React__default, { forwardRef, useState, useCallback, useEffect } from 'react';
+import { p as propTypesExports } from './index-e0af0caf.js';
+import { n as noop, i as interceptValue } from './index-ac59cb10.js';
+import { u as useMount } from './useMount-6fef51a5.js';
+import './configs-91c86664.js';
+import Checkbox from './Checkbox.js';
+import './dateValidation-67caec66.js';
+import './_commonjsHelpers-24198af3.js';
+import 'react-dom';
+import './index-6ff23041.js';
+import './Tooltip.js';
+import './Popover-f4d1cac0.js';
+import './useDeviceType-dd51db38.js';
+import './useWindowSize-80369d76.js';
+import './GeneUIProvider.js';
+import './globalStyling-9c60a159.js';
+import './style-inject.es-746bb8ed.js';
+import './checkboxRadioSwitcher-5b69d7bd.js';
+import './guid-8ddf77b3.js';
+
+function checkValidation(required, isValid, checked) {
+  if (isValid === false) return {
+    key: 'customValidation',
+    isValid: false
+  };
+  if (required && !checked) return {
+    key: 'required',
+    isValid: false
+  };
+  return {
+    key: null,
+    isValid: true
+  };
+}
+const CheckboxField = /*#__PURE__*/forwardRef((props, ref) => {
+  const {
+    onChange,
+    value,
+    isValid,
+    required,
+    isFieldValid,
+    forceAllowValidation,
+    ...restProps
+  } = props;
+  const isControlled = 'value' in props && typeof value !== 'undefined';
+  const [validationState, setValidationState] = useState(true);
+  const [checked, setChecked] = useState(false);
+  const [allowValidation, setAllowValidation] = useState(false);
+  const validate = useCallback(() => checkValidation(required, isValid, checked).isValid, [checked, required, isValid]);
+  const handleChange = useCallback(e => {
+    const {
+      checked
+    } = e.target;
+    const {
+      isValid: isCheckboxValid,
+      key
+    } = checkValidation(required, isValid, checked);
+    setValidationState(isCheckboxValid);
+    setChecked(checked);
+    onChange(interceptValue(e, value), isCheckboxValid, key);
+  }, [onChange, required, isValid]);
+
+  // we use this because need to show field validation after onBlur
+  const onBlur = useCallback(() => setAllowValidation(true), []);
+  useEffect(() => {
+    isControlled && setValidationState(validate());
+  }, [isControlled, validate]);
+
+  // need this for handling user's `isValid` prop
+  useEffect(() => {
+    setValidationState(isValid);
+  }, [isValid]);
+
+  // call function when validation state changes
+  useEffect(() => {
+    isFieldValid(validationState);
+  }, [validationState]);
+
+  // set Allow validation true if submit button clicked
+  useEffect(() => {
+    forceAllowValidation && setAllowValidation(true);
+  }, [forceAllowValidation]);
+  useMount(() => setValidationState(validate()));
+  return /*#__PURE__*/React__default.createElement(Checkbox, _extends({
+    required: required,
+    ref: ref,
+    value: value,
+    isValid: !allowValidation || validationState,
+    onChange: handleChange,
+    onBlur: onBlur
+  }, restProps));
+});
+CheckboxField.propTypes = {
+  /**
+   * Value for checkbox
+   */
+  value: propTypesExports.oneOfType([propTypesExports.string, propTypesExports.bool]),
+  /**
+   * Callback fires when checkbox changes
+   */
+  onChange: propTypesExports.func,
+  /**
+   * Define is field required or no.
+   */
+  required: propTypesExports.bool,
+  /**
+   * Callback fires when field validation state changes
+   */
+  isFieldValid: propTypesExports.func,
+  /**
+   * Additional validation state
+   */
+  isValid: propTypesExports.bool,
+  /**
+   * Allow validation without onBlur, validate field when mount
+   */
+  forceAllowValidation: propTypesExports.bool
+};
+CheckboxField.defaultProps = {
+  isValid: true,
+  isFieldValid: noop,
+  onChange: noop
+};
+
+export { CheckboxField as default };