react-material-design 0.5.1 → 0.5.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/dist/components/Button/group/index.cjs +1 -1
- package/dist/components/Button/group/index.d.ts +2 -1
- package/dist/components/Button/group/index.js +19 -1
- package/dist/components/Button/group/render.cjs +1 -1
- package/dist/components/Button/group/render.d.ts +3 -1
- package/dist/components/Button/group/render.js +21 -24
- package/dist/components/Dialog/Dialog.cjs +1 -1
- package/dist/components/Dialog/Dialog.js +100 -101
- package/dist/components/Menubar/index.d.ts +3 -2
- package/dist/components/Menubar/render.cjs +1 -1
- package/dist/components/Menubar/render.d.ts +5 -1
- package/dist/components/Menubar/render.js +89 -42
- package/dist/components/Menubar/style.css +1 -1
- package/dist/layouts/Content.cjs +1 -1
- package/dist/layouts/Content.d.ts +8 -2
- package/dist/layouts/Content.js +18 -7
- package/dist/layouts/Page/index.cjs +1 -1
- package/dist/layouts/Page/index.js +77 -78
- package/dist/layouts/Page/style.css +1 -1
- package/dist/layouts/Panes/style.css +1 -1
- package/dist/layouts/Toolbox/index.cjs +1 -1
- package/dist/layouts/Toolbox/index.js +101 -82
- package/dist/layouts/Toolbox/style.css +1 -1
- package/package.json +2 -2
|
@@ -1 +1 @@
|
|
|
1
|
-
Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require("./render.cjs");
|
|
1
|
+
Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require("../../misc/OrderedCollection/index.cjs"),t=require("./render.cjs");let n=require("react/compiler-runtime"),r=require("react/jsx-runtime");function i(i){let a=(0,n.c)(4);if(e.useOrderedCollection()){let t;return a[0]===i?t=a[1]:(t=(0,r.jsx)(e.OrderedCollectionChild,{name:`ButtonGroup`,content:i}),a[0]=i,a[1]=t),t}let o;return a[2]===i?o=a[3]:(o=(0,r.jsx)(t.default,{...i}),a[2]=i,a[3]=o),o}exports.default=i;
|
|
@@ -1,2 +1,3 @@
|
|
|
1
|
-
|
|
1
|
+
import { ButtonGroupProps } from './render';
|
|
2
2
|
export type { ButtonGroupProps, ConnectedButtonGroupProps, StandardButtonGroupProps } from './render';
|
|
3
|
+
export default function ButtonGroup(props: ButtonGroupProps): import('react').JSX.Element;
|
|
@@ -1 +1,19 @@
|
|
|
1
|
-
|
|
1
|
+
import { OrderedCollectionChild as e, useOrderedCollection as t } from "../../misc/OrderedCollection/index.js";
|
|
2
|
+
import n from "./render.js";
|
|
3
|
+
import { c as r } from "react/compiler-runtime";
|
|
4
|
+
import { jsx as i } from "react/jsx-runtime";
|
|
5
|
+
//#region lib/components/Button/group/index.tsx
|
|
6
|
+
function a(a) {
|
|
7
|
+
let o = r(4);
|
|
8
|
+
if (t()) {
|
|
9
|
+
let t;
|
|
10
|
+
return o[0] === a ? t = o[1] : (t = /* @__PURE__ */ i(e, {
|
|
11
|
+
name: "ButtonGroup",
|
|
12
|
+
content: a
|
|
13
|
+
}), o[0] = a, o[1] = t), t;
|
|
14
|
+
}
|
|
15
|
+
let s;
|
|
16
|
+
return o[2] === a ? s = o[3] : (s = /* @__PURE__ */ i(n, { ...a }), o[2] = a, o[3] = s), s;
|
|
17
|
+
}
|
|
18
|
+
//#endregion
|
|
19
|
+
export { a as default };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
require('./style.css');const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../utils/index.cjs"),n=require("../../misc/OrderedCollection/index.cjs"),r=require("../../misc/Transitionable/index.cjs"),i=require("../../types.cjs"),a=require("../icon/render.cjs");;/* empty css */const o=require("../default/render.cjs");let s=require("classnames");s=e.__toESM(s,1);let c=require("react"),l=require("react/jsx-runtime");var u=[`type`,`align`,`size`,`shape`,`selectable`,`selected`,`onSelected`,`required`,`requiredMessage`,`children`];function d(e){let t={...e};return u.forEach(e=>delete t[e]),t}
|
|
1
|
+
require('./style.css');const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../utils/index.cjs"),n=require("../../misc/OrderedCollection/index.cjs"),r=require("../../misc/Transitionable/index.cjs"),i=require("../../types.cjs"),a=require("../icon/render.cjs");;/* empty css */const o=require("../default/render.cjs");let s=require("classnames");s=e.__toESM(s,1);let c=require("react"),l=require("react/jsx-runtime");var u=[`type`,`align`,`size`,`shape`,`selectable`,`selected`,`onSelected`,`required`,`requiredMessage`,`children`];function d(e){let t={...e};return u.forEach(e=>delete t[e]),t}var f=(0,c.createContext)(null),p=()=>(0,c.useContext)(f);function m(e){let{onSelected:u}=e,p=(0,c.useId)(),[m,h]=(0,c.useState)([]),[g,_]=(0,c.useState)(),[v,y]=(0,c.useState)([]),b=(0,c.useMemo)(()=>[`Button`,`IconButton`],[]),x={},S=(0,c.useMemo)(()=>({size:e.size,selectable:!!e.selectable,required:!!(e.selectable&&e.required),get selected(){return m.reduce((e,t)=>e.set(t.id,v.includes(t.id)),new Map)},onSelected:(t,n)=>{let r;e.selectable&&(_(void 0),e.selectable===`single`?(r=n?[t]:[],u?.(n?t:void 0)):(r=[...v],n?r.push(t):r=r.filter(e=>e!==t),u?.(r)),y(r))},onPressed:(t,n,r)=>{let i,a=null,o=null;e.type!==`connected`&&(n?.previousElementSibling instanceof HTMLElement&&(a=n.previousElementSibling),n?.nextElementSibling instanceof HTMLElement&&(o=n.nextElementSibling),r?(i=n.getBoundingClientRect().width/100*15,!a&&o?(n.style.setProperty(`--button-width-extra`,`${i/2}px`),o.style.setProperty(`--button-width-extra`,`-${i/2}px`)):a&&o?(a.style.setProperty(`--button-width-extra`,`-${i/2}px`),n.style.setProperty(`--button-width-extra`,`${i}px`),o.style.setProperty(`--button-width-extra`,`-${i/2}px`)):a&&!o&&(a.style.setProperty(`--button-width-extra`,`-${i/2}px`),n.style.setProperty(`--button-width-extra`,`${i/2}px`))):(a?.style.removeProperty(`--button-width-extra`),n.style.removeProperty(`--button-width-extra`),o?.style.removeProperty(`--button-width-extra`)))}}),[m,u,e.required,e.selectable,e.size,e.type,v]);return(0,c.useEffect)(()=>{e.selectable&&(e.selectable===`single`?y(e.selected?[e.selected]:[]):y(e.selected??[]))},[e.selectable,e.selected]),x.ButtonGroup=!0,x[e.type??`standard`]=!0,e.type!==`connected`&&(x[`align-`+(e.align??`left`)]=!0),x[e.shape??`round`]=!0,x[i.getComponentSizeName(e.size)]=!0,e.selectable&&(x.selectable=!0,x[e.selectable]=!0),(0,l.jsxs)(`div`,{...d(e),className:(0,s.default)(x,e.className),children:[(0,l.jsx)(`div`,{className:`container`,children:(0,l.jsxs)(f,{value:S,children:[m.map(e=>{switch(e.orderedCollectionName){case`Button`:return(0,l.jsx)(o.default,{...e},e.id);case`IconButton`:return(0,l.jsx)(a.default,{...e},e.id)}}),(0,l.jsx)(n.default,{childName:b,onChildrenChange:h,compareChild:t.shallowEqual,children:e.children})]})}),e.selectable&&e.required&&(0,l.jsx)(r.default,{value:g,className:`error`}),(0,l.jsx)(`div`,{style:(0,c.useMemo)(()=>({display:`none`}),[]),children:e.selectable&&e.required&&m.map((t,n)=>(0,l.jsx)(`input`,{type:`radio`,name:`group_${p}`,required:!n&&!v.length,defaultChecked:v.includes(t.id),onInvalid:t=>{_((e.selectable?e.requiredMessage:void 0)??t.currentTarget.validationMessage),t.preventDefault()}},t.id))})]})}exports.ButtonGroupContext=f,exports.default=m,exports.useButtonGroupContext=p;
|
|
@@ -1,10 +1,12 @@
|
|
|
1
1
|
import { default as React } from 'react';
|
|
2
2
|
import { CommonButtonProps } from '../types';
|
|
3
3
|
interface BaseButtonGroupProps extends Pick<CommonButtonProps, "size" | "shape">, Omit<React.ButtonHTMLAttributes<HTMLElement>, "type"> {
|
|
4
|
+
position?: "top" | "bottom";
|
|
4
5
|
selectable?: false;
|
|
5
6
|
children?: React.ReactNode;
|
|
6
7
|
}
|
|
7
8
|
export interface BaseButtonGroupSelectable {
|
|
9
|
+
position?: "top" | "bottom";
|
|
8
10
|
required?: boolean;
|
|
9
11
|
requiredMessage?: string;
|
|
10
12
|
}
|
|
@@ -45,5 +47,5 @@ export interface ButtonGroupContext {
|
|
|
45
47
|
}
|
|
46
48
|
export declare const ButtonGroupContext: React.Context<ButtonGroupContext | null>;
|
|
47
49
|
export declare const useButtonGroupContext: () => ButtonGroupContext | null;
|
|
48
|
-
export default function
|
|
50
|
+
export default function ButtonGroupRender(props: ButtonGroupProps): React.JSX.Element;
|
|
49
51
|
export {};
|
|
@@ -25,71 +25,68 @@ function g(e) {
|
|
|
25
25
|
let t = { ...e };
|
|
26
26
|
return h.forEach((e) => delete t[e]), t;
|
|
27
27
|
}
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
}
|
|
31
|
-
var v = s(null), y = () => c(v);
|
|
32
|
-
function b(s) {
|
|
33
|
-
let { onSelected: c } = s, h = u(), [y, b] = f([]), [x, S] = f(), [C, w] = f([]), T = d(() => ["Button", "IconButton"], []), E = {}, D = d(() => ({
|
|
28
|
+
var _ = s(null), v = () => c(_);
|
|
29
|
+
function y(s) {
|
|
30
|
+
let { onSelected: c } = s, h = u(), [v, y] = f([]), [b, x] = f(), [S, C] = f([]), w = d(() => ["Button", "IconButton"], []), T = {}, E = d(() => ({
|
|
34
31
|
size: s.size,
|
|
35
32
|
selectable: !!s.selectable,
|
|
36
33
|
required: !!(s.selectable && s.required),
|
|
37
34
|
get selected() {
|
|
38
|
-
return
|
|
35
|
+
return v.reduce((e, t) => e.set(t.id, S.includes(t.id)), /* @__PURE__ */ new Map());
|
|
39
36
|
},
|
|
40
37
|
onSelected: (e, t) => {
|
|
41
38
|
let n;
|
|
42
|
-
s.selectable && (
|
|
39
|
+
s.selectable && (x(void 0), s.selectable === "single" ? (n = t ? [e] : [], c?.(t ? e : void 0)) : (n = [...S], t ? n.push(e) : n = n.filter((t) => t !== e), c?.(n)), C(n));
|
|
43
40
|
},
|
|
44
41
|
onPressed: (e, t, n) => {
|
|
45
42
|
let r, i = null, a = null;
|
|
46
43
|
s.type !== "connected" && (t?.previousElementSibling instanceof HTMLElement && (i = t.previousElementSibling), t?.nextElementSibling instanceof HTMLElement && (a = t.nextElementSibling), n ? (r = t.getBoundingClientRect().width / 100 * 15, !i && a ? (t.style.setProperty("--button-width-extra", `${r / 2}px`), a.style.setProperty("--button-width-extra", `-${r / 2}px`)) : i && a ? (i.style.setProperty("--button-width-extra", `-${r / 2}px`), t.style.setProperty("--button-width-extra", `${r}px`), a.style.setProperty("--button-width-extra", `-${r / 2}px`)) : i && !a && (i.style.setProperty("--button-width-extra", `-${r / 2}px`), t.style.setProperty("--button-width-extra", `${r / 2}px`))) : (i?.style.removeProperty("--button-width-extra"), t.style.removeProperty("--button-width-extra"), a?.style.removeProperty("--button-width-extra")));
|
|
47
44
|
}
|
|
48
45
|
}), [
|
|
49
|
-
|
|
46
|
+
v,
|
|
50
47
|
c,
|
|
51
48
|
s.required,
|
|
52
49
|
s.selectable,
|
|
53
50
|
s.size,
|
|
54
51
|
s.type,
|
|
55
|
-
|
|
52
|
+
S
|
|
56
53
|
]);
|
|
57
54
|
return l(() => {
|
|
58
|
-
s.selectable && (s.selectable === "single" ?
|
|
59
|
-
}, [s.selectable, s.selected]),
|
|
55
|
+
s.selectable && (s.selectable === "single" ? C(s.selected ? [s.selected] : []) : C(s.selected ?? []));
|
|
56
|
+
}, [s.selectable, s.selected]), T.ButtonGroup = !0, T[s.type ?? "standard"] = !0, s.type !== "connected" && (T["align-" + (s.align ?? "left")] = !0), T[s.shape ?? "round"] = !0, T[r(s.size)] = !0, s.selectable && (T.selectable = !0, T[s.selectable] = !0), /* @__PURE__ */ m("div", {
|
|
60
57
|
...g(s),
|
|
61
|
-
className: o(
|
|
58
|
+
className: o(T, s.className),
|
|
62
59
|
children: [
|
|
63
60
|
/* @__PURE__ */ p("div", {
|
|
64
61
|
className: "container",
|
|
65
|
-
children: /* @__PURE__ */ m(
|
|
66
|
-
value:
|
|
67
|
-
children: [
|
|
62
|
+
children: /* @__PURE__ */ m(_, {
|
|
63
|
+
value: E,
|
|
64
|
+
children: [v.map((e) => {
|
|
68
65
|
switch (e.orderedCollectionName) {
|
|
69
66
|
case "Button": return /* @__PURE__ */ p(a, { ...e }, e.id);
|
|
70
67
|
case "IconButton": return /* @__PURE__ */ p(i, { ...e }, e.id);
|
|
71
68
|
}
|
|
72
69
|
}), /* @__PURE__ */ p(t, {
|
|
73
|
-
childName:
|
|
74
|
-
onChildrenChange:
|
|
70
|
+
childName: w,
|
|
71
|
+
onChildrenChange: y,
|
|
75
72
|
compareChild: e,
|
|
76
73
|
children: s.children
|
|
77
74
|
})]
|
|
78
75
|
})
|
|
79
76
|
}),
|
|
80
77
|
s.selectable && s.required && /* @__PURE__ */ p(n, {
|
|
81
|
-
value:
|
|
78
|
+
value: b,
|
|
82
79
|
className: "error"
|
|
83
80
|
}),
|
|
84
81
|
/* @__PURE__ */ p("div", {
|
|
85
82
|
style: d(() => ({ display: "none" }), []),
|
|
86
|
-
children: s.selectable && s.required &&
|
|
83
|
+
children: s.selectable && s.required && v.map((e, t) => /* @__PURE__ */ p("input", {
|
|
87
84
|
type: "radio",
|
|
88
85
|
name: `group_${h}`,
|
|
89
|
-
required: !t && !
|
|
90
|
-
defaultChecked:
|
|
86
|
+
required: !t && !S.length,
|
|
87
|
+
defaultChecked: S.includes(e.id),
|
|
91
88
|
onInvalid: (e) => {
|
|
92
|
-
|
|
89
|
+
x((s.selectable ? s.requiredMessage : void 0) ?? e.currentTarget.validationMessage), e.preventDefault();
|
|
93
90
|
}
|
|
94
91
|
}, e.id))
|
|
95
92
|
})
|
|
@@ -97,4 +94,4 @@ function b(s) {
|
|
|
97
94
|
});
|
|
98
95
|
}
|
|
99
96
|
//#endregion
|
|
100
|
-
export {
|
|
97
|
+
export { _ as ButtonGroupContext, y as default, v as useButtonGroupContext };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
require('./style.css');const e=require("../../_virtual/_rolldown/runtime.cjs"),t=require("../Theme/Theme.cjs"),ee=require("../Button/context.cjs"),n=require("../Icon/Icon.cjs"),r=require("../../utils/index.cjs"),
|
|
1
|
+
require('./style.css');const e=require("../../_virtual/_rolldown/runtime.cjs"),t=require("../Theme/Theme.cjs"),ee=require("../Button/context.cjs"),n=require("../Icon/Icon.cjs"),r=require("../../utils/index.cjs"),te=require("../misc/OrderedCollection/index.cjs"),i=require("../Divider/index.cjs"),ne=require("../types.cjs"),re=require("../Button/default/index.cjs"),ie=require("../Button/icon/index.cjs");;/* empty css */let a=require("react/compiler-runtime"),o=require("classnames");o=e.__toESM(o,1);let s=require("react");s=e.__toESM(s,1);let c=require("react/jsx-runtime"),l=require("react-dom"),u=require("react-dom-event-hooks");function d(e){let d=(0,a.c)(74),f=(0,s.useId)(),{setDialogState:p,dialogsContainer:m}=t.useTheme(`Dialog`),h=(0,s.useRef)(null),g=(0,s.useRef)(null),_;d[0]===Symbol.for(`react.memo_cache_sentinel`)?(_=[],d[0]=_):_=d[0];let[v,ue]=(0,s.useState)(_),y;d[1]===v?y=d[2]:(y=v.filter(le).at(0),d[1]=v,d[2]=y);let b=y,x;d[3]===v?x=d[4]:(x=v.filter(ce),d[3]=v,d[4]=x);let S=x,C;d[5]===Symbol.for(`react.memo_cache_sentinel`)?(C=[`Content`,`DialogAction`],d[5]=C):C=d[5];let de=C,w;d[6]===Symbol.for(`react.memo_cache_sentinel`)?(w={default:`text`,icon:`standard`},d[6]=w):w=d[6];let T=w,E;d[7]!==e.fullscreen||d[8]!==e.icon?(E=e.fullscreen?null:n.convertIconDefinition(e.icon),d[7]=e.fullscreen,d[8]=e.icon,d[9]=E):E=d[9];let D=E,O;d[10]===Symbol.for(`react.memo_cache_sentinel`)?(O=e=>{e.filter(e=>e.borderBoxSize.forEach(e=>{g.current?.checkVisibility()&&(g.current.style.setProperty(`--modal-width`,`${e.inlineSize}px`),g.current.style.setProperty(`--modal-height`,`${e.blockSize}px`))}))},d[10]=O):O=d[10];let{saveRef:k}=(0,u.useResizeObserver)(O),{saveRef:A}=(0,u.useElementEventListener)(`scroll`,se),j;d[11]!==f||d[12]!==p?(j=()=>{p(f,!0),h.current?.classList.remove(`close`),h.current?.classList.add(`open`),h.current?.showModal()},d[11]=f,d[12]=p,d[13]=j):j=d[13];let M=(0,s.useEffectEvent)(j),N;d[14]!==f||d[15]!==p?(N=async()=>{p(f,!1),h.current?.classList.remove(`open`),h.current?.classList.add(`close`),await r.waitAnimationNameEndEvent(g.current,oe),h.current?.classList.remove(`close`),h.current?.close()},d[14]=f,d[15]=p,d[16]=N):N=d[16];let P=(0,s.useEffectEvent)(N),F;d[17]===e?F=d[18]:(F=t=>{t.stopPropagation(),e.onClose?.()},d[17]=e,d[18]=F);let I=F,L;d[19]===e?L=d[20]:(L=t=>{t.code.toLowerCase().includes(`escape`)&&(t.stopPropagation(),t.preventDefault(),e.onClose?.())},d[19]=e,d[20]=L);let R=L,z;d[21]!==P||d[22]!==M||d[23]!==e.open?(z=()=>{e.open?M():P()},d[21]=P,d[22]=M,d[23]=e.open,d[24]=z):z=d[24];let B;if(d[25]===e.open?B=d[26]:(B=[e.open],d[25]=e.open,d[26]=B),(0,s.useEffect)(z,B),!m)return null;let V=e.headline,H=e.fullscreen?`dialog`:`alertdialog`,U;d[27]!==e.fullscreen||d[28]!==e.headline||d[29]!==e.icon||d[30]!==e.size?(U=(0,o.default)(`modal`,!e.fullscreen&&e.size?ne.getComponentSizeName(e.size):void 0,{fullscreen:e.fullscreen,headline:e.headline,icon:!e.fullscreen&&e.icon}),d[27]=e.fullscreen,d[28]=e.headline,d[29]=e.icon,d[30]=e.size,d[31]=U):U=d[31];let W;d[32]!==D||d[33]!==e.buttonLabel||d[34]!==e.fullscreen||d[35]!==e.headline||d[36]!==e.onButtonClick||d[37]!==e.onClose||d[38]!==e.supportingText?(W=e.fullscreen?(0,c.jsxs)(`div`,{className:`header`,children:[(0,c.jsx)(ie.default,{className:`icon`,color:`standard`,icon:`close`,onClick:e.onClose}),(0,c.jsx)(`span`,{className:`headline`,children:e.headline}),(0,c.jsx)(re.default,{className:`action`,color:`text`,label:e.buttonLabel,onClick:e.onButtonClick})]}):(0,c.jsxs)(`div`,{className:`description`,children:[D&&(0,c.jsx)(n.IconProvider,{size:24,children:D}),e.headline&&(0,c.jsx)(`span`,{className:`headline`,children:e.headline}),(0,c.jsx)(`span`,{className:`supporting-text`,children:e.supportingText})]}),d[32]=D,d[33]=e.buttonLabel,d[34]=e.fullscreen,d[35]=e.headline,d[36]=e.onButtonClick,d[37]=e.onClose,d[38]=e.supportingText,d[39]=W):W=d[39];let G;d[40]!==b||d[41]!==e.fullscreen?(G=!e.fullscreen&&b&&(0,c.jsx)(i.default,{}),d[40]=b,d[41]=e.fullscreen,d[42]=G):G=d[42];let K;d[43]!==b||d[44]!==A?(K=!!b&&(0,c.jsx)(`div`,{ref:A,className:(0,o.default)(`content`,b.className),style:b.style,...b.dataset,children:b.children}),d[43]=b,d[44]=A,d[45]=K):K=d[45];let q;d[46]!==b||d[47]!==e.fullscreen?(q=!e.fullscreen&&b&&(0,c.jsx)(i.default,{}),d[46]=b,d[47]=e.fullscreen,d[48]=q):q=d[48];let J;d[49]!==S||d[50]!==e.fullscreen?(J=!e.fullscreen&&S&&(0,c.jsx)(`div`,{className:`actions`,children:(0,c.jsx)(ee.default,{color:T,children:S.map(ae)})}),d[49]=S,d[50]=e.fullscreen,d[51]=J):J=d[51];let Y;d[52]!==k||d[53]!==W||d[54]!==G||d[55]!==K||d[56]!==q||d[57]!==J?(Y=(0,c.jsxs)(`div`,{ref:k,className:`container`,children:[W,G,K,q,J]}),d[52]=k,d[53]=W,d[54]=G,d[55]=K,d[56]=q,d[57]=J,d[58]=Y):Y=d[58];let X;d[59]!==U||d[60]!==Y?(X=(0,c.jsx)(`div`,{ref:g,className:U,children:Y}),d[59]=U,d[60]=Y,d[61]=X):X=d[61];let Z;d[62]===e.children?Z=d[63]:(Z=(0,c.jsx)(te.default,{name:`Dialog`,childName:de,onChildrenChange:ue,compareChild:r.shallowEqual,children:e.children}),d[62]=e.children,d[63]=Z);let Q;d[64]!==I||d[65]!==R||d[66]!==e.headline||d[67]!==H||d[68]!==X||d[69]!==Z?(Q=(0,c.jsxs)(`dialog`,{ref:h,className:`Dialog`,onClose:I,onKeyDown:R,"aria-label":V,role:H,children:[X,Z]}),d[64]=I,d[65]=R,d[66]=e.headline,d[67]=H,d[68]=X,d[69]=Z,d[70]=Q):Q=d[70];let $;return d[71]!==m||d[72]!==Q?($=(0,l.createPortal)(Q,m),d[71]=m,d[72]=Q,d[73]=$):$=d[73],$}function ae(e){return e.children}function oe(e){return/^dialog-\w+-container-close$/.test(e)}function se(e){e.target instanceof HTMLDivElement&&(e.target.scrollTop?e.target?.classList.add(`on-scroll`):e.target?.classList.remove(`on-scroll`))}function ce(e){return e.orderedCollectionName===`DialogAction`}function le(e){return e.orderedCollectionName===`Content`}exports.default=d;
|
|
@@ -2,127 +2,129 @@ import { useTheme as e } from "../Theme/Theme.js";
|
|
|
2
2
|
import ee from "../Button/context.js";
|
|
3
3
|
import { IconProvider as te, convertIconDefinition as ne } from "../Icon/Icon.js";
|
|
4
4
|
import { shallowEqual as re, waitAnimationNameEndEvent as ie } from "../../utils/index.js";
|
|
5
|
-
import
|
|
6
|
-
import
|
|
7
|
-
import { getComponentSizeName as
|
|
8
|
-
import
|
|
9
|
-
import
|
|
5
|
+
import ae from "../misc/OrderedCollection/index.js";
|
|
6
|
+
import t from "../Divider/index.js";
|
|
7
|
+
import { getComponentSizeName as oe } from "../types.js";
|
|
8
|
+
import n from "../Button/default/index.js";
|
|
9
|
+
import se from "../Button/icon/index.js";
|
|
10
10
|
import './style.css';/* empty css */
|
|
11
|
-
import { c as
|
|
12
|
-
import
|
|
13
|
-
import { useEffect as
|
|
14
|
-
import { jsx as
|
|
15
|
-
import { createPortal as
|
|
16
|
-
import { useElementEventListener as
|
|
11
|
+
import { c as ce } from "react/compiler-runtime";
|
|
12
|
+
import r from "classnames";
|
|
13
|
+
import { useEffect as le, useEffectEvent as i, useId as ue, useRef as a, useState as de } from "react";
|
|
14
|
+
import { jsx as o, jsxs as s } from "react/jsx-runtime";
|
|
15
|
+
import { createPortal as fe } from "react-dom";
|
|
16
|
+
import { useElementEventListener as pe, useResizeObserver as c } from "react-dom-event-hooks";
|
|
17
17
|
//#region lib/components/Dialog/Dialog.tsx
|
|
18
|
-
function
|
|
19
|
-
let
|
|
20
|
-
|
|
21
|
-
let [
|
|
22
|
-
|
|
23
|
-
let
|
|
24
|
-
|
|
25
|
-
let
|
|
26
|
-
|
|
27
|
-
let ve =
|
|
28
|
-
|
|
18
|
+
function l(l) {
|
|
19
|
+
let d = ce(74), f = ue(), { setDialogState: p, dialogsContainer: m } = e("Dialog"), h = a(null), g = a(null), _;
|
|
20
|
+
d[0] === Symbol.for("react.memo_cache_sentinel") ? (_ = [], d[0] = _) : _ = d[0];
|
|
21
|
+
let [v, y] = de(_), b;
|
|
22
|
+
d[1] === v ? b = d[2] : (b = v.filter(_e).at(0), d[1] = v, d[2] = b);
|
|
23
|
+
let x = b, S;
|
|
24
|
+
d[3] === v ? S = d[4] : (S = v.filter(ge), d[3] = v, d[4] = S);
|
|
25
|
+
let C = S, w;
|
|
26
|
+
d[5] === Symbol.for("react.memo_cache_sentinel") ? (w = ["Content", "DialogAction"], d[5] = w) : w = d[5];
|
|
27
|
+
let ve = w, T;
|
|
28
|
+
d[6] === Symbol.for("react.memo_cache_sentinel") ? (T = {
|
|
29
29
|
default: "text",
|
|
30
30
|
icon: "standard"
|
|
31
|
-
},
|
|
32
|
-
let
|
|
33
|
-
|
|
31
|
+
}, d[6] = T) : T = d[6];
|
|
32
|
+
let E = T, D;
|
|
33
|
+
d[7] !== l.fullscreen || d[8] !== l.icon ? (D = l.fullscreen ? null : ne(l.icon), d[7] = l.fullscreen, d[8] = l.icon, d[9] = D) : D = d[9];
|
|
34
34
|
let O = D, k;
|
|
35
|
-
|
|
35
|
+
d[10] === Symbol.for("react.memo_cache_sentinel") ? (k = (e) => {
|
|
36
36
|
e.filter((e) => e.borderBoxSize.forEach((e) => {
|
|
37
|
-
|
|
37
|
+
g.current?.checkVisibility() && (g.current.style.setProperty("--modal-width", `${e.inlineSize}px`), g.current.style.setProperty("--modal-height", `${e.blockSize}px`));
|
|
38
38
|
}));
|
|
39
|
-
},
|
|
40
|
-
let { saveRef: A } =
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
},
|
|
44
|
-
let N =
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
},
|
|
48
|
-
let F =
|
|
49
|
-
|
|
50
|
-
e.stopPropagation(),
|
|
51
|
-
},
|
|
39
|
+
}, d[10] = k) : k = d[10];
|
|
40
|
+
let { saveRef: A } = c(k), { saveRef: j } = pe("scroll", he), M;
|
|
41
|
+
d[11] !== f || d[12] !== p ? (M = () => {
|
|
42
|
+
p(f, !0), h.current?.classList.remove("close"), h.current?.classList.add("open"), h.current?.showModal();
|
|
43
|
+
}, d[11] = f, d[12] = p, d[13] = M) : M = d[13];
|
|
44
|
+
let N = i(M), P;
|
|
45
|
+
d[14] !== f || d[15] !== p ? (P = async () => {
|
|
46
|
+
p(f, !1), h.current?.classList.remove("open"), h.current?.classList.add("close"), await ie(g.current, u), h.current?.classList.remove("close"), h.current?.close();
|
|
47
|
+
}, d[14] = f, d[15] = p, d[16] = P) : P = d[16];
|
|
48
|
+
let F = i(P), I;
|
|
49
|
+
d[17] === l ? I = d[18] : (I = (e) => {
|
|
50
|
+
e.stopPropagation(), l.onClose?.();
|
|
51
|
+
}, d[17] = l, d[18] = I);
|
|
52
52
|
let L = I, R;
|
|
53
|
-
|
|
54
|
-
e.code.toLowerCase().includes("escape") && (e.stopPropagation(), e.preventDefault(),
|
|
55
|
-
},
|
|
53
|
+
d[19] === l ? R = d[20] : (R = (e) => {
|
|
54
|
+
e.code.toLowerCase().includes("escape") && (e.stopPropagation(), e.preventDefault(), l.onClose?.());
|
|
55
|
+
}, d[19] = l, d[20] = R);
|
|
56
56
|
let z = R, B;
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
},
|
|
57
|
+
d[21] !== F || d[22] !== N || d[23] !== l.open ? (B = () => {
|
|
58
|
+
l.open ? N() : F();
|
|
59
|
+
}, d[21] = F, d[22] = N, d[23] = l.open, d[24] = B) : B = d[24];
|
|
60
60
|
let V;
|
|
61
|
-
if (
|
|
62
|
-
let
|
|
63
|
-
|
|
64
|
-
fullscreen:
|
|
65
|
-
headline:
|
|
66
|
-
icon: !
|
|
67
|
-
}),
|
|
61
|
+
if (d[25] === l.open ? V = d[26] : (V = [l.open], d[25] = l.open, d[26] = V), le(B, V), !m) return null;
|
|
62
|
+
let ye = l.headline, H = l.fullscreen ? "dialog" : "alertdialog", U;
|
|
63
|
+
d[27] !== l.fullscreen || d[28] !== l.headline || d[29] !== l.icon || d[30] !== l.size ? (U = r("modal", !l.fullscreen && l.size ? oe(l.size) : void 0, {
|
|
64
|
+
fullscreen: l.fullscreen,
|
|
65
|
+
headline: l.headline,
|
|
66
|
+
icon: !l.fullscreen && l.icon
|
|
67
|
+
}), d[27] = l.fullscreen, d[28] = l.headline, d[29] = l.icon, d[30] = l.size, d[31] = U) : U = d[31];
|
|
68
68
|
let W;
|
|
69
|
-
|
|
69
|
+
d[32] !== O || d[33] !== l.buttonLabel || d[34] !== l.fullscreen || d[35] !== l.headline || d[36] !== l.onButtonClick || d[37] !== l.onClose || d[38] !== l.supportingText ? (W = l.fullscreen ? /* @__PURE__ */ s("div", {
|
|
70
70
|
className: "header",
|
|
71
71
|
children: [
|
|
72
|
-
/* @__PURE__ */
|
|
72
|
+
/* @__PURE__ */ o(se, {
|
|
73
73
|
className: "icon",
|
|
74
74
|
color: "standard",
|
|
75
75
|
icon: "close",
|
|
76
|
-
onClick:
|
|
76
|
+
onClick: l.onClose
|
|
77
77
|
}),
|
|
78
|
-
/* @__PURE__ */
|
|
78
|
+
/* @__PURE__ */ o("span", {
|
|
79
79
|
className: "headline",
|
|
80
|
-
children:
|
|
80
|
+
children: l.headline
|
|
81
81
|
}),
|
|
82
|
-
/* @__PURE__ */
|
|
82
|
+
/* @__PURE__ */ o(n, {
|
|
83
83
|
className: "action",
|
|
84
84
|
color: "text",
|
|
85
|
-
label:
|
|
86
|
-
onClick:
|
|
85
|
+
label: l.buttonLabel,
|
|
86
|
+
onClick: l.onButtonClick
|
|
87
87
|
})
|
|
88
88
|
]
|
|
89
|
-
}) : /* @__PURE__ */
|
|
89
|
+
}) : /* @__PURE__ */ s("div", {
|
|
90
90
|
className: "description",
|
|
91
91
|
children: [
|
|
92
|
-
O && /* @__PURE__ */
|
|
92
|
+
O && /* @__PURE__ */ o(te, {
|
|
93
93
|
size: 24,
|
|
94
94
|
children: O
|
|
95
95
|
}),
|
|
96
|
-
|
|
96
|
+
l.headline && /* @__PURE__ */ o("span", {
|
|
97
97
|
className: "headline",
|
|
98
|
-
children:
|
|
98
|
+
children: l.headline
|
|
99
99
|
}),
|
|
100
|
-
/* @__PURE__ */
|
|
100
|
+
/* @__PURE__ */ o("span", {
|
|
101
101
|
className: "supporting-text",
|
|
102
|
-
children:
|
|
102
|
+
children: l.supportingText
|
|
103
103
|
})
|
|
104
104
|
]
|
|
105
|
-
}),
|
|
105
|
+
}), d[32] = O, d[33] = l.buttonLabel, d[34] = l.fullscreen, d[35] = l.headline, d[36] = l.onButtonClick, d[37] = l.onClose, d[38] = l.supportingText, d[39] = W) : W = d[39];
|
|
106
106
|
let G;
|
|
107
|
-
|
|
107
|
+
d[40] !== x || d[41] !== l.fullscreen ? (G = !l.fullscreen && x && /* @__PURE__ */ o(t, {}), d[40] = x, d[41] = l.fullscreen, d[42] = G) : G = d[42];
|
|
108
108
|
let K;
|
|
109
|
-
|
|
109
|
+
d[43] !== x || d[44] !== j ? (K = !!x && /* @__PURE__ */ o("div", {
|
|
110
110
|
ref: j,
|
|
111
|
-
className: "content",
|
|
112
|
-
|
|
113
|
-
|
|
111
|
+
className: r("content", x.className),
|
|
112
|
+
style: x.style,
|
|
113
|
+
...x.dataset,
|
|
114
|
+
children: x.children
|
|
115
|
+
}), d[43] = x, d[44] = j, d[45] = K) : K = d[45];
|
|
114
116
|
let q;
|
|
115
|
-
|
|
117
|
+
d[46] !== x || d[47] !== l.fullscreen ? (q = !l.fullscreen && x && /* @__PURE__ */ o(t, {}), d[46] = x, d[47] = l.fullscreen, d[48] = q) : q = d[48];
|
|
116
118
|
let J;
|
|
117
|
-
|
|
119
|
+
d[49] !== C || d[50] !== l.fullscreen ? (J = !l.fullscreen && C && /* @__PURE__ */ o("div", {
|
|
118
120
|
className: "actions",
|
|
119
|
-
children: /* @__PURE__ */
|
|
120
|
-
color:
|
|
121
|
-
children:
|
|
121
|
+
children: /* @__PURE__ */ o(ee, {
|
|
122
|
+
color: E,
|
|
123
|
+
children: C.map(me)
|
|
122
124
|
})
|
|
123
|
-
}),
|
|
125
|
+
}), d[49] = C, d[50] = l.fullscreen, d[51] = J) : J = d[51];
|
|
124
126
|
let Y;
|
|
125
|
-
|
|
127
|
+
d[52] !== A || d[53] !== W || d[54] !== G || d[55] !== K || d[56] !== q || d[57] !== J ? (Y = /* @__PURE__ */ s("div", {
|
|
126
128
|
ref: A,
|
|
127
129
|
className: "container",
|
|
128
130
|
children: [
|
|
@@ -132,51 +134,48 @@ function u(u) {
|
|
|
132
134
|
q,
|
|
133
135
|
J
|
|
134
136
|
]
|
|
135
|
-
}),
|
|
137
|
+
}), d[52] = A, d[53] = W, d[54] = G, d[55] = K, d[56] = q, d[57] = J, d[58] = Y) : Y = d[58];
|
|
136
138
|
let X;
|
|
137
|
-
|
|
138
|
-
ref:
|
|
139
|
+
d[59] !== U || d[60] !== Y ? (X = /* @__PURE__ */ o("div", {
|
|
140
|
+
ref: g,
|
|
139
141
|
className: U,
|
|
140
142
|
children: Y
|
|
141
|
-
}),
|
|
143
|
+
}), d[59] = U, d[60] = Y, d[61] = X) : X = d[61];
|
|
142
144
|
let Z;
|
|
143
|
-
|
|
145
|
+
d[62] === l.children ? Z = d[63] : (Z = /* @__PURE__ */ o(ae, {
|
|
144
146
|
name: "Dialog",
|
|
145
147
|
childName: ve,
|
|
146
|
-
onChildrenChange:
|
|
148
|
+
onChildrenChange: y,
|
|
147
149
|
compareChild: re,
|
|
148
|
-
children:
|
|
149
|
-
}),
|
|
150
|
+
children: l.children
|
|
151
|
+
}), d[62] = l.children, d[63] = Z);
|
|
150
152
|
let Q;
|
|
151
|
-
|
|
152
|
-
ref:
|
|
153
|
+
d[64] !== L || d[65] !== z || d[66] !== l.headline || d[67] !== H || d[68] !== X || d[69] !== Z ? (Q = /* @__PURE__ */ s("dialog", {
|
|
154
|
+
ref: h,
|
|
153
155
|
className: "Dialog",
|
|
154
156
|
onClose: L,
|
|
155
157
|
onKeyDown: z,
|
|
156
|
-
"aria-label":
|
|
158
|
+
"aria-label": ye,
|
|
157
159
|
role: H,
|
|
158
160
|
children: [X, Z]
|
|
159
|
-
}),
|
|
161
|
+
}), d[64] = L, d[65] = z, d[66] = l.headline, d[67] = H, d[68] = X, d[69] = Z, d[70] = Q) : Q = d[70];
|
|
160
162
|
let $;
|
|
161
|
-
return
|
|
162
|
-
}
|
|
163
|
-
function pe(e) {
|
|
164
|
-
return e.children;
|
|
163
|
+
return d[71] !== m || d[72] !== Q ? ($ = fe(Q, m), d[71] = m, d[72] = Q, d[73] = $) : $ = d[73], $;
|
|
165
164
|
}
|
|
166
165
|
function me(e) {
|
|
167
166
|
return e.children;
|
|
168
167
|
}
|
|
169
|
-
function
|
|
168
|
+
function u(e) {
|
|
170
169
|
return /^dialog-\w+-container-close$/.test(e);
|
|
171
170
|
}
|
|
172
|
-
function
|
|
171
|
+
function he(e) {
|
|
173
172
|
e.target instanceof HTMLDivElement && (e.target.scrollTop ? e.target?.classList.add("on-scroll") : e.target?.classList.remove("on-scroll"));
|
|
174
173
|
}
|
|
175
|
-
function
|
|
174
|
+
function ge(e) {
|
|
176
175
|
return e.orderedCollectionName === "DialogAction";
|
|
177
176
|
}
|
|
178
|
-
function
|
|
177
|
+
function _e(e) {
|
|
179
178
|
return e.orderedCollectionName === "Content";
|
|
180
179
|
}
|
|
181
180
|
//#endregion
|
|
182
|
-
export {
|
|
181
|
+
export { l as default };
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { MenubarProps } from './render';
|
|
2
2
|
export { default as MenuSection, type MenuSectionProps } from './MenuSection';
|
|
3
|
-
export
|
|
3
|
+
export type { MenubarProps } from './render';
|
|
4
|
+
export default function Menubar(props: MenubarProps): import('react').JSX.Element;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
require('./style.css');const e=require("../../utils/index.cjs"),
|
|
1
|
+
require('./style.css');const e=require("../../_virtual/_rolldown/runtime.cjs"),t=require("../Icon/Icon.cjs"),n=require("../../utils/index.cjs"),r=require("../misc/OrderedCollection/index.cjs"),i=require("../Button/default/index.cjs");;/* empty css */let a=require("react/compiler-runtime"),o=require("classnames");o=e.__toESM(o,1);let s=require("react"),c=require("react/jsx-runtime"),l=require("react-dom-event-hooks");function u(e){let u=(0,a.c)(40),h;u[0]===e?h=u[1]:(h=Object.fromEntries(Object.entries(e).filter(m)),u[0]=e,u[1]=h);let g=h,_;u[2]===Symbol.for(`react.memo_cache_sentinel`)?(_=[],u[2]=_):_=u[2];let[v,y]=(0,s.useState)(_),b;u[3]===v?b=u[4]:(b=v.filter(p),u[3]=v,u[4]=b);let x=b,S;u[5]===v?S=u[6]:(S=v.filter(f).at(0),u[5]=v,u[6]=S);let C=S,[w,T]=(0,s.useState)(),{saveRef:E,ref:D}=(0,l.useMultiElementRef)(),O=d,k;u[7]===e.icon?k=u[8]:(k=t.convertIconDefinition(e.icon),u[7]=e.icon,u[8]=k);let A=k,j;u[9]!==D||u[10]!==w?(j=e=>{e.target instanceof Node&&w&&!Array.from(D.current.values()).some(t=>t.contains(e.target))&&T(void 0)},u[9]=D,u[10]=w,u[11]=j):j=u[11],(0,l.useWindowEventListener)(`pointerdown`,j);let M;u[12]!==D||u[13]!==w?(M=e=>{e.target instanceof Node&&w&&(!e.target.parentElement?.parentElement?.classList.contains(`selectable`)||!Array.from(D.current.values()).some(t=>t.contains(e.target)))&&T(void 0)},u[12]=D,u[13]=w,u[14]=M):M=u[14],(0,l.useWindowEventListener)(`click`,M);let N;u[15]===e.className?N=u[16]:(N=(0,o.default)(`Menubar`,e.className),u[15]=e.className,u[16]=N);let P;u[17]===A?P=u[18]:(P=A&&(0,c.jsx)(`div`,{className:`icon`,children:A}),u[17]=A,u[18]=P);let F;if(u[19]!==w||u[20]!==E||u[21]!==x){let e;u[23]!==w||u[24]!==E?(e=e=>(0,c.jsx)(i.default,{label:e.label,color:`text`,shape:`square`,size:`extra-small`,onClick:t=>{t.stopPropagation(),T(t=>t?void 0:e.id)},onPointerDown:O,onMouseEnter:()=>w&&T(e.id),menuRef:E,menuOpen:w===e.id,density:-3,menuOpenBehavior:`manual`,children:e.children},e.id),u[23]=w,u[24]=E,u[25]=e):e=u[25],F=x.map(e),u[19]=w,u[20]=E,u[21]=x,u[22]=F}else F=u[22];let I;u[26]===F?I=u[27]:(I=(0,c.jsx)(`div`,{className:`container`,children:F}),u[26]=F,u[27]=I);let L;u[28]===C?L=u[29]:(L=!!C&&(0,c.jsx)(`div`,{className:(0,o.default)(`content`,C.className),style:C.style,...C.dataset,children:C.children}),u[28]=C,u[29]=L);let R;u[30]===Symbol.for(`react.memo_cache_sentinel`)?(R=[`MenuSection`,`Content`],u[30]=R):R=u[30];let z;u[31]===e.children?z=u[32]:(z=(0,c.jsx)(r.default,{childName:R,onChildrenChange:y,compareChild:n.shallowEqual,children:e.children}),u[31]=e.children,u[32]=z);let B;return u[33]!==g||u[34]!==I||u[35]!==L||u[36]!==z||u[37]!==N||u[38]!==P?(B=(0,c.jsxs)(`div`,{...g,className:N,children:[P,I,L,z]}),u[33]=g,u[34]=I,u[35]=L,u[36]=z,u[37]=N,u[38]=P,u[39]=B):B=u[39],B}function d(e){return e.stopPropagation()}function f(e){return e.orderedCollectionName===`Content`}function p(e){return e.orderedCollectionName===`MenuSection`}function m(e){let[t]=e;return t.startsWith(`data-`)}exports.default=u;
|
|
@@ -1,3 +1,7 @@
|
|
|
1
|
+
import { IconDefinition } from '../Icon';
|
|
1
2
|
import { PropsWithChildren } from 'react';
|
|
2
|
-
export
|
|
3
|
+
export interface MenubarProps extends PropsWithChildren {
|
|
4
|
+
icon?: IconDefinition;
|
|
5
|
+
className?: string;
|
|
6
|
+
}
|
|
3
7
|
export default function MenubarRender(props: MenubarProps): import('react').JSX.Element;
|