@homecode/ui 4.18.16 → 4.18.18

package/dist/esm/src/components/DatePicker/DatePicker.js

@@ -1,2 +1,47 @@
-import{jsxs,jsx}from"react/jsx-runtime";import{useState,useCallback,createElement}from"react";import cn from"classnames";import{Calendar}from"../Calendar/Calendar.js";import{Button}from"../Button/Button.js";import{dateToString,isDateAfter,strigToDate,isDateBetween,isDateEqual}from"./DatePicker.helpers.js";import S from"./DatePicker.styl.js";function DatePicker(e){const{value:c,onChange:D,size:d,doubleCalendar:a,calendarProps:t={}}=e,m=Array.isArray(c),[u,r]=useState(!1);var n=useCallback(e=>{e=dateToString(e);D(m?[e,c[1]]:e)},[c,D,m]),s=useCallback((a,{className:e,...t})=>{var{day:r,year:n,month:s}=a;const o=dateToString(a);m&&u&&(t.onPointerOver=()=>{var e=isDateAfter(strigToDate(c[0]),a)?[o,c[0]]:[c[0],o];D(e)});var i,l,e=[e,S.day];return m&&(i=strigToDate(c[0]),l=strigToDate(c[1]),isDateBetween(a,i,l)&&e.push(S.between),isDateEqual(a,i)&&e.push(S.start),isDateEqual(a,l))&&e.push(S.end),createElement(Button,{...t,variant:"clear",className:cn(e),size:d,key:n+`-${s}-`+r},r)},[d,u,m,c,D]);return t.className=cn(t.className,S.calendar),jsxs("div",{className:cn(S.root,a&&S.doubleCalendar,e.className),onPointerDown:()=>r(!0),onPointerUp:()=>r(!1),children:[jsx(Calendar,{size:d,hideOtherMonthDays:m,...t,renderDay:s,value:strigToDate(m?c[0]:c),onDayPointerDown:n,onDayPointerUp:void 0}),m&&a&&jsx(Calendar,{size:d,hideOtherMonthDays:m,...t,renderDay:s,value:strigToDate(c[1]),onDayPointerDown:e=>D([c[0],dateToString(e)]),onDayPointerUp:e=>D([c[0],dateToString(e)])})]})}export{DatePicker};
-//# sourceMappingURL=DatePicker.js.map
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useState, useCallback, createElement } from 'react';
+import cn from 'classnames';
+import { Calendar } from '../Calendar/Calendar.js';
+import { Button } from '../Button/Button.js';
+import { dateToString, isDateAfter, strigToDate, isDateBetween, isDateEqual } from './DatePicker.helpers.js';
+import S from './DatePicker.styl.js';
+
+function DatePicker(props) {
+    const { value, onChange, size, doubleCalendar, calendarProps = {} } = props;
+    const isRange = Array.isArray(value);
+    const [isPicking, setIsPicking] = useState(false);
+    const onFirstDateChange = useCallback((val) => {
+        const valStr = dateToString(val);
+        onChange(isRange ? [valStr, value[1]] : valStr);
+    }, [value, onChange, isRange]);
+    const onPointerDown = () => setIsPicking(true);
+    const onPointerUp = () => setIsPicking(false);
+    const renderDay = useCallback((val, { className, ...props }) => {
+        const { day, year, month } = val;
+        const valStr = dateToString(val);
+        if (isRange && isPicking) {
+            props.onPointerOver = () => {
+                const newVal = isDateAfter(strigToDate(value[0]), val)
+                    ? [valStr, value[0]]
+                    : [value[0], valStr];
+                onChange(newVal);
+            };
+        }
+        const classes = [className, S.day];
+        if (isRange) {
+            const from = strigToDate(value[0]);
+            const to = strigToDate(value[1]);
+            if (isDateBetween(val, from, to))
+                classes.push(S.between);
+            if (isDateEqual(val, from))
+                classes.push(S.start);
+            if (isDateEqual(val, to))
+                classes.push(S.end);
+        }
+        return (createElement(Button, { ...props, variant: "clear", className: cn(classes), size: size, key: `${year}-${month}-${day}` }, day));
+    }, [size, isPicking, isRange, value, onChange]);
+    calendarProps.className = cn(calendarProps.className, S.calendar);
+    return (jsxs("div", { className: cn(S.root, doubleCalendar && S.doubleCalendar, props.className), onPointerDown: onPointerDown, onPointerUp: onPointerUp, children: [jsx(Calendar, { size: size, hideOtherMonthDays: isRange, ...calendarProps, renderDay: renderDay, value: strigToDate(isRange ? value[0] : value), onDayPointerDown: onFirstDateChange, onDayPointerUp: undefined }), isRange && doubleCalendar && (jsx(Calendar, { size: size, hideOtherMonthDays: isRange, ...calendarProps, renderDay: renderDay, value: strigToDate(value[1]), onDayPointerDown: val => onChange([value[0], dateToString(val)]), onDayPointerUp: val => onChange([value[0], dateToString(val)]) }))] }));
+}
+
+export { DatePicker };

package/dist/esm/src/components/DatePicker/DatePicker.styl.js

@@ -1,2 +1,7 @@
-import styleInject from"../../../node_modules/style-inject/dist/style-inject.es.js";var css_248z=".DatePicker_root__hh-PP{display:flex;flex-direction:row;gap:var(--indent-m)}.DatePicker_calendar__0Fk4N{width:100%}.DatePicker_doubleCalendar__4YbNN .DatePicker_calendar__0Fk4N{width:50%}.DatePicker_day__kGD0i.DatePicker_end__KYPnO,.DatePicker_day__kGD0i.DatePicker_start__qd0rW{background-color:var(--active-color-alpha-500)!important}.DatePicker_day__kGD0i.DatePicker_start__qd0rW{border-bottom-right-radius:0;border-top-right-radius:0}.DatePicker_day__kGD0i.DatePicker_end__KYPnO{border-bottom-left-radius:0;border-top-left-radius:0}.DatePicker_day__kGD0i.DatePicker_between__1Bifb{background-color:var(--active-color-alpha-100);border-radius:0}.DatePicker_day__kGD0i:hover{background-color:var(--accent-color-alpha-100)}",S={root:"DatePicker_root__hh-PP",calendar:"DatePicker_calendar__0Fk4N",doubleCalendar:"DatePicker_doubleCalendar__4YbNN",day:"DatePicker_day__kGD0i",start:"DatePicker_start__qd0rW",end:"DatePicker_end__KYPnO",between:"DatePicker_between__1Bifb"};styleInject(css_248z);export{S as default};
-//# sourceMappingURL=DatePicker.styl.js.map
+import styleInject from '../../../node_modules/style-inject/dist/style-inject.es.js';
+
+var css_248z = ".DatePicker_root__hh-PP{display:flex;flex-direction:row;gap:var(--indent-m)}.DatePicker_calendar__0Fk4N{width:100%}.DatePicker_doubleCalendar__4YbNN .DatePicker_calendar__0Fk4N{width:50%}.DatePicker_day__kGD0i.DatePicker_end__KYPnO,.DatePicker_day__kGD0i.DatePicker_start__qd0rW{background-color:var(--active-color-alpha-500)!important}.DatePicker_day__kGD0i.DatePicker_start__qd0rW{border-bottom-right-radius:0;border-top-right-radius:0}.DatePicker_day__kGD0i.DatePicker_end__KYPnO{border-bottom-left-radius:0;border-top-left-radius:0}.DatePicker_day__kGD0i.DatePicker_between__1Bifb{background-color:var(--active-color-alpha-100);border-radius:0}.DatePicker_day__kGD0i:hover{background-color:var(--accent-color-alpha-100)}";
+var S = {"root":"DatePicker_root__hh-PP","calendar":"DatePicker_calendar__0Fk4N","doubleCalendar":"DatePicker_doubleCalendar__4YbNN","day":"DatePicker_day__kGD0i","start":"DatePicker_start__qd0rW","end":"DatePicker_end__KYPnO","between":"DatePicker_between__1Bifb"};
+styleInject(css_248z);
+
+export { S as default };

package/dist/esm/src/components/DatePickerInput/DatePickerInput.js

@@ -1,2 +1,20 @@
-import{jsx,jsxs,Fragment}from"react/jsx-runtime";import cn from"classnames";import{strToDate}from"../../tools/date.js";import{DateTime}from"../DateTime/DateTime.js";import{DatePicker}from"../DatePicker/DatePicker.js";import{Button}from"../Button/Button.js";import{Popup}from"../Popup/Popup.js";import S from"./DatePickerInput.styl.js";function DatePickerInput(t){var{value:e,variant:r="default",size:a="m",popupProps:o,displayFormat:s="MMM Do YYYY"}=t,i=Array.isArray(e);return jsx(Popup,{size:a,focusControl:!0,direction:"bottom-right",...o,trigger:jsx(Button,{variant:r,size:a,children:i?jsxs(Fragment,{children:[jsx(DateTime,{value:strToDate(e[0]),format:s})," - ",jsx(DateTime,{value:strToDate(e[1]),format:s})]}):jsx(DateTime,{value:strToDate(e),format:s})}),contentProps:{className:cn(S.popupContent,t.doubleCalendar&&S.doubleCalendar,S["size-"+a])},content:jsx(DatePicker,{...t,className:S.content,calendarProps:{className:S.calendar}})})}export{DatePickerInput};
-//# sourceMappingURL=DatePickerInput.js.map
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import cn from 'classnames';
+import { strToDate } from '../../tools/date.js';
+import { DateTime } from '../DateTime/DateTime.js';
+import { DatePicker } from '../DatePicker/DatePicker.js';
+import { Button } from '../Button/Button.js';
+import { Popup } from '../Popup/Popup.js';
+import S from './DatePickerInput.styl.js';
+
+function DatePickerInput(props) {
+    const { value, variant = 'default', size = 'm', popupProps, displayFormat = 'MMM Do YYYY', } = props;
+    const isRange = Array.isArray(value);
+    return (jsx(Popup, { size: size, focusControl: true, direction: "bottom-right", ...popupProps, trigger: 
+        // @ts-ignore
+        jsx(Button, { variant: variant, size: size, children: isRange ? (jsxs(Fragment, { children: [jsx(DateTime, { value: strToDate(value[0]), format: displayFormat }), ' - ', jsx(DateTime, { value: strToDate(value[1]), format: displayFormat })] })) : (jsx(DateTime, { value: strToDate(value), format: displayFormat })) }), contentProps: {
+            className: cn(S.popupContent, props.doubleCalendar && S.doubleCalendar, S[`size-${size}`]),
+        }, content: jsx(DatePicker, { ...props, className: S.content, calendarProps: { className: S.calendar } }) }));
+}
+
+export { DatePickerInput };

package/dist/esm/src/components/DatePickerInput/DatePickerInput.styl.js

@@ -1,2 +1,7 @@
-import styleInject from"../../../node_modules/style-inject/dist/style-inject.es.js";var css_248z=".DatePickerInput_popupContent__rcVHH{min-width:-moz-fit-content;min-width:fit-content}.DatePickerInput_content__yll-b{padding:.5em}.DatePickerInput_range__xWj9K .DatePickerInput_content__yll-b{display:flex;flex-direction:row;flex-wrap:nowrap;gap:1em}.DatePickerInput_doubleCalendar__H5CMo .DatePickerInput_calendar__vf0za{width:50%}.DatePickerInput_size-s__5t05o{border-radius:6px!important}.DatePickerInput_size-s__5t05o .DatePickerInput_content__yll-b{min-width:12em;padding:8px}.DatePickerInput_doubleCalendar__H5CMo.DatePickerInput_size-s__5t05o .DatePickerInput_content__yll-b{min-width:25em}.DatePickerInput_size-m__TTkHV{border-radius:9px!important}.DatePickerInput_size-m__TTkHV .DatePickerInput_content__yll-b{min-width:16em;padding:12px}.DatePickerInput_doubleCalendar__H5CMo.DatePickerInput_size-m__TTkHV .DatePickerInput_content__yll-b{min-width:33em}.DatePickerInput_size-l__-fWkE{border-radius:12px!important}.DatePickerInput_size-l__-fWkE .DatePickerInput_content__yll-b{min-width:20em;padding:14px}.DatePickerInput_doubleCalendar__H5CMo.DatePickerInput_size-l__-fWkE .DatePickerInput_content__yll-b{min-width:41em}",S={popupContent:"DatePickerInput_popupContent__rcVHH",content:"DatePickerInput_content__yll-b",range:"DatePickerInput_range__xWj9K",doubleCalendar:"DatePickerInput_doubleCalendar__H5CMo",calendar:"DatePickerInput_calendar__vf0za","size-s":"DatePickerInput_size-s__5t05o","size-m":"DatePickerInput_size-m__TTkHV","size-l":"DatePickerInput_size-l__-fWkE"};styleInject(css_248z);export{S as default};
-//# sourceMappingURL=DatePickerInput.styl.js.map
+import styleInject from '../../../node_modules/style-inject/dist/style-inject.es.js';
+
+var css_248z = ".DatePickerInput_popupContent__rcVHH{min-width:-moz-fit-content;min-width:fit-content}.DatePickerInput_content__yll-b{padding:.5em}.DatePickerInput_range__xWj9K .DatePickerInput_content__yll-b{display:flex;flex-direction:row;flex-wrap:nowrap;gap:1em}.DatePickerInput_doubleCalendar__H5CMo .DatePickerInput_calendar__vf0za{width:50%}.DatePickerInput_size-s__5t05o{border-radius:6px!important}.DatePickerInput_size-s__5t05o .DatePickerInput_content__yll-b{min-width:12em;padding:8px}.DatePickerInput_doubleCalendar__H5CMo.DatePickerInput_size-s__5t05o .DatePickerInput_content__yll-b{min-width:25em}.DatePickerInput_size-m__TTkHV{border-radius:9px!important}.DatePickerInput_size-m__TTkHV .DatePickerInput_content__yll-b{min-width:16em;padding:12px}.DatePickerInput_doubleCalendar__H5CMo.DatePickerInput_size-m__TTkHV .DatePickerInput_content__yll-b{min-width:33em}.DatePickerInput_size-l__-fWkE{border-radius:12px!important}.DatePickerInput_size-l__-fWkE .DatePickerInput_content__yll-b{min-width:20em;padding:14px}.DatePickerInput_doubleCalendar__H5CMo.DatePickerInput_size-l__-fWkE .DatePickerInput_content__yll-b{min-width:41em}";
+var S = {"popupContent":"DatePickerInput_popupContent__rcVHH","content":"DatePickerInput_content__yll-b","range":"DatePickerInput_range__xWj9K","doubleCalendar":"DatePickerInput_doubleCalendar__H5CMo","calendar":"DatePickerInput_calendar__vf0za","size-s":"DatePickerInput_size-s__5t05o","size-m":"DatePickerInput_size-m__TTkHV","size-l":"DatePickerInput_size-l__-fWkE"};
+styleInject(css_248z);
+
+export { S as default };

package/dist/esm/src/components/DateTime/DateTime.js

@@ -1,2 +1,17 @@
-import{jsx,Fragment}from"react/jsx-runtime";import moment from"moment";function formatDate({value:t,format:e,locale:a="en"}){t=moment(t).locale(a);return e?t[e]?t[e]():t.format(e):t.toString()}function DateTime({value:t=new Date,format:e,locale:a}){return jsx(Fragment,{children:formatDate({value:t,format:e,locale:a})})}export{DateTime,formatDate};
-//# sourceMappingURL=DateTime.js.map
+import { jsx, Fragment } from 'react/jsx-runtime';
+import moment from 'moment';
+
+function formatDate({ value, format, locale = 'en' }) {
+    const d = moment(value).locale(locale);
+    if (format) {
+        if (d[format])
+            return d[format]();
+        return d.format(format);
+    }
+    return d.toString();
+}
+function DateTime({ value = new Date(), format, locale }) {
+    return jsx(Fragment, { children: formatDate({ value, format, locale }) });
+}
+
+export { DateTime, formatDate };

package/dist/esm/src/components/Draggable/Draggable.js

@@ -1,2 +1,136 @@
-import{jsxs,jsx}from"react/jsx-runtime";import{Component}from"react";import{createStore}from"justorm/react";import cn from"classnames";import Time from"timen";import"nanoid";import"../../tools/dom.js";import debounce from"../../tools/debounce.js";import"compareq";import"lodash.pick";import"../../tools/queryParams.js";import S from"./Draggable.styl.js";class Draggable extends Component{store;startPos=null;draggingElem=null;draggingElemBounds=null;dragStartFired=!1;timers=Time.create();constructor(t){super(t),this.store=createStore(this,{draggingId:null,underId:null,underOffset:""})}componentDidUpdate(t){t.items.join(",")!==this.props.items.join(",")&&this.dropUnder()}componentWillUnmount(){this.timers.clear()}onPointerDown=t=>{var{clientX:e,clientY:r,currentTarget:n}=t;t.stopPropagation(),this.timers.clear(),this.startPos={x:e,y:r},this.draggingElem=n,this.draggingElemBounds=n.getBoundingClientRect(),document.addEventListener("pointermove",this.onPointerMove),document.addEventListener("pointerup",this.onPointerUp)};onPointerMove=t=>{var e,r,n;this.draggingElem&&({clientX:t,clientY:e}=t,this.store.draggingId||(this.store.draggingId=this.draggingElem.dataset.id),this.dragStartFired||(this.dragStartFired=!0,this.props.onDragStart?.(this.store.draggingId)),r=t-this.startPos.x,n=e-this.startPos.y,this.transformInner(this.draggingElem,`translate(${r}px, ${n}px)`),this.checkUnderElem(t,e))};checkUnderElem=debounce((t,e)=>{var r,n,s,t=document.elementFromPoint(t,e)?.closest("."+S.item);t?(e=t.dataset.id,{draggingId:r,underId:n}=this.store,this.startPos&&e!==r&&e!==n&&({x:r,y:n}=this.draggingElemBounds,{x:t,y:s}=this.selectInner(t).getBoundingClientRect(),this.store.underOffset=`translate(${r-t}px, ${n-s}px)`,this.store.underId=e)):(this.store.underOffset="",this.store.underId=null)},100);onPointerOut=({target:t})=>{var e=t.dataset["id"];e&&e!==this.store.draggingId&&(this.transformInner(t,null),this.dropUnder())};onPointerUp=t=>{const{underId:e,draggingId:r}=this.store,{onChange:n,onDragEnd:s}=this.props;var i,o,d=this.draggingElem.dataset["id"];r&&(t.stopPropagation(),t.preventDefault()),document.removeEventListener("pointermove",this.onPointerMove),document.removeEventListener("pointerup",this.onPointerUp),this.dragStartFired=!1,this.startPos=null,this.store.draggingId=null,e&&n&&(i=(t=[...this.props.items]).indexOf(d),o=t.indexOf(e),t[o]=d,t[i]=e,n(t)),this.dropUnder(),this.timers.after(100,()=>{this.draggingElem&&(this.selectInner(this.draggingElem).style.transform=null,this.draggingElem=null),s?.(r)})};selectInner=t=>t.querySelector("& > div");transformInner(t,e){t&&(this.selectInner(t).style.transform=e)}dropUnder(){this.store.underId=null,this.store.underOffset=null}render(){const{items:t,className:e,itemClassName:r,renderItem:n,children:s}=this.props,{draggingId:i,underId:o,underOffset:d}=this.store;return jsxs("div",{className:cn(S.root,i&&S.dragging,e),children:[t.map(t=>jsx("div",{className:cn(S.item,r,t===i&&S.active),onPointerDown:this.onPointerDown,"data-id":t,children:jsx("div",{className:S.inner,style:o===t?{transform:d}:null,children:n(t,t===i)})},t)),s]})}}export{Draggable};
-//# sourceMappingURL=Draggable.js.map
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { Component } from 'react';
+import { createStore } from 'justorm/react';
+import cn from 'classnames';
+import Time from 'timen';
+import 'nanoid';
+import '../../tools/dom.js';
+import debounce from '../../tools/debounce.js';
+import 'compareq';
+import 'lodash.pick';
+import '../../tools/queryParams.js';
+import S from './Draggable.styl.js';
+
+class Draggable extends Component {
+    store;
+    startPos = null;
+    draggingElem = null;
+    draggingElemBounds = null;
+    dragStartFired = false;
+    timers = Time.create();
+    constructor(props) {
+        super(props);
+        this.store = createStore(this, {
+            draggingId: null,
+            underId: null,
+            underOffset: '',
+        });
+    }
+    componentDidUpdate(prevProps) {
+        if (prevProps.items.join(',') !== this.props.items.join(',')) {
+            this.dropUnder();
+        }
+    }
+    componentWillUnmount() {
+        this.timers.clear();
+    }
+    onPointerDown = e => {
+        const { clientX: x, clientY: y, currentTarget } = e;
+        e.stopPropagation();
+        this.timers.clear();
+        this.startPos = { x, y };
+        this.draggingElem = currentTarget;
+        this.draggingElemBounds = currentTarget.getBoundingClientRect();
+        document.addEventListener('pointermove', this.onPointerMove);
+        document.addEventListener('pointerup', this.onPointerUp);
+    };
+    onPointerMove = e => {
+        if (!this.draggingElem)
+            return;
+        const { clientX: x, clientY: y } = e;
+        if (!this.store.draggingId) {
+            this.store.draggingId = this.draggingElem.dataset.id;
+        }
+        if (!this.dragStartFired) {
+            this.dragStartFired = true;
+            this.props.onDragStart?.(this.store.draggingId);
+        }
+        const dx = x - this.startPos.x;
+        const dy = y - this.startPos.y;
+        this.transformInner(this.draggingElem, `translate(${dx}px, ${dy}px)`);
+        this.checkUnderElem(x, y);
+    };
+    checkUnderElem = debounce((x, y) => {
+        const underItem = document.elementFromPoint(x, y)?.closest(`.${S.item}`);
+        if (!underItem) {
+            this.store.underOffset = '';
+            this.store.underId = null;
+            return;
+        }
+        // @ts-ignore
+        const { id } = underItem.dataset;
+        const { draggingId, underId } = this.store;
+        if (!this.startPos || id === draggingId || id === underId)
+            return;
+        const { x: x1, y: y1 } = this.draggingElemBounds;
+        const { x: x2, y: y2 } = this.selectInner(underItem).getBoundingClientRect();
+        const dx = x1 - x2;
+        const dy = y1 - y2;
+        this.store.underOffset = `translate(${dx}px, ${dy}px)`;
+        this.store.underId = id;
+    }, 100);
+    onPointerOut = ({ target }) => {
+        const { id } = target.dataset;
+        if (!id || id === this.store.draggingId)
+            return;
+        this.transformInner(target, null);
+        this.dropUnder();
+    };
+    onPointerUp = e => {
+        const { underId, draggingId } = this.store;
+        const { onChange, onDragEnd } = this.props;
+        const { id } = this.draggingElem.dataset;
+        if (draggingId) {
+            e.stopPropagation();
+            e.preventDefault();
+        }
+        document.removeEventListener('pointermove', this.onPointerMove);
+        document.removeEventListener('pointerup', this.onPointerUp);
+        this.dragStartFired = false;
+        this.startPos = null;
+        this.store.draggingId = null;
+        if (underId && onChange) {
+            const newItems = [...this.props.items];
+            const draggingIndex = newItems.indexOf(id);
+            const underIndex = newItems.indexOf(underId);
+            newItems[underIndex] = id;
+            newItems[draggingIndex] = underId;
+            onChange(newItems);
+        }
+        this.dropUnder();
+        this.timers.after(100, () => {
+            if (this.draggingElem) {
+                this.selectInner(this.draggingElem).style.transform = null;
+                this.draggingElem = null;
+            }
+            onDragEnd?.(draggingId);
+        });
+    };
+    selectInner = elem => elem.querySelector('& > div');
+    transformInner(elem, str) {
+        if (!elem)
+            return;
+        this.selectInner(elem).style.transform = str;
+    }
+    dropUnder() {
+        this.store.underId = null;
+        this.store.underOffset = null;
+    }
+    render() {
+        const { items, className, itemClassName, renderItem, children } = this.props;
+        const { draggingId, underId, underOffset } = this.store;
+        return (jsxs("div", { className: cn(S.root, draggingId && S.dragging, className), children: [items.map(id => (jsx("div", { className: cn(S.item, itemClassName, id === draggingId && S.active), onPointerDown: this.onPointerDown, "data-id": id, children: jsx("div", { className: S.inner, style: underId === id ? { transform: underOffset } : null, children: renderItem(id, id === draggingId) }) }, id))), children] }));
+    }
+}
+
+export { Draggable };

package/dist/esm/src/components/Draggable/Draggable.styl.js

@@ -1,2 +1,7 @@
-import styleInject from"../../../node_modules/style-inject/dist/style-inject.es.js";var css_248z=".Draggable_root__S1BgI{display:flex;flex-wrap:wrap;position:relative;touch-action:none}.Draggable_item__Z1pXk{display:flex}.Draggable_inner__c4syM{height:100%;transition:transform .2s ease-out;width:100%}.Draggable_dragging__M8qhF .Draggable_active__XcFM3,.Draggable_dragging__M8qhF .Draggable_inner__c4syM{pointer-events:none}.Draggable_dragging__M8qhF .Draggable_active__XcFM3 .Draggable_inner__c4syM{transition-duration:0s;z-index:1}",S={root:"Draggable_root__S1BgI",item:"Draggable_item__Z1pXk",inner:"Draggable_inner__c4syM",dragging:"Draggable_dragging__M8qhF",active:"Draggable_active__XcFM3"};styleInject(css_248z);export{S as default};
-//# sourceMappingURL=Draggable.styl.js.map
+import styleInject from '../../../node_modules/style-inject/dist/style-inject.es.js';
+
+var css_248z = ".Draggable_root__S1BgI{display:flex;flex-wrap:wrap;position:relative;touch-action:none}.Draggable_item__Z1pXk{display:flex}.Draggable_inner__c4syM{height:100%;transition:transform .2s ease-out;width:100%}.Draggable_dragging__M8qhF .Draggable_active__XcFM3,.Draggable_dragging__M8qhF .Draggable_inner__c4syM{pointer-events:none}.Draggable_dragging__M8qhF .Draggable_active__XcFM3 .Draggable_inner__c4syM{transition-duration:0s;z-index:1}";
+var S = {"root":"Draggable_root__S1BgI","item":"Draggable_item__Z1pXk","inner":"Draggable_inner__c4syM","dragging":"Draggable_dragging__M8qhF","active":"Draggable_active__XcFM3"};
+styleInject(css_248z);
+
+export { S as default };

package/dist/esm/src/components/Expand/Expand.js

@@ -1,2 +1,24 @@
-import{jsxs,jsx}from"react/jsx-runtime";import{useState,useCallback,useEffect}from"react";import cn from"classnames";import{Button}from"../Button/Button.js";import{Icon}from"../Icon/Icon.js";import S from"./Expand.styl.js";function Expand(e){const{className:s,size:t="m",header:n,headerClassName:a,content:o,contentProps:r={},isOpen:c=!1,onChange:i}=e,[m,l]=useState(c);e=useCallback(()=>{var e=!m;l(e),i?.(e)},[m]);return useEffect(()=>{l(c)},[c]),jsxs("div",{className:cn(S.root,m&&S.isOpen,s),children:[jsxs(Button,{variant:"clear",className:cn(S.header,a),size:t,onClick:e,children:[n," ",jsx(Icon,{type:"chevronRight",size:t,className:S.headerIcon})]}),m&&(o?.(r)||jsx("div",{...r,children:o}))]})}export{Expand};
-//# sourceMappingURL=Expand.js.map
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useState, useCallback, useEffect } from 'react';
+import cn from 'classnames';
+import { Button } from '../Button/Button.js';
+import { Icon } from '../Icon/Icon.js';
+import S from './Expand.styl.js';
+
+function Expand(props) {
+    const { className, size = 'm', header, headerClassName, content, contentProps = {}, isOpen: initialOpen = false, onChange, } = props;
+    const [isOpen, setIsOpen] = useState(initialOpen);
+    const onHeaderClick = useCallback(() => {
+        const value = !isOpen;
+        setIsOpen(value);
+        onChange?.(value);
+    }, [isOpen]);
+    useEffect(() => {
+        setIsOpen(initialOpen);
+    }, [initialOpen]);
+    return (jsxs("div", { className: cn(S.root, isOpen && S.isOpen, className), children: [jsxs(Button, { variant: "clear", className: cn(S.header, headerClassName), size: size, onClick: onHeaderClick, children: [header, "\u00A0", jsx(Icon, { type: "chevronRight", size: size, className: S.headerIcon })] }), isOpen &&
+                // @ts-ignore
+                (content?.(contentProps) || jsx("div", { ...contentProps, children: content }))] }));
+}
+
+export { Expand };

package/dist/esm/src/components/Expand/Expand.styl.js

@@ -1,2 +1,7 @@
-import styleInject from"../../../node_modules/style-inject/dist/style-inject.es.js";var css_248z=".Expand_root__zxSvx{display:flex;flex-direction:column}.Expand_root__zxSvx+.Expand_root__zxSvx{margin-top:var(--indent-s)}.Expand_header__LxAel{justify-content:space-between}.Expand_headerIcon__CXlwY{transition:transform .2s ease-out}.Expand_isOpen__k6lyZ .Expand_header__LxAel{background-color:var(--active-color-alpha-500)}.Expand_isOpen__k6lyZ .Expand_headerIcon__CXlwY{transform:rotate(90deg)}",S={root:"Expand_root__zxSvx",header:"Expand_header__LxAel",headerIcon:"Expand_headerIcon__CXlwY",isOpen:"Expand_isOpen__k6lyZ"};styleInject(css_248z);export{S as default};
-//# sourceMappingURL=Expand.styl.js.map
+import styleInject from '../../../node_modules/style-inject/dist/style-inject.es.js';
+
+var css_248z = ".Expand_root__zxSvx{display:flex;flex-direction:column}.Expand_root__zxSvx+.Expand_root__zxSvx{margin-top:var(--indent-s)}.Expand_header__LxAel{justify-content:space-between}.Expand_headerIcon__CXlwY{transition:transform .2s ease-out}.Expand_isOpen__k6lyZ .Expand_header__LxAel{background-color:var(--active-color-alpha-500)}.Expand_isOpen__k6lyZ .Expand_headerIcon__CXlwY{transform:rotate(90deg)}";
+var S = {"root":"Expand_root__zxSvx","header":"Expand_header__LxAel","headerIcon":"Expand_headerIcon__CXlwY","isOpen":"Expand_isOpen__k6lyZ"};
+styleInject(css_248z);
+
+export { S as default };

package/dist/esm/src/components/Form/Form.helpers.js

@@ -1,2 +1,42 @@
-import compare from"compareq";import{clone}from"../../tools/object.js";function patchWithCustomMessages(e,c){return e.reduce((e,{field:t,...o})=>{var r=c[t]?.message??c[t]?.messages?.[o.type];return r&&(o.message=r),{...e,[t]:o}},{})}function dropFocusFromSubmit(){document.querySelector("button[type=submit]:focus")?.blur()}function getInitialTouched(e){return Object.keys(e).reduce((e,t)=>({...e,[t]:!1}),{})}function getNotEmpty(e,t){const r=e||t;return Object.entries(t).reduce((e,[t,o])=>compare(r[t],o)?e:{...e,[t]:!0},{})}function getVal(e,t,o){return void 0!==t?t:e?.target?e.target[o]:e}function cloneValue(e){return"object"==typeof e&&null!==e?e?._isAMomentObject?e.clone():clone(e):e}function cloneValues(e){return Object.entries(e).reduce((e,[t,o])=>({...e,[t]:cloneValue(o)}),{})}export{cloneValues,dropFocusFromSubmit,getInitialTouched,getNotEmpty,getVal,patchWithCustomMessages};
-//# sourceMappingURL=Form.helpers.js.map
+import compare from 'compareq';
+import { clone } from '../../tools/object.js';
+
+function patchWithCustomMessages(checkRes, validationSchema) {
+    return checkRes.reduce((acc, { field, ...rest }) => {
+        const customMessage = validationSchema[field]?.message ??
+            validationSchema[field]?.messages?.[rest.type];
+        if (customMessage)
+            rest.message = customMessage;
+        return { ...acc, [field]: rest };
+    }, {});
+}
+function dropFocusFromSubmit() {
+    const focusedSubmit = document.querySelector('button[type=submit]:focus');
+    focusedSubmit?.blur(); // eslint-disable-line
+}
+function getInitialTouched(initialValues) {
+    return Object.keys(initialValues).reduce((acc, name) => ({ ...acc, [name]: false }), {});
+}
+function getNotEmpty(_defaultValues, values) {
+    const defaultValues = _defaultValues || values;
+    return Object.entries(values).reduce((acc, [field, val]) => compare(defaultValues[field], val) ? acc : { ...acc, [field]: true }, {});
+}
+function getVal(e, val, valField) {
+    if (val !== undefined)
+        return val;
+    return e?.target ? e.target[valField] : e;
+}
+function cloneValue(val) {
+    if (typeof val === 'object' && val !== null) {
+        // date
+        if (val?._isAMomentObject)
+            return val.clone();
+        return clone(val);
+    }
+    return val;
+}
+function cloneValues(values) {
+    return Object.entries(values).reduce((acc, [name, val]) => ({ ...acc, [name]: cloneValue(val) }), {});
+}
+
+export { cloneValues, dropFocusFromSubmit, getInitialTouched, getNotEmpty, getVal, patchWithCustomMessages };