@dotss/ui 1.1.2 → 1.1.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/Menu/Menu.cjs CHANGED
@@ -1,4 +1,4 @@
1
- "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const b=require("@emotion/react/jsx-runtime"),o=require("react"),ct=require("react-dom"),dt=require("../hooks/useCheckKeyboardMode/useCheckKeyboardMode.cjs"),G=require("../utils/getSibling/getSibling.cjs"),ft=require("@emotion/styled"),lt=e=>e&&e.__esModule?e:{default:e},M=lt(ft),at=M.default.div`
1
+ "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const v=require("@emotion/react/jsx-runtime"),s=require("react"),ft=require("react-dom"),dt=require("../hooks/useCheckKeyboardMode/useCheckKeyboardMode.cjs"),H=require("../utils/getSibling/getSibling.cjs"),at=require("@emotion/styled"),lt=e=>e&&e.__esModule?e:{default:e},M=lt(at),pt=M.default.div`
2
2
  position: fixed;
3
3
  top: 0;
4
4
  left: 0;
@@ -8,7 +8,7 @@
8
8
 
9
9
  ${({disableClickOutside:e})=>e?null:{pointerEvents:"none","& *":{pointerEvents:"auto"}}}}
10
10
 
11
- `,pt=M.default.div`
11
+ `,yt=M.default.div`
12
12
  position: fixed;
13
13
  max-width: calc(100% - ${({theme:{spacing:e}})=>e.layout(4)}px);
14
14
  overflow-y: auto;
@@ -21,14 +21,14 @@
21
21
  transform: scale(${({open:e})=>e?1:.97});
22
22
  opacity: ${({open:e})=>e?1:0};
23
23
  z-index: 100003;
24
- `,yt=M.default.ul`
24
+ `,vt=M.default.ul`
25
25
  display: flex;
26
26
  flex-direction: column;
27
27
  max-height: ${({maxHeight:e})=>e}px;
28
28
 
29
- ${({theme:{spacing:e},disablePadding:p})=>p?null:{padding:`${e.content(1)}px 0`}}}
29
+ ${({theme:{spacing:e},disablePadding:y})=>y?null:{padding:`${e.content(1)}px 0`}}}
30
30
  `,bt=M.default.div`
31
31
  width: 100%;
32
32
  height: 1px;
33
33
  background-color: ${({theme:{palette:{grey:e}}})=>e[20]};
34
- `,f=16,vt=o.forwardRef(function({children:p,anchorRef:i,open:h,onClose:l,spacing:v=4,transitionDuration:T=200,onChange:S,value:H,showDivider:P,placement:W="bottom-center",disablePadding:U=!1,disableClickOutside:V=!0,disableAutoPositioning:w=!1,width:q,fitToAnchorWidth:I=!0,maxHeight:O=476,style:J,inlineCSS:Q,menuProps:X,...Y},Z){const[g,z]=o.useState(0),[_,j]=o.useState("auto"),[R,K]=o.useState("auto"),[k,A]=o.useState(0),[D,L]=o.useState(!1),[tt,et]=o.useState(!1),[ot,C]=o.useState(!0),[st,y]=o.useState(null),x=o.useRef(),m=o.useRef(),E=o.useRef(null),{isKeyboardMode:ut}=dt.default(),rt=(t,s)=>n=>{n.stopPropagation(),typeof l=="function"&&l(),typeof S=="function"&&S(t,n),typeof s=="function"&&s(n)},it=t=>s=>{var r,c,d,a;if(s.key==="Tab"&&typeof l=="function"&&(l(),y(0)),(s.key==="Enter"||s.key===" ")&&typeof l=="function"&&typeof S=="function"&&(l(),S(t,s),i!=null&&i.current)){const u=i.current.querySelector("button");u&&ut&&u.focus()}const n=document.activeElement;if(n){if(s.code==="ArrowDown"){const u=G.default(n,"next",{skipDisabled:!0});u&&u.dataset.index?(y(Number(u.dataset.index)),u.focus()):(y(0),(c=(r=E.current)==null?void 0:r.querySelector('[role="menuitem"]'))==null||c.focus())}if(s.code==="ArrowUp"){const u=G.default(n,"prev",{skipDisabled:!0});u&&u.dataset.index?(y(Number(u.dataset.index)),u.focus()):(y(o.Children.count(p)-1),(a=(d=E.current)==null?void 0:d.querySelector('[role="menuitem"]:last-child'))==null||a.focus())}}};return o.useEffect(()=>{h&&(m.current&&clearTimeout(m.current),document.body.style.overflow="hidden",C(!1),x.current=setTimeout(()=>{L(!0)},100))},[h]),o.useEffect(()=>{h||(x.current&&clearTimeout(x.current),L(!1),document.body.removeAttribute("style"),m.current=setTimeout(()=>{C(!0),y(0)},T))},[h,T]),o.useEffect(()=>{const t=()=>{var B;const{offsetWidth:s=0,offsetHeight:n=0}=(i==null?void 0:i.current)||{},r=((B=i==null?void 0:i.current)==null?void 0:B.getBoundingClientRect())||{top:0,left:0,bottom:0},{offsetWidth:c=0,offsetHeight:d=0}=E.current||{},[a,u]=W.split("-");A(q||s);const $=r.top-d-v<f&&!w,nt=r.bottom+d+v+f>window.innerHeight&&!w,F=r.left+c+f>window.innerWidth&&!w,N=r.left+s-c<f&&!w;switch(a){case"top":z($?f:r.top-d-v);break;default:z(nt?"auto":r.top+n+v);break}switch(u){case"left":j(F?"auto":r.left),K(F?f:"auto");break;case"right":j(N?f:r.left+s-c),K(N?"auto":r.left);break;default:j(r.left+s/2-c/2);break}};return t(),window.addEventListener("resize",t),()=>{window.removeEventListener("resize",t)}},[i,v,W,D,p,q,w,O]),o.useEffect(()=>{et(D&&!!g&&!!_&&!!k)},[D,g,_,k]),o.useEffect(()=>()=>{x.current&&clearTimeout(x.current),m.current&&clearTimeout(m.current)},[]),ot?null:ct.createPortal(b.jsx(at,{onClick:l,disableClickOutside:V,children:b.jsx(pt,{ref:Z,open:tt,transitionDuration:T,...Y,css:Q,style:{...J,top:g,left:_,bottom:g==="auto"?f:void 0,right:R,width:I?k:void 0,maxHeight:O},children:b.jsx(yt,{role:"menu",ref:E,disablePadding:U,maxHeight:O,...X,children:o.Children.map(p,(t,s)=>{var r,c,d,a,u,$;if(!o.isValidElement(t))return null;const n=st===s;return b.jsxs(b.Fragment,{children:[o.cloneElement(t,{...t.props,"data-index":s,selected:!!((r=t==null?void 0:t.props)!=null&&r.value)&&((c=t==null?void 0:t.props)==null?void 0:c.value)===H,onClick:rt((d=t==null?void 0:t.props)==null?void 0:d.value,(a=t==null?void 0:t.props)==null?void 0:a.onClick),onKeyDown:it((u=t==null?void 0:t.props)==null?void 0:u.value),tabIndex:n?0:-1,style:{...($=t==null?void 0:t.props)==null?void 0:$.style,[q?"width":"minWidth"]:I?void 0:k,maxWidth:I?void 0:"100%"}}),P&&o.Children.count(p)!==s+1&&b.jsx(bt,{})]})})})})}),document.body)});exports.default=vt;
34
+ `,a=16,wt=s.forwardRef(function({children:y,anchorRef:i,open:h,onClose:f,spacing:b=4,transitionDuration:T=200,onChange:m,value:C,showDivider:U,placement:z="bottom-center",disablePadding:V=!1,disableClickOutside:J=!0,disableAutoPositioning:w=!1,width:q,fitToAnchorWidth:I=!0,maxHeight:O=476,style:Q,inlineCSS:X,menuProps:Y,...Z},A){const[k,K]=s.useState(0),[_,j]=s.useState("auto"),[R,L]=s.useState("auto"),[E,tt]=s.useState(0),[W,P]=s.useState(!1),[et,ot]=s.useState(!1),[st,B]=s.useState(!0),[ut,l]=s.useState(null),x=s.useRef(),g=s.useRef(),S=s.useRef(null),{isKeyboardMode:rt}=dt.default(),$=()=>{i!=null&&i.current&&rt&&i.current.focus()},it=(t,o)=>n=>{n.stopPropagation(),typeof f=="function"&&f(),typeof m=="function"&&m(t,n),typeof o=="function"&&o(n),$()},nt=t=>o=>{var u,c,d,p;o.key==="Tab"&&typeof f=="function"&&(o.preventDefault(),o.stopPropagation(),f(),l(0),$()),(o.key==="Enter"||o.key===" ")&&typeof f=="function"&&typeof m=="function"&&(o.preventDefault(),o.stopPropagation(),f(),m(t,o),$()),o.key==="Escape"&&typeof f=="function"&&(o.preventDefault(),o.stopPropagation(),f(),l(0),$());const n=document.activeElement;if(n){if(o.code==="ArrowDown"){const r=H.default(n,"next",{skipDisabled:!0});r&&r.dataset.index?(l(Number(r.dataset.index)),r.focus()):(l(0),(c=(u=S.current)==null?void 0:u.querySelector('[role="menuitem"]'))==null||c.focus())}if(o.code==="ArrowUp"){const r=H.default(n,"prev",{skipDisabled:!0});r&&r.dataset.index?(l(Number(r.dataset.index)),r.focus()):(l(s.Children.count(y)-1),(p=(d=S.current)==null?void 0:d.querySelector('[role="menuitem"]:last-child'))==null||p.focus())}}};return s.useEffect(()=>{h&&(g.current&&clearTimeout(g.current),document.body.style.overflow="hidden",B(!1),x.current=setTimeout(()=>{P(!0)},100))},[h]),s.useEffect(()=>{h||(x.current&&clearTimeout(x.current),P(!1),document.body.removeAttribute("style"),g.current=setTimeout(()=>{B(!0),l(0)},T))},[h,T]),s.useEffect(()=>{const t=()=>{var G;const{offsetWidth:o=0,offsetHeight:n=0}=(i==null?void 0:i.current)||{},u=((G=i==null?void 0:i.current)==null?void 0:G.getBoundingClientRect())||{top:0,left:0,bottom:0},{offsetWidth:c=0,offsetHeight:d=0}=S.current||{},[p,r]=z.split("-");tt(q||o);const D=u.top-d-b<a&&!w,ct=u.bottom+d+b+a>window.innerHeight&&!w,F=u.left+c+a>window.innerWidth&&!w,N=u.left+o-c<a&&!w;switch(p){case"top":K(D?a:u.top-d-b);break;default:K(ct?"auto":u.top+n+b);break}switch(r){case"left":j(F?"auto":u.left),L(F?a:"auto");break;case"right":j(N?a:u.left+o-c),L(N?"auto":u.left);break;default:j(u.left+o/2-c/2);break}};return t(),window.addEventListener("resize",t),()=>{window.removeEventListener("resize",t)}},[i,b,z,W,y,q,w,O]),s.useEffect(()=>{ot(W&&!!k&&!!_&&!!E)},[W,k,_,E]),s.useEffect(()=>()=>{x.current&&clearTimeout(x.current),g.current&&clearTimeout(g.current)},[]),st?null:ft.createPortal(v.jsx(pt,{onClick:f,disableClickOutside:J,children:v.jsx(yt,{ref:A,open:et,transitionDuration:T,...Z,css:X,style:{...Q,top:k,left:_,bottom:k==="auto"?a:void 0,right:R,width:I?E:void 0,maxHeight:O},children:v.jsx(vt,{role:"menu",ref:S,disablePadding:V,maxHeight:O,...Y,children:s.Children.map(y,(t,o)=>{var u,c,d,p,r,D;if(!s.isValidElement(t))return null;const n=ut===o;return v.jsxs(v.Fragment,{children:[s.cloneElement(t,{...t.props,"data-index":o,selected:!!((u=t==null?void 0:t.props)!=null&&u.value)&&((c=t==null?void 0:t.props)==null?void 0:c.value)===C,onClick:it((d=t==null?void 0:t.props)==null?void 0:d.value,(p=t==null?void 0:t.props)==null?void 0:p.onClick),onKeyDown:nt((r=t==null?void 0:t.props)==null?void 0:r.value),tabIndex:n?0:-1,style:{...(D=t==null?void 0:t.props)==null?void 0:D.style,[q?"width":"minWidth"]:I?void 0:E,maxWidth:I?void 0:"100%"}}),U&&s.Children.count(y)!==o+1&&v.jsx(bt,{})]})})})})}),document.body)});exports.default=wt;
package/Menu/Menu.es.js CHANGED
@@ -1,10 +1,10 @@
1
- import { jsx as T, jsxs as pt, Fragment as lt } from "@emotion/react/jsx-runtime";
2
- import { forwardRef as at, useState as f, useRef as q, useEffect as x, Children as F, isValidElement as yt, cloneElement as mt } from "react";
3
- import { createPortal as bt } from "react-dom";
4
- import vt from "../hooks/useCheckKeyboardMode/useCheckKeyboardMode.es.js";
5
- import _ from "../utils/getSibling/getSibling.es.js";
6
- import I from "@emotion/styled";
7
- const wt = I.div`
1
+ import { jsx as I, jsxs as at, Fragment as lt } from "@emotion/react/jsx-runtime";
2
+ import { forwardRef as yt, useState as d, useRef as F, useEffect as x, Children as N, isValidElement as vt, cloneElement as mt } from "react";
3
+ import { createPortal as wt } from "react-dom";
4
+ import bt from "../hooks/useCheckKeyboardMode/useCheckKeyboardMode.es.js";
5
+ import J from "../utils/getSibling/getSibling.es.js";
6
+ import S from "@emotion/styled";
7
+ const xt = S.div`
8
8
  position: fixed;
9
9
  top: 0;
10
10
  left: 0;
@@ -12,185 +12,184 @@ const wt = I.div`
12
12
  height: 100%;
13
13
  z-index: 100003;
14
14
 
15
- ${({ disableClickOutside: o }) => o ? null : {
15
+ ${({ disableClickOutside: e }) => e ? null : {
16
16
  pointerEvents: "none",
17
17
  "& *": {
18
18
  pointerEvents: "auto"
19
19
  }
20
20
  }}}
21
21
 
22
- `, xt = I.div`
22
+ `, gt = S.div`
23
23
  position: fixed;
24
- max-width: calc(100% - ${({ theme: { spacing: o } }) => o.layout(4)}px);
24
+ max-width: calc(100% - ${({ theme: { spacing: e } }) => e.layout(4)}px);
25
25
  overflow-y: auto;
26
26
  border-radius: 10px;
27
27
  background-color: ${({
28
28
  theme: {
29
- palette: { grey: o }
29
+ palette: { grey: e }
30
30
  }
31
- }) => o.white};
32
- box-shadow: ${({ theme: { elevation: o } }) => o[4]};
31
+ }) => e.white};
32
+ box-shadow: ${({ theme: { elevation: e } }) => e[4]};
33
33
  transition:
34
- transform ${({ transitionDuration: o }) => o}ms,
35
- opacity ${({ transitionDuration: o = 0 }) => o / 2}ms;
36
- transform: scale(${({ open: o }) => o ? 1 : 0.97});
37
- opacity: ${({ open: o }) => o ? 1 : 0};
34
+ transform ${({ transitionDuration: e }) => e}ms,
35
+ opacity ${({ transitionDuration: e = 0 }) => e / 2}ms;
36
+ transform: scale(${({ open: e }) => e ? 1 : 0.97});
37
+ opacity: ${({ open: e }) => e ? 1 : 0};
38
38
  z-index: 100003;
39
- `, ht = I.ul`
39
+ `, ht = S.ul`
40
40
  display: flex;
41
41
  flex-direction: column;
42
- max-height: ${({ maxHeight: o }) => o}px;
42
+ max-height: ${({ maxHeight: e }) => e}px;
43
43
 
44
- ${({ theme: { spacing: o }, disablePadding: a }) => a ? null : {
45
- padding: `${o.content(1)}px 0`
44
+ ${({ theme: { spacing: e }, disablePadding: y }) => y ? null : {
45
+ padding: `${e.content(1)}px 0`
46
46
  }}}
47
- `, kt = I.div`
47
+ `, kt = S.div`
48
48
  width: 100%;
49
49
  height: 1px;
50
50
  background-color: ${({
51
51
  theme: {
52
- palette: { grey: o }
52
+ palette: { grey: e }
53
53
  }
54
- }) => o[20]};
55
- `, d = 16, Mt = at(function({
56
- children: a,
54
+ }) => e[20]};
55
+ `, p = 16, Mt = yt(function({
56
+ children: y,
57
57
  anchorRef: s,
58
- open: h,
59
- onClose: p,
60
- spacing: m = 4,
58
+ open: g,
59
+ onClose: c,
60
+ spacing: v = 4,
61
61
  transitionDuration: M = 200,
62
- onChange: k,
63
- value: J,
64
- showDivider: P,
65
- placement: N = "bottom-center",
66
- disablePadding: Q = !1,
67
- disableClickOutside: X = !0,
68
- disableAutoPositioning: b = !1,
62
+ onChange: h,
63
+ value: Q,
64
+ showDivider: X,
65
+ placement: P = "bottom-center",
66
+ disablePadding: Y = !1,
67
+ disableClickOutside: Z = !0,
68
+ disableAutoPositioning: m = !1,
69
69
  width: O,
70
70
  fitToAnchorWidth: W = !0,
71
- maxHeight: D = 476,
72
- style: Y,
73
- inlineCSS: Z,
74
- menuProps: A,
75
- ...R
76
- }, tt) {
77
- const [g, j] = f(0), [z, K] = f("auto"), [ot, B] = f("auto"), [E, et] = f(0), [L, G] = f(!1), [rt, it] = f(!1), [st, H] = f(!0), [ut, y] = f(null), v = q(), w = q(), $ = q(null), { isKeyboardMode: nt } = vt(), ct = (t, e) => (u) => {
78
- u.stopPropagation(), typeof p == "function" && p(), typeof k == "function" && k(t, u), typeof e == "function" && e(u);
79
- }, ft = (t) => (e) => {
80
- var i, n, c, l;
81
- if (e.key === "Tab" && typeof p == "function" && (p(), y(0)), (e.key === "Enter" || e.key === " ") && typeof p == "function" && typeof k == "function" && (p(), k(t, e), s != null && s.current)) {
82
- const r = s.current.querySelector("button");
83
- r && nt && r.focus();
84
- }
71
+ maxHeight: z = 476,
72
+ style: A,
73
+ inlineCSS: C,
74
+ menuProps: R,
75
+ ...tt
76
+ }, ot) {
77
+ const [k, j] = d(0), [K, L] = d("auto"), [et, q] = d("auto"), [E, rt] = d(0), [B, G] = d(!1), [it, st] = d(!1), [ut, H] = d(!0), [nt, a] = d(null), w = F(), b = F(), $ = F(null), { isKeyboardMode: ct } = bt(), T = () => {
78
+ s != null && s.current && ct && s.current.focus();
79
+ }, ft = (t, o) => (u) => {
80
+ u.stopPropagation(), typeof c == "function" && c(), typeof h == "function" && h(t, u), typeof o == "function" && o(u), T();
81
+ }, dt = (t) => (o) => {
82
+ var r, n, f, l;
83
+ o.key === "Tab" && typeof c == "function" && (o.preventDefault(), o.stopPropagation(), c(), a(0), T()), (o.key === "Enter" || o.key === " ") && typeof c == "function" && typeof h == "function" && (o.preventDefault(), o.stopPropagation(), c(), h(t, o), T()), o.key === "Escape" && typeof c == "function" && (o.preventDefault(), o.stopPropagation(), c(), a(0), T());
85
84
  const u = document.activeElement;
86
85
  if (u) {
87
- if (e.code === "ArrowDown") {
88
- const r = _(u, "next", { skipDisabled: !0 });
89
- r && r.dataset.index ? (y(Number(r.dataset.index)), r.focus()) : (y(0), (n = (i = $.current) == null ? void 0 : i.querySelector('[role="menuitem"]')) == null || n.focus());
86
+ if (o.code === "ArrowDown") {
87
+ const i = J(u, "next", { skipDisabled: !0 });
88
+ i && i.dataset.index ? (a(Number(i.dataset.index)), i.focus()) : (a(0), (n = (r = $.current) == null ? void 0 : r.querySelector('[role="menuitem"]')) == null || n.focus());
90
89
  }
91
- if (e.code === "ArrowUp") {
92
- const r = _(u, "prev", { skipDisabled: !0 });
93
- r && r.dataset.index ? (y(Number(r.dataset.index)), r.focus()) : (y(F.count(a) - 1), (l = (c = $.current) == null ? void 0 : c.querySelector('[role="menuitem"]:last-child')) == null || l.focus());
90
+ if (o.code === "ArrowUp") {
91
+ const i = J(u, "prev", { skipDisabled: !0 });
92
+ i && i.dataset.index ? (a(Number(i.dataset.index)), i.focus()) : (a(N.count(y) - 1), (l = (f = $.current) == null ? void 0 : f.querySelector('[role="menuitem"]:last-child')) == null || l.focus());
94
93
  }
95
94
  }
96
95
  };
97
96
  return x(() => {
98
- h && (w.current && clearTimeout(w.current), document.body.style.overflow = "hidden", H(!1), v.current = setTimeout(() => {
97
+ g && (b.current && clearTimeout(b.current), document.body.style.overflow = "hidden", H(!1), w.current = setTimeout(() => {
99
98
  G(!0);
100
99
  }, 100));
101
- }, [h]), x(() => {
102
- h || (v.current && clearTimeout(v.current), G(!1), document.body.removeAttribute("style"), w.current = setTimeout(() => {
103
- H(!0), y(0);
100
+ }, [g]), x(() => {
101
+ g || (w.current && clearTimeout(w.current), G(!1), document.body.removeAttribute("style"), b.current = setTimeout(() => {
102
+ H(!0), a(0);
104
103
  }, M));
105
- }, [h, M]), x(() => {
104
+ }, [g, M]), x(() => {
106
105
  const t = () => {
107
- var V;
108
- const { offsetWidth: e = 0, offsetHeight: u = 0 } = (s == null ? void 0 : s.current) || {}, i = ((V = s == null ? void 0 : s.current) == null ? void 0 : V.getBoundingClientRect()) || {
106
+ var _;
107
+ const { offsetWidth: o = 0, offsetHeight: u = 0 } = (s == null ? void 0 : s.current) || {}, r = ((_ = s == null ? void 0 : s.current) == null ? void 0 : _.getBoundingClientRect()) || {
109
108
  top: 0,
110
109
  left: 0,
111
110
  bottom: 0
112
- }, { offsetWidth: n = 0, offsetHeight: c = 0 } = $.current || {}, [l, r] = N.split("-");
113
- et(O || e);
114
- const S = i.top - c - m < d && !b, dt = i.bottom + c + m + d > window.innerHeight && !b, C = i.left + n + d > window.innerWidth && !b, U = i.left + e - n < d && !b;
111
+ }, { offsetWidth: n = 0, offsetHeight: f = 0 } = $.current || {}, [l, i] = P.split("-");
112
+ rt(O || o);
113
+ const D = r.top - f - v < p && !m, pt = r.bottom + f + v + p > window.innerHeight && !m, U = r.left + n + p > window.innerWidth && !m, V = r.left + o - n < p && !m;
115
114
  switch (l) {
116
115
  case "top":
117
116
  j(
118
- S ? d : i.top - c - m
117
+ D ? p : r.top - f - v
119
118
  );
120
119
  break;
121
120
  default:
122
- j(dt ? "auto" : i.top + u + m);
121
+ j(pt ? "auto" : r.top + u + v);
123
122
  break;
124
123
  }
125
- switch (r) {
124
+ switch (i) {
126
125
  case "left":
127
- K(C ? "auto" : i.left), B(C ? d : "auto");
126
+ L(U ? "auto" : r.left), q(U ? p : "auto");
128
127
  break;
129
128
  case "right":
130
- K(
131
- U ? d : i.left + e - n
132
- ), B(U ? "auto" : i.left);
129
+ L(
130
+ V ? p : r.left + o - n
131
+ ), q(V ? "auto" : r.left);
133
132
  break;
134
133
  default:
135
- K(i.left + e / 2 - n / 2);
134
+ L(r.left + o / 2 - n / 2);
136
135
  break;
137
136
  }
138
137
  };
139
138
  return t(), window.addEventListener("resize", t), () => {
140
139
  window.removeEventListener("resize", t);
141
140
  };
142
- }, [s, m, N, L, a, O, b, D]), x(() => {
143
- it(L && !!g && !!z && !!E);
144
- }, [L, g, z, E]), x(() => () => {
145
- v.current && clearTimeout(v.current), w.current && clearTimeout(w.current);
146
- }, []), st ? null : bt(
147
- /* @__PURE__ */ T(wt, { onClick: p, disableClickOutside: X, children: /* @__PURE__ */ T(
148
- xt,
141
+ }, [s, v, P, B, y, O, m, z]), x(() => {
142
+ st(B && !!k && !!K && !!E);
143
+ }, [B, k, K, E]), x(() => () => {
144
+ w.current && clearTimeout(w.current), b.current && clearTimeout(b.current);
145
+ }, []), ut ? null : wt(
146
+ /* @__PURE__ */ I(xt, { onClick: c, disableClickOutside: Z, children: /* @__PURE__ */ I(
147
+ gt,
149
148
  {
150
- ref: tt,
151
- open: rt,
149
+ ref: ot,
150
+ open: it,
152
151
  transitionDuration: M,
153
- ...R,
154
- css: Z,
152
+ ...tt,
153
+ css: C,
155
154
  style: {
156
- ...Y,
157
- top: g,
158
- left: z,
159
- bottom: g === "auto" ? d : void 0,
160
- right: ot,
155
+ ...A,
156
+ top: k,
157
+ left: K,
158
+ bottom: k === "auto" ? p : void 0,
159
+ right: et,
161
160
  width: W ? E : void 0,
162
- maxHeight: D
161
+ maxHeight: z
163
162
  },
164
- children: /* @__PURE__ */ T(
163
+ children: /* @__PURE__ */ I(
165
164
  ht,
166
165
  {
167
166
  role: "menu",
168
167
  ref: $,
169
- disablePadding: Q,
170
- maxHeight: D,
171
- ...A,
172
- children: F.map(a, (t, e) => {
173
- var i, n, c, l, r, S;
174
- if (!yt(t))
168
+ disablePadding: Y,
169
+ maxHeight: z,
170
+ ...R,
171
+ children: N.map(y, (t, o) => {
172
+ var r, n, f, l, i, D;
173
+ if (!vt(t))
175
174
  return null;
176
- const u = ut === e;
177
- return /* @__PURE__ */ pt(lt, { children: [
175
+ const u = nt === o;
176
+ return /* @__PURE__ */ at(lt, { children: [
178
177
  mt(t, {
179
178
  ...t.props,
180
179
  // eslint-disable-next-line @typescript-eslint/ban-ts-comment
181
180
  // @ts-expect-error
182
- "data-index": e,
183
- selected: !!((i = t == null ? void 0 : t.props) != null && i.value) && ((n = t == null ? void 0 : t.props) == null ? void 0 : n.value) === J,
184
- onClick: ct((c = t == null ? void 0 : t.props) == null ? void 0 : c.value, (l = t == null ? void 0 : t.props) == null ? void 0 : l.onClick),
185
- onKeyDown: ft((r = t == null ? void 0 : t.props) == null ? void 0 : r.value),
181
+ "data-index": o,
182
+ selected: !!((r = t == null ? void 0 : t.props) != null && r.value) && ((n = t == null ? void 0 : t.props) == null ? void 0 : n.value) === Q,
183
+ onClick: ft((f = t == null ? void 0 : t.props) == null ? void 0 : f.value, (l = t == null ? void 0 : t.props) == null ? void 0 : l.onClick),
184
+ onKeyDown: dt((i = t == null ? void 0 : t.props) == null ? void 0 : i.value),
186
185
  tabIndex: u ? 0 : -1,
187
186
  style: {
188
- ...(S = t == null ? void 0 : t.props) == null ? void 0 : S.style,
187
+ ...(D = t == null ? void 0 : t.props) == null ? void 0 : D.style,
189
188
  [O ? "width" : "minWidth"]: W ? void 0 : E,
190
189
  maxWidth: W ? void 0 : "100%"
191
190
  }
192
191
  }),
193
- P && F.count(a) !== e + 1 && /* @__PURE__ */ T(kt, {})
192
+ X && N.count(y) !== o + 1 && /* @__PURE__ */ I(kt, {})
194
193
  ] });
195
194
  })
196
195
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@dotss/ui",
3
- "version": "1.1.2",
3
+ "version": "1.1.3",
4
4
  "description": "React UI components for Dotss",
5
5
  "type": "module",
6
6
  "main": "./index.cjs",