@stack-spot/portal-layout 0.0.35 → 0.0.37
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/OverlayContent.js +1 -1
- package/dist/components/OverlayContent.js.map +1 -1
- package/dist/components/menu/MenuContent.d.ts.map +1 -1
- package/dist/components/menu/MenuContent.js +23 -4
- package/dist/components/menu/MenuContent.js.map +1 -1
- package/dist/layout.css +0 -1
- package/package.json +1 -1
- package/src/components/OverlayContent.tsx +1 -1
- package/src/components/menu/MenuContent.tsx +35 -13
- package/src/layout.css +0 -1
|
@@ -28,6 +28,6 @@ const ContentBox = styled.section `
|
|
|
28
28
|
`;
|
|
29
29
|
export const OverlayContent = ({ children, title, subtitle, className, style, onClose, type }) => {
|
|
30
30
|
const t = useDictionary();
|
|
31
|
-
return (_jsxs(ContentBox, { style: style, className: listToClass([className, type]), children: [_jsxs("header", { children: [_jsxs(Flex, { flexDirection: "column", flex: 1, children: [_jsx(Text, { appearance: type === 'modal' ? 'h3' : 'h4', children: title }), subtitle && _jsx(Text, { appearance: "body2", colorScheme: "light.700", children: subtitle })] }), _jsx(IconButton, { onClick: onClose, title: t.close, "aria-label": t.close, id: CLOSE_OVERLAY_ID, children: _jsx(TimesMini, {}) })] }), children] }));
|
|
31
|
+
return (_jsxs(ContentBox, { style: style, className: listToClass([className, type]), children: [_jsxs("header", { children: [_jsxs(Flex, { flexDirection: "column", flex: 1, children: [_jsx(Text, { as: "h2", appearance: type === 'modal' ? 'h3' : 'h4', children: title }), subtitle && _jsx(Text, { appearance: "body2", colorScheme: "light.700", children: subtitle })] }), _jsx(IconButton, { onClick: onClose, title: t.close, "aria-label": t.close, id: CLOSE_OVERLAY_ID, children: _jsx(TimesMini, {}) })] }), children] }));
|
|
32
32
|
};
|
|
33
33
|
//# sourceMappingURL=OverlayContent.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"OverlayContent.js","sourceRoot":"","sources":["../../src/components/OverlayContent.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,cAAc,CAAA;AACzC,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAA;AACzC,OAAO,EAAE,UAAU,EAAE,MAAM,YAAY,CAAA;AACvC,OAAO,EAAa,WAAW,EAAE,KAAK,EAAE,MAAM,0BAA0B,CAAA;AAExE,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAA;AAC1C,OAAO,EAAE,aAAa,EAAE,MAAM,eAAe,CAAA;AAE7C,MAAM,CAAC,MAAM,gBAAgB,GAAG,eAAe,CAAA;AAc/C,MAAM,UAAU,GAAG,MAAM,CAAC,OAAO,CAAA;;;;sBAIX,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC;;;;;;;;;;;;;;;CAe7C,CAAA;AAED,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,QAAQ,EAAE,SAAS,EAAE,KAAK,EAAE,OAAO,EAAE,IAAI,EAAS,EAAE,EAAE;IACtG,MAAM,CAAC,GAAG,aAAa,EAAE,CAAA;IACzB,OAAO,CACL,MAAC,UAAU,IAAC,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,WAAW,CAAC,CAAC,SAAS,EAAE,IAAI,CAAC,CAAC,aACjE,6BACE,MAAC,IAAI,IAAC,aAAa,EAAC,QAAQ,EAAC,IAAI,EAAE,CAAC,aAClC,KAAC,IAAI,IAAC,UAAU,EAAE,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,YAAG,KAAK,GAAQ,
|
|
1
|
+
{"version":3,"file":"OverlayContent.js","sourceRoot":"","sources":["../../src/components/OverlayContent.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,cAAc,CAAA;AACzC,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAA;AACzC,OAAO,EAAE,UAAU,EAAE,MAAM,YAAY,CAAA;AACvC,OAAO,EAAa,WAAW,EAAE,KAAK,EAAE,MAAM,0BAA0B,CAAA;AAExE,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAA;AAC1C,OAAO,EAAE,aAAa,EAAE,MAAM,eAAe,CAAA;AAE7C,MAAM,CAAC,MAAM,gBAAgB,GAAG,eAAe,CAAA;AAc/C,MAAM,UAAU,GAAG,MAAM,CAAC,OAAO,CAAA;;;;sBAIX,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC;;;;;;;;;;;;;;;CAe7C,CAAA;AAED,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,QAAQ,EAAE,SAAS,EAAE,KAAK,EAAE,OAAO,EAAE,IAAI,EAAS,EAAE,EAAE;IACtG,MAAM,CAAC,GAAG,aAAa,EAAE,CAAA;IACzB,OAAO,CACL,MAAC,UAAU,IAAC,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,WAAW,CAAC,CAAC,SAAS,EAAE,IAAI,CAAC,CAAC,aACjE,6BACE,MAAC,IAAI,IAAC,aAAa,EAAC,QAAQ,EAAC,IAAI,EAAE,CAAC,aAClC,KAAC,IAAI,IAAC,EAAE,EAAC,IAAI,EAAC,UAAU,EAAE,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,YAAG,KAAK,GAAQ,EACvE,QAAQ,IAAI,KAAC,IAAI,IAAC,UAAU,EAAC,OAAO,EAAC,WAAW,EAAC,WAAW,YAAE,QAAQ,GAAQ,IAC1E,EACP,KAAC,UAAU,IAAC,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC,CAAC,KAAK,gBAAc,CAAC,CAAC,KAAK,EAAE,EAAE,EAAE,gBAAgB,YAAE,KAAC,SAAS,KAAG,GAAa,IAC5G,EACR,QAAQ,IACE,CACd,CAAA;AACH,CAAC,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MenuContent.d.ts","sourceRoot":"","sources":["../../../src/components/menu/MenuContent.tsx"],"names":[],"mappings":";AAUA,OAAO,EAAa,UAAU,EAAY,kBAAkB,EAAE,MAAM,SAAS,CAAA;AAY7E,eAAO,MAAM,SAAS,
|
|
1
|
+
{"version":3,"file":"MenuContent.d.ts","sourceRoot":"","sources":["../../../src/components/menu/MenuContent.tsx"],"names":[],"mappings":";AAUA,OAAO,EAAa,UAAU,EAAY,kBAAkB,EAAE,MAAM,SAAS,CAAA;AAY7E,eAAO,MAAM,SAAS,oNAiIrB,CAAA;AAED,eAAO,MAAM,KAAK,0MAIjB,CAAA;AAED,eAAO,MAAM,UAAU,4DAAsE,UAAU,4CAsBtG,CAAA;AAuDD,eAAO,MAAM,WAAW,mFAAyF,kBAAkB,4CAsClI,CAAA"}
|
|
@@ -29,6 +29,24 @@ export const MenuGroup = styled.ul `
|
|
|
29
29
|
padding: 0;
|
|
30
30
|
}
|
|
31
31
|
|
|
32
|
+
.item-row-title > a {
|
|
33
|
+
padding: 0 20px;
|
|
34
|
+
margin: 0;
|
|
35
|
+
border-radius: 0;
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
.item-row-title > a::before {
|
|
39
|
+
content: '';
|
|
40
|
+
position: absolute;
|
|
41
|
+
top: 0;
|
|
42
|
+
left: 0;
|
|
43
|
+
right: 0;
|
|
44
|
+
bottom: 0;
|
|
45
|
+
background-color: var(--light-300);
|
|
46
|
+
opacity: 0.24;
|
|
47
|
+
border-radius: inherit;
|
|
48
|
+
}
|
|
49
|
+
|
|
32
50
|
.item-row {
|
|
33
51
|
display: flex;
|
|
34
52
|
flex-direction: row;
|
|
@@ -102,7 +120,7 @@ export const MenuGroup = styled.ul `
|
|
|
102
120
|
&.open {
|
|
103
121
|
visibility: visible;
|
|
104
122
|
transition: unset;
|
|
105
|
-
& > li > a {
|
|
123
|
+
& > li > a, & > li > .item-row-title > a {
|
|
106
124
|
height: 40px;
|
|
107
125
|
}
|
|
108
126
|
}
|
|
@@ -154,9 +172,10 @@ const CollapsibleGroupItem = ({ label, open: initiallyOpened, children, icon, ba
|
|
|
154
172
|
const id = `menuGroup${label}`;
|
|
155
173
|
return (_jsxs(_Fragment, { children: [_jsxs("a", { onClick: () => setOpen(!open), onKeyDown: e => e.key === 'Enter' && setOpen(!open), className: "item-row", tabIndex: 0, "aria-controls": id, "aria-expanded": open, children: [icon, _jsx(Text, { appearance: "body2", className: `label ${overflow}`, children: label }), badge, _jsx(IconBox, { children: _jsx(ChevronDown, { className: listToClass(['chevron', open ? 'open' : '']) }) })] }), _jsx(MenuGroup, { id: id, className: open ? 'open' : undefined, "aria-hidden": !open, children: items })] }));
|
|
156
174
|
};
|
|
157
|
-
const RootGroupItem = (
|
|
158
|
-
const items = useMemo(() => children?.filter(i => !i.hidden).map(renderOption), [children]);
|
|
159
|
-
return (
|
|
175
|
+
const RootGroupItem = (props) => {
|
|
176
|
+
const items = useMemo(() => props.children?.filter(i => !i.hidden).map(renderOption), [props.children]);
|
|
177
|
+
return _jsx(_Fragment, { children: items.length ? _jsx("div", { className: "item-row-title", children: _jsx(CollapsibleGroupItem, { ...props, open: true }) }) :
|
|
178
|
+
_jsxs(_Fragment, { children: [_jsxs("div", { className: "item-row", children: [props.icon, _jsx(Text, { appearance: "overheader2", colorScheme: "light.700", className: `group-title label ${props.overflow}`, children: props.label }), props.badge] }), _jsx(MenuGroup, { className: "open no-indentation", children: items })] }) });
|
|
160
179
|
};
|
|
161
180
|
const GroupItem = ({ root, ...item }) => (root ? _jsx(RootGroupItem, { ...item }) : _jsx(CollapsibleGroupItem, { ...item }));
|
|
162
181
|
function renderOption({ root, ...option }) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MenuContent.js","sourceRoot":"","sources":["../../../src/components/menu/MenuContent.tsx"],"names":[],"mappings":";AAAA,sDAAsD;AACtD,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,cAAc,CAAA;AAClD,OAAO,EAAE,SAAS,EAAE,WAAW,EAAE,MAAM,eAAe,CAAA;AACtD,OAAO,EAAE,eAAe,EAAE,MAAM,YAAY,CAAA;AAC5C,OAAO,EAAE,WAAW,EAAE,KAAK,EAAE,MAAM,0BAA0B,CAAA;AAC7D,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AACzC,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAA;AAC1C,OAAO,EAAE,sBAAsB,EAAE,MAAM,gBAAgB,CAAA;AACvD,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAA;AAC7C,OAAO,EAAE,yBAAyB,IAAI,YAAY,EAAE,oBAAoB,IAAI,OAAO,EAAE,MAAM,aAAa,CAAA;AAExG,OAAO,EAAE,oBAAoB,EAAE,MAAM,2BAA2B,CAAA;AAEhE,MAAM,QAAQ,GAAG,MAAM,CAAC,CAAC,CAAA;;;;YAIb,OAAO;;;CAGlB,CAAA;AAED,MAAM,CAAC,MAAM,SAAS,GAAG,MAAM,CAAC,EAAE,CAAA
|
|
1
|
+
{"version":3,"file":"MenuContent.js","sourceRoot":"","sources":["../../../src/components/menu/MenuContent.tsx"],"names":[],"mappings":"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"}
|
package/dist/layout.css
CHANGED
package/package.json
CHANGED
|
@@ -47,7 +47,7 @@ export const OverlayContent = ({ children, title, subtitle, className, style, on
|
|
|
47
47
|
<ContentBox style={style} className={listToClass([className, type])}>
|
|
48
48
|
<header>
|
|
49
49
|
<Flex flexDirection="column" flex={1}>
|
|
50
|
-
<Text appearance={type === 'modal' ? 'h3' : 'h4'}>{title}</Text>
|
|
50
|
+
<Text as="h2" appearance={type === 'modal' ? 'h3' : 'h4'}>{title}</Text>
|
|
51
51
|
{subtitle && <Text appearance="body2" colorScheme="light.700">{subtitle}</Text>}
|
|
52
52
|
</Flex>
|
|
53
53
|
<IconButton onClick={onClose} title={t.close} aria-label={t.close} id={CLOSE_OVERLAY_ID}><TimesMini /></IconButton>
|
|
@@ -31,6 +31,24 @@ export const MenuGroup = styled.ul`
|
|
|
31
31
|
padding: 0;
|
|
32
32
|
}
|
|
33
33
|
|
|
34
|
+
.item-row-title > a {
|
|
35
|
+
padding: 0 20px;
|
|
36
|
+
margin: 0;
|
|
37
|
+
border-radius: 0;
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
.item-row-title > a::before {
|
|
41
|
+
content: '';
|
|
42
|
+
position: absolute;
|
|
43
|
+
top: 0;
|
|
44
|
+
left: 0;
|
|
45
|
+
right: 0;
|
|
46
|
+
bottom: 0;
|
|
47
|
+
background-color: var(--light-300);
|
|
48
|
+
opacity: 0.24;
|
|
49
|
+
border-radius: inherit;
|
|
50
|
+
}
|
|
51
|
+
|
|
34
52
|
.item-row {
|
|
35
53
|
display: flex;
|
|
36
54
|
flex-direction: row;
|
|
@@ -104,7 +122,7 @@ export const MenuGroup = styled.ul`
|
|
|
104
122
|
&.open {
|
|
105
123
|
visibility: visible;
|
|
106
124
|
transition: unset;
|
|
107
|
-
& > li > a {
|
|
125
|
+
& > li > a, & > li > .item-row-title > a {
|
|
108
126
|
height: 40px;
|
|
109
127
|
}
|
|
110
128
|
}
|
|
@@ -188,19 +206,23 @@ const CollapsibleGroupItem = ({ label, open: initiallyOpened, children, icon, ba
|
|
|
188
206
|
)
|
|
189
207
|
}
|
|
190
208
|
|
|
191
|
-
const RootGroupItem = (
|
|
192
|
-
const items = useMemo(() => children?.filter(i => !i.hidden).map(renderOption), [children])
|
|
209
|
+
const RootGroupItem = (props: ItemGroup) => {
|
|
210
|
+
const items = useMemo(() => props.children?.filter(i => !i.hidden).map(renderOption), [props.children])
|
|
193
211
|
|
|
194
|
-
return
|
|
195
|
-
|
|
196
|
-
<
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
212
|
+
return <>
|
|
213
|
+
{items.length ? <div className="item-row-title">
|
|
214
|
+
<CollapsibleGroupItem {...props} open={true} />
|
|
215
|
+
</div> :
|
|
216
|
+
<>
|
|
217
|
+
<div className="item-row">
|
|
218
|
+
{props.icon}
|
|
219
|
+
<Text appearance="overheader2" colorScheme="light.700" className={`group-title label ${props.overflow}`}>{props.label}</Text>
|
|
220
|
+
{props.badge}
|
|
221
|
+
</div>
|
|
222
|
+
<MenuGroup className="open no-indentation">{items}</MenuGroup>
|
|
223
|
+
</>
|
|
224
|
+
}
|
|
225
|
+
</>
|
|
204
226
|
}
|
|
205
227
|
|
|
206
228
|
const GroupItem = ({ root, ...item }: ItemGroup & { root?: boolean }) => (
|
package/src/layout.css
CHANGED