@elliemae/ds-global-header 3.1.0-next.9 → 3.1.0
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/cjs/exported-related/theming.js +2 -2
- package/dist/cjs/exported-related/theming.js.map +2 -2
- package/dist/cjs/parts/Breadcrumb/styles.js +22 -7
- package/dist/cjs/parts/Breadcrumb/styles.js.map +2 -2
- package/dist/cjs/parts/Logo/styles.js +4 -1
- package/dist/cjs/parts/Logo/styles.js.map +2 -2
- package/dist/cjs/parts/Toolbar/outOfTheBox/PopupMenu/menuContent/styles.js +17 -5
- package/dist/cjs/parts/Toolbar/outOfTheBox/PopupMenu/menuContent/styles.js.map +2 -2
- package/dist/cjs/parts/Toolbar/outOfTheBox/SearchToggle/styles.js +1 -1
- package/dist/cjs/parts/Toolbar/outOfTheBox/SearchToggle/styles.js.map +2 -2
- package/dist/cjs/parts/Toolbar/styles.js +6 -3
- package/dist/cjs/parts/Toolbar/styles.js.map +2 -2
- package/dist/cjs/parts/styles.js +5 -2
- package/dist/cjs/parts/styles.js.map +2 -2
- package/dist/esm/exported-related/theming.js +2 -2
- package/dist/esm/exported-related/theming.js.map +2 -2
- package/dist/esm/parts/Breadcrumb/styles.js +23 -8
- package/dist/esm/parts/Breadcrumb/styles.js.map +2 -2
- package/dist/esm/parts/Logo/styles.js +5 -2
- package/dist/esm/parts/Logo/styles.js.map +2 -2
- package/dist/esm/parts/Toolbar/outOfTheBox/PopupMenu/menuContent/styles.js +18 -6
- package/dist/esm/parts/Toolbar/outOfTheBox/PopupMenu/menuContent/styles.js.map +2 -2
- package/dist/esm/parts/Toolbar/outOfTheBox/SearchToggle/styles.js +2 -2
- package/dist/esm/parts/Toolbar/outOfTheBox/SearchToggle/styles.js.map +2 -2
- package/dist/esm/parts/Toolbar/styles.js +7 -4
- package/dist/esm/parts/Toolbar/styles.js.map +2 -2
- package/dist/esm/parts/styles.js +6 -3
- package/dist/esm/parts/styles.js.map +2 -2
- package/package.json +8 -8
|
@@ -21,12 +21,12 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
|
|
|
21
21
|
var theming_exports = {};
|
|
22
22
|
__export(theming_exports, {
|
|
23
23
|
DSGlobalHeaderName: () => DSGlobalHeaderName,
|
|
24
|
-
|
|
24
|
+
DSGlobalHeaderSlots: () => DSGlobalHeaderSlots
|
|
25
25
|
});
|
|
26
26
|
module.exports = __toCommonJS(theming_exports);
|
|
27
27
|
var React = __toESM(require("react"));
|
|
28
28
|
const DSGlobalHeaderName = "DSGlobalHeader";
|
|
29
|
-
const
|
|
29
|
+
const DSGlobalHeaderSlots = {
|
|
30
30
|
CONTAINER: "root",
|
|
31
31
|
LOGO: {
|
|
32
32
|
CONTAINER: "logo-container"
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/exported-related/theming.ts", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["export const DSGlobalHeaderName = 'DSGlobalHeader';\n\nexport const
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAhB,MAAM,qBAAqB;AAE3B,MAAM,
|
|
4
|
+
"sourcesContent": ["export const DSGlobalHeaderName = 'DSGlobalHeader';\n\nexport const DSGlobalHeaderSlots = {\n CONTAINER: 'root',\n LOGO: {\n CONTAINER: 'logo-container',\n },\n BREADCRUMB: {\n CONTAINER: 'breadcrumb-container',\n PIPE: 'breadcrumb-pipe',\n CHEVRON: 'breadcrumb-chevron',\n LIST: 'breadcrumb-list',\n ITEM: 'breadcrumb-item',\n ITEM_LINK: 'breadcrumb-item-link',\n ITEM_LINK_LABEL: 'breadcrumb-item-link-label',\n },\n MENUBAR: {\n CONTAINER: 'menubar-container',\n LIST: 'menubar-list',\n ITEM: 'menubar-item',\n ITEM_BUTTON: 'menubar-item-button',\n POPUP_MENU: {\n LIST: 'menubar-item-popupmenu-list',\n ITEM: 'menubar-item-popupmenu-item',\n ITEM_BUTTON: 'menubar-item-popupmenu-item-button',\n SEPARATOR: 'menubar-item-popupmenu-separator',\n ITEM_BUTTON_LABEL: 'menubar-item-popupmenu-item-label',\n },\n SEARCH_TOGGLE: {\n CONTAINER: 'menubar-item-searchtoggle-container',\n },\n },\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAhB,MAAM,qBAAqB;AAE3B,MAAM,sBAAsB;AAAA,EACjC,WAAW;AAAA,EACX,MAAM;AAAA,IACJ,WAAW;AAAA,EACb;AAAA,EACA,YAAY;AAAA,IACV,WAAW;AAAA,IACX,MAAM;AAAA,IACN,SAAS;AAAA,IACT,MAAM;AAAA,IACN,MAAM;AAAA,IACN,WAAW;AAAA,IACX,iBAAiB;AAAA,EACnB;AAAA,EACA,SAAS;AAAA,IACP,WAAW;AAAA,IACX,MAAM;AAAA,IACN,MAAM;AAAA,IACN,aAAa;AAAA,IACb,YAAY;AAAA,MACV,MAAM;AAAA,MACN,MAAM;AAAA,MACN,aAAa;AAAA,MACb,WAAW;AAAA,MACX,mBAAmB;AAAA,IACrB;AAAA,IACA,eAAe;AAAA,MACb,WAAW;AAAA,IACb;AAAA,EACF;AACF;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -34,8 +34,14 @@ var import_ds_system = require("@elliemae/ds-system");
|
|
|
34
34
|
var import_ds_grid = require("@elliemae/ds-grid");
|
|
35
35
|
var import_ds_icons = require("@elliemae/ds-icons");
|
|
36
36
|
var import_theming = require("../../exported-related/theming");
|
|
37
|
-
const StyledBreadcrumbContainer = (0, import_ds_system.styled)(import_ds_grid.Grid, {
|
|
38
|
-
|
|
37
|
+
const StyledBreadcrumbContainer = (0, import_ds_system.styled)(import_ds_grid.Grid, {
|
|
38
|
+
name: import_theming.DSGlobalHeaderName,
|
|
39
|
+
slot: import_theming.DSGlobalHeaderSlots.BREADCRUMB.CONTAINER
|
|
40
|
+
})``;
|
|
41
|
+
const StyledBreadcrumbList = (0, import_ds_system.styled)("ul", {
|
|
42
|
+
name: import_theming.DSGlobalHeaderName,
|
|
43
|
+
slot: import_theming.DSGlobalHeaderSlots.BREADCRUMB.LIST
|
|
44
|
+
})`
|
|
39
45
|
display: grid;
|
|
40
46
|
grid-auto-flow: column;
|
|
41
47
|
min-width: fit-content;
|
|
@@ -44,23 +50,29 @@ const StyledBreadcrumbList = (0, import_ds_system.styled)("ul", { name: import_t
|
|
|
44
50
|
padding: 0;
|
|
45
51
|
height: 100%;
|
|
46
52
|
`;
|
|
47
|
-
const StyledPipe = (0, import_ds_system.styled)("span", {
|
|
53
|
+
const StyledPipe = (0, import_ds_system.styled)("span", {
|
|
54
|
+
name: import_theming.DSGlobalHeaderName,
|
|
55
|
+
slot: import_theming.DSGlobalHeaderSlots.BREADCRUMB.PIPE
|
|
56
|
+
})`
|
|
48
57
|
margin: 0 7px 0 0;
|
|
49
58
|
border-left: ${({ theme, showIconOnly }) => showIconOnly ? "none" : `1px solid ${theme.colors.neutral["000"]}`};
|
|
50
59
|
height: 20px;
|
|
51
60
|
`;
|
|
52
61
|
const StyledChevron = (0, import_ds_system.styled)(import_ds_icons.ChevronSmallRight, {
|
|
53
62
|
name: import_theming.DSGlobalHeaderName,
|
|
54
|
-
slot: import_theming.
|
|
63
|
+
slot: import_theming.DSGlobalHeaderSlots.BREADCRUMB.CHEVRON
|
|
55
64
|
})`
|
|
56
65
|
fill: ${({ theme }) => theme.colors.neutral["000"]};
|
|
57
66
|
`;
|
|
58
|
-
const StyledBreadcrumbItem = (0, import_ds_system.styled)("li", {
|
|
67
|
+
const StyledBreadcrumbItem = (0, import_ds_system.styled)("li", {
|
|
68
|
+
name: import_theming.DSGlobalHeaderName,
|
|
69
|
+
slot: import_theming.DSGlobalHeaderSlots.BREADCRUMB.ITEM
|
|
70
|
+
})`
|
|
59
71
|
display: flex;
|
|
60
72
|
align-items: center;
|
|
61
73
|
height: 40px;
|
|
62
74
|
`;
|
|
63
|
-
const StyledLink = (0, import_ds_system.styled)("a", { name: import_theming.DSGlobalHeaderName, slot: import_theming.
|
|
75
|
+
const StyledLink = (0, import_ds_system.styled)("a", { name: import_theming.DSGlobalHeaderName, slot: import_theming.DSGlobalHeaderSlots.BREADCRUMB.ITEM_LINK })`
|
|
64
76
|
width: fit-content;
|
|
65
77
|
height: 40px;
|
|
66
78
|
display: grid;
|
|
@@ -86,7 +98,10 @@ const StyledLink = (0, import_ds_system.styled)("a", { name: import_theming.DSGl
|
|
|
86
98
|
}
|
|
87
99
|
}
|
|
88
100
|
`;
|
|
89
|
-
const StyledLabel = (0, import_ds_system.styled)("span", {
|
|
101
|
+
const StyledLabel = (0, import_ds_system.styled)("span", {
|
|
102
|
+
name: import_theming.DSGlobalHeaderName,
|
|
103
|
+
slot: import_theming.DSGlobalHeaderSlots.BREADCRUMB.ITEM_LINK_LABEL
|
|
104
|
+
})`
|
|
90
105
|
color: ${({ theme }) => theme.colors.neutral["000"]};
|
|
91
106
|
${({ theme, isSelected }) => `-webkit-text-stroke: 0.4px ${isSelected ? theme.colors.neutral["000"] : "transparent"}`};
|
|
92
107
|
font-size: 16px;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/parts/Breadcrumb/styles.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable @typescript-eslint/no-unsafe-assignment */\nimport { styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { ChevronSmallRight } from '@elliemae/ds-icons';\nimport { DSGlobalHeaderName,
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,uBAAuB;AACvB,qBAAqB;AACrB,sBAAkC;AAClC,
|
|
4
|
+
"sourcesContent": ["/* eslint-disable @typescript-eslint/no-unsafe-assignment */\nimport { styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { ChevronSmallRight } from '@elliemae/ds-icons';\nimport { DSGlobalHeaderName, DSGlobalHeaderSlots } from '../../exported-related/theming';\n\ninterface PipeT {\n showIconOnly: boolean;\n}\n\ninterface ChevronT {\n size: string;\n}\n\ninterface LabelT {\n isSelected: boolean;\n isOnlyItem: boolean;\n}\n\nexport const StyledBreadcrumbContainer = styled(Grid, {\n name: DSGlobalHeaderName,\n slot: DSGlobalHeaderSlots.BREADCRUMB.CONTAINER,\n})``;\n\nexport const StyledBreadcrumbList = styled('ul', {\n name: DSGlobalHeaderName,\n slot: DSGlobalHeaderSlots.BREADCRUMB.LIST,\n})`\n display: grid;\n grid-auto-flow: column;\n min-width: fit-content;\n align-items: center;\n margin: 0;\n padding: 0;\n height: 100%;\n`;\n\nexport const StyledPipe = styled('span', {\n name: DSGlobalHeaderName,\n slot: DSGlobalHeaderSlots.BREADCRUMB.PIPE,\n})<PipeT>`\n margin: 0 7px 0 0;\n border-left: ${({ theme, showIconOnly }) => (showIconOnly ? 'none' : `1px solid ${theme.colors.neutral['000']}`)};\n height: 20px;\n`;\n\nexport const StyledChevron = styled(ChevronSmallRight, {\n name: DSGlobalHeaderName,\n slot: DSGlobalHeaderSlots.BREADCRUMB.CHEVRON,\n})<ChevronT>`\n fill: ${({ theme }) => theme.colors.neutral['000']};\n`;\n\nexport const StyledBreadcrumbItem = styled('li', {\n name: DSGlobalHeaderName,\n slot: DSGlobalHeaderSlots.BREADCRUMB.ITEM,\n})`\n display: flex;\n align-items: center;\n height: 40px;\n`;\n\nexport const StyledLink = styled('a', { name: DSGlobalHeaderName, slot: DSGlobalHeaderSlots.BREADCRUMB.ITEM_LINK })`\n width: fit-content;\n height: 40px;\n display: grid;\n place-items: center;\n margin: 0;\n padding: 0;\n border: 1px solid transparent;\n background-color: transparent;\n outline: none;\n cursor: pointer;\n position: relative;\n &:focus {\n :before {\n content: '';\n position: absolute;\n z-index: 2;\n top: 2px;\n left: -5px;\n width: calc(100% + 10px);\n height: calc(100% - 4px);\n border: 2px solid ${({ theme }) => theme.colors.neutral['000']};\n border-radius: 4px;\n }\n }\n`;\n\nexport const StyledLabel = styled('span', {\n name: DSGlobalHeaderName,\n slot: DSGlobalHeaderSlots.BREADCRUMB.ITEM_LINK_LABEL,\n})<LabelT>`\n color: ${({ theme }) => theme.colors.neutral['000']};\n ${({ theme, isSelected }) =>\n `-webkit-text-stroke: 0.4px ${isSelected ? theme.colors.neutral['000'] : 'transparent'}`};\n font-size: 16px;\n line-height: 1;\n text-transform: uppercase;\n border-bottom: ${({ theme, isSelected, isOnlyItem }) =>\n `2px solid ${isSelected && !isOnlyItem ? theme.colors.neutral['000'] : 'transparent'}`};\n margin: 3px 5px 0 5px;\n :hover {\n ${({ theme }) => `-webkit-text-stroke: 0.4px ${theme.colors.neutral['000']}`};\n }\n`;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,uBAAuB;AACvB,qBAAqB;AACrB,sBAAkC;AAClC,qBAAwD;AAejD,MAAM,4BAA4B,6BAAO,qBAAM;AAAA,EACpD,MAAM;AAAA,EACN,MAAM,mCAAoB,WAAW;AACvC,CAAC;AAEM,MAAM,uBAAuB,6BAAO,MAAM;AAAA,EAC/C,MAAM;AAAA,EACN,MAAM,mCAAoB,WAAW;AACvC,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAUM,MAAM,aAAa,6BAAO,QAAQ;AAAA,EACvC,MAAM;AAAA,EACN,MAAM,mCAAoB,WAAW;AACvC,CAAC;AAAA;AAAA,iBAEgB,CAAC,EAAE,OAAO,mBAAoB,eAAe,SAAS,aAAa,MAAM,OAAO,QAAQ;AAAA;AAAA;AAIlG,MAAM,gBAAgB,6BAAO,mCAAmB;AAAA,EACrD,MAAM;AAAA,EACN,MAAM,mCAAoB,WAAW;AACvC,CAAC;AAAA,UACS,CAAC,EAAE,YAAY,MAAM,OAAO,QAAQ;AAAA;AAGvC,MAAM,uBAAuB,6BAAO,MAAM;AAAA,EAC/C,MAAM;AAAA,EACN,MAAM,mCAAoB,WAAW;AACvC,CAAC;AAAA;AAAA;AAAA;AAAA;AAMM,MAAM,aAAa,6BAAO,KAAK,EAAE,MAAM,mCAAoB,MAAM,mCAAoB,WAAW,UAAU,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,0BAqBxF,CAAC,EAAE,YAAY,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA;AAMvD,MAAM,cAAc,6BAAO,QAAQ;AAAA,EACxC,MAAM;AAAA,EACN,MAAM,mCAAoB,WAAW;AACvC,CAAC;AAAA,WACU,CAAC,EAAE,YAAY,MAAM,OAAO,QAAQ;AAAA,IAC3C,CAAC,EAAE,OAAO,iBACV,+BAA+B,aAAa,MAAM,OAAO,QAAQ,SAAS;AAAA;AAAA;AAAA;AAAA,mBAI3D,CAAC,EAAE,OAAO,YAAY,iBACrC,aAAa,cAAc,CAAC,aAAa,MAAM,OAAO,QAAQ,SAAS;AAAA;AAAA;AAAA,MAGrE,CAAC,EAAE,YAAY,8BAA8B,MAAM,OAAO,QAAQ;AAAA;AAAA;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -27,5 +27,8 @@ var React = __toESM(require("react"));
|
|
|
27
27
|
var import_ds_system = require("@elliemae/ds-system");
|
|
28
28
|
var import_ds_grid = require("@elliemae/ds-grid");
|
|
29
29
|
var import_theming = require("../../exported-related/theming");
|
|
30
|
-
const StyledLogoContainer = (0, import_ds_system.styled)(import_ds_grid.Grid, {
|
|
30
|
+
const StyledLogoContainer = (0, import_ds_system.styled)(import_ds_grid.Grid, {
|
|
31
|
+
name: import_theming.DSGlobalHeaderName,
|
|
32
|
+
slot: import_theming.DSGlobalHeaderSlots.LOGO.CONTAINER
|
|
33
|
+
})``;
|
|
31
34
|
//# sourceMappingURL=styles.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/parts/Logo/styles.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import { styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { DSGlobalHeaderName,
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAAuB;AACvB,qBAAqB;AACrB,
|
|
4
|
+
"sourcesContent": ["import { styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { DSGlobalHeaderName, DSGlobalHeaderSlots } from '../../exported-related/theming';\n\nexport const StyledLogoContainer = styled(Grid, {\n name: DSGlobalHeaderName,\n slot: DSGlobalHeaderSlots.LOGO.CONTAINER,\n})``;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAAuB;AACvB,qBAAqB;AACrB,qBAAwD;AAEjD,MAAM,sBAAsB,6BAAO,qBAAM;AAAA,EAC9C,MAAM;AAAA,EACN,MAAM,mCAAoB,KAAK;AACjC,CAAC;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -30,15 +30,21 @@ module.exports = __toCommonJS(styles_exports);
|
|
|
30
30
|
var React = __toESM(require("react"));
|
|
31
31
|
var import_ds_system = require("@elliemae/ds-system");
|
|
32
32
|
var import_theming = require("../../../../../exported-related/theming");
|
|
33
|
-
const StyledList = (0, import_ds_system.styled)("ul", { name: import_theming.DSGlobalHeaderName, slot: import_theming.
|
|
33
|
+
const StyledList = (0, import_ds_system.styled)("ul", { name: import_theming.DSGlobalHeaderName, slot: import_theming.DSGlobalHeaderSlots.MENUBAR.POPUP_MENU.LIST })`
|
|
34
34
|
padding: 5px 0px;
|
|
35
35
|
margin: 0;
|
|
36
36
|
background: white;
|
|
37
37
|
`;
|
|
38
|
-
const StyledItemContainer = (0, import_ds_system.styled)("li", {
|
|
38
|
+
const StyledItemContainer = (0, import_ds_system.styled)("li", {
|
|
39
|
+
name: import_theming.DSGlobalHeaderName,
|
|
40
|
+
slot: import_theming.DSGlobalHeaderSlots.MENUBAR.POPUP_MENU.ITEM
|
|
41
|
+
})`
|
|
39
42
|
list-style: none;
|
|
40
43
|
`;
|
|
41
|
-
const StyledItemButton = (0, import_ds_system.styled)("button", {
|
|
44
|
+
const StyledItemButton = (0, import_ds_system.styled)("button", {
|
|
45
|
+
name: import_theming.DSGlobalHeaderName,
|
|
46
|
+
slot: import_theming.DSGlobalHeaderSlots.MENUBAR.POPUP_MENU.ITEM_BUTTON
|
|
47
|
+
})`
|
|
42
48
|
display: flex;
|
|
43
49
|
align-items: center;
|
|
44
50
|
justify-content: center;
|
|
@@ -53,12 +59,18 @@ const StyledItemButton = (0, import_ds_system.styled)("button", { name: import_t
|
|
|
53
59
|
border: ${({ theme }) => `1px solid ${theme.colors.brand[600]}`};
|
|
54
60
|
}
|
|
55
61
|
`;
|
|
56
|
-
const StyledLabel = (0, import_ds_system.styled)("span", {
|
|
62
|
+
const StyledLabel = (0, import_ds_system.styled)("span", {
|
|
63
|
+
name: import_theming.DSGlobalHeaderName,
|
|
64
|
+
slot: import_theming.DSGlobalHeaderSlots.MENUBAR.POPUP_MENU.ITEM_BUTTON_LABEL
|
|
65
|
+
})`
|
|
57
66
|
width: 100%;
|
|
58
67
|
font-size: 14px;
|
|
59
68
|
margin: 10px;
|
|
60
69
|
`;
|
|
61
|
-
const StyledSeparator = (0, import_ds_system.styled)("div", {
|
|
70
|
+
const StyledSeparator = (0, import_ds_system.styled)("div", {
|
|
71
|
+
name: import_theming.DSGlobalHeaderName,
|
|
72
|
+
slot: import_theming.DSGlobalHeaderSlots.MENUBAR.POPUP_MENU.SEPARATOR
|
|
73
|
+
})`
|
|
62
74
|
width: 100%;
|
|
63
75
|
border: none;
|
|
64
76
|
border-bottom: 1px solid #ccc;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../../src/parts/Toolbar/outOfTheBox/PopupMenu/menuContent/styles.tsx", "../../../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import { styled } from '@elliemae/ds-system';\nimport { DSGlobalHeaderName,
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAAuB;AACvB,
|
|
4
|
+
"sourcesContent": ["import { styled } from '@elliemae/ds-system';\nimport { DSGlobalHeaderName, DSGlobalHeaderSlots } from '../../../../../exported-related/theming';\n\nexport const StyledList = styled('ul', { name: DSGlobalHeaderName, slot: DSGlobalHeaderSlots.MENUBAR.POPUP_MENU.LIST })`\n padding: 5px 0px;\n margin: 0;\n background: white;\n`;\n\nexport const StyledItemContainer = styled('li', {\n name: DSGlobalHeaderName,\n slot: DSGlobalHeaderSlots.MENUBAR.POPUP_MENU.ITEM,\n})`\n list-style: none;\n`;\n\nexport const StyledItemButton = styled('button', {\n name: DSGlobalHeaderName,\n slot: DSGlobalHeaderSlots.MENUBAR.POPUP_MENU.ITEM_BUTTON,\n})`\n display: flex;\n align-items: center;\n justify-content: center;\n width: 100%;\n padding: 0 20px;\n cursor: pointer;\n border: 1px solid transparent;\n background-color: transparent;\n outline: none;\n :hover,\n :focus {\n border: ${({ theme }) => `1px solid ${theme.colors.brand[600]}`};\n }\n`;\n\nexport const StyledLabel = styled('span', {\n name: DSGlobalHeaderName,\n slot: DSGlobalHeaderSlots.MENUBAR.POPUP_MENU.ITEM_BUTTON_LABEL,\n})`\n width: 100%;\n font-size: 14px;\n margin: 10px;\n`;\n\nexport const StyledSeparator = styled('div', {\n name: DSGlobalHeaderName,\n slot: DSGlobalHeaderSlots.MENUBAR.POPUP_MENU.SEPARATOR,\n})`\n width: 100%;\n border: none;\n border-bottom: 1px solid #ccc;\n`;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAAuB;AACvB,qBAAwD;AAEjD,MAAM,aAAa,6BAAO,MAAM,EAAE,MAAM,mCAAoB,MAAM,mCAAoB,QAAQ,WAAW,KAAK,CAAC;AAAA;AAAA;AAAA;AAAA;AAM/G,MAAM,sBAAsB,6BAAO,MAAM;AAAA,EAC9C,MAAM;AAAA,EACN,MAAM,mCAAoB,QAAQ,WAAW;AAC/C,CAAC;AAAA;AAAA;AAIM,MAAM,mBAAmB,6BAAO,UAAU;AAAA,EAC/C,MAAM;AAAA,EACN,MAAM,mCAAoB,QAAQ,WAAW;AAC/C,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,cAYa,CAAC,EAAE,YAAY,aAAa,MAAM,OAAO,MAAM;AAAA;AAAA;AAItD,MAAM,cAAc,6BAAO,QAAQ;AAAA,EACxC,MAAM;AAAA,EACN,MAAM,mCAAoB,QAAQ,WAAW;AAC/C,CAAC;AAAA;AAAA;AAAA;AAAA;AAMM,MAAM,kBAAkB,6BAAO,OAAO;AAAA,EAC3C,MAAM;AAAA,EACN,MAAM,mCAAoB,QAAQ,WAAW;AAC/C,CAAC;AAAA;AAAA;AAAA;AAAA;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -28,7 +28,7 @@ var import_ds_system = require("@elliemae/ds-system");
|
|
|
28
28
|
var import_theming = require("../../../../exported-related/theming");
|
|
29
29
|
const StyledNavSearchBoxContainer = (0, import_ds_system.styled)("div", {
|
|
30
30
|
name: import_theming.DSGlobalHeaderName,
|
|
31
|
-
slot: import_theming.
|
|
31
|
+
slot: import_theming.DSGlobalHeaderSlots.MENUBAR.SEARCH_TOGGLE.CONTAINER
|
|
32
32
|
})`
|
|
33
33
|
background: ${({ theme }) => theme.colors.neutral["000"]};
|
|
34
34
|
position: relative;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../src/parts/Toolbar/outOfTheBox/SearchToggle/styles.tsx", "../../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import { styled } from '@elliemae/ds-system';\nimport { DSGlobalHeaderName,
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAAuB;AACvB,
|
|
4
|
+
"sourcesContent": ["import { styled } from '@elliemae/ds-system';\nimport { DSGlobalHeaderName, DSGlobalHeaderSlots } from '../../../../exported-related/theming';\n\nexport const StyledNavSearchBoxContainer = styled('div', {\n name: DSGlobalHeaderName,\n slot: DSGlobalHeaderSlots.MENUBAR.SEARCH_TOGGLE.CONTAINER,\n})`\n background: ${({ theme }) => theme.colors.neutral['000']};\n position: relative;\n min-width: 260px;\n\n & .em-ds-button {\n margin-right: 2px;\n height: 24px;\n width: 24px;\n }\n\n & .em-ds-input {\n border: none;\n outline: none;\n box-shadow: none;\n }\n\n & .em-ds-input:focus {\n border: none;\n box-shadow: none;\n }\n\n & .em-ds-input.em-ds-input--clearable:hover {\n border: none;\n outline: none;\n box-shadow: none;\n }\n\n & .em-ds-input-addon-wrapper {\n box-shadow: none;\n }\n\n & .em-ds-input-addon-wrapper:hover {\n outline: none;\n }\n\n & .em-ds-input-addon-wrapper__addon:hover {\n outline: none;\n }\n\n & .em-ds-input:not(.floating-label-input-controller):hover:active {\n border: none;\n outline: none;\n box-shadow: none;\n }\n`;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAAuB;AACvB,qBAAwD;AAEjD,MAAM,8BAA8B,6BAAO,OAAO;AAAA,EACvD,MAAM;AAAA,EACN,MAAM,mCAAoB,QAAQ,cAAc;AAClD,CAAC;AAAA,gBACe,CAAC,EAAE,YAAY,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -29,12 +29,15 @@ var React = __toESM(require("react"));
|
|
|
29
29
|
var import_ds_system = require("@elliemae/ds-system");
|
|
30
30
|
var import_ds_grid = require("@elliemae/ds-grid");
|
|
31
31
|
var import_theming = require("../../exported-related/theming");
|
|
32
|
-
const StyledMenubarContainer = (0, import_ds_system.styled)("nav", {
|
|
33
|
-
|
|
32
|
+
const StyledMenubarContainer = (0, import_ds_system.styled)("nav", {
|
|
33
|
+
name: import_theming.DSGlobalHeaderName,
|
|
34
|
+
slot: import_theming.DSGlobalHeaderSlots.MENUBAR.CONTAINER
|
|
35
|
+
})``;
|
|
36
|
+
const StyledList = (0, import_ds_system.styled)(import_ds_grid.Grid, { name: import_theming.DSGlobalHeaderName, slot: import_theming.DSGlobalHeaderSlots.MENUBAR.LIST })`
|
|
34
37
|
padding: 0;
|
|
35
38
|
margin: 0;
|
|
36
39
|
`;
|
|
37
|
-
const StyledToolbarItem = (0, import_ds_system.styled)("li", { name: import_theming.DSGlobalHeaderName, slot: import_theming.
|
|
40
|
+
const StyledToolbarItem = (0, import_ds_system.styled)("li", { name: import_theming.DSGlobalHeaderName, slot: import_theming.DSGlobalHeaderSlots.MENUBAR.ITEM })`
|
|
38
41
|
list-style: none;
|
|
39
42
|
`;
|
|
40
43
|
//# sourceMappingURL=styles.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/parts/Toolbar/styles.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import { styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { DSGlobalHeaderName,
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAAuB;AACvB,qBAAqB;AACrB,
|
|
4
|
+
"sourcesContent": ["import { styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { DSGlobalHeaderName, DSGlobalHeaderSlots } from '../../exported-related/theming';\n\nexport const StyledMenubarContainer = styled('nav', {\n name: DSGlobalHeaderName,\n slot: DSGlobalHeaderSlots.MENUBAR.CONTAINER,\n})``;\n\nexport const StyledList = styled(Grid, { name: DSGlobalHeaderName, slot: DSGlobalHeaderSlots.MENUBAR.LIST })`\n padding: 0;\n margin: 0;\n`;\n\nexport const StyledToolbarItem = styled('li', { name: DSGlobalHeaderName, slot: DSGlobalHeaderSlots.MENUBAR.ITEM })`\n list-style: none;\n`;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAAuB;AACvB,qBAAqB;AACrB,qBAAwD;AAEjD,MAAM,yBAAyB,6BAAO,OAAO;AAAA,EAClD,MAAM;AAAA,EACN,MAAM,mCAAoB,QAAQ;AACpC,CAAC;AAEM,MAAM,aAAa,6BAAO,qBAAM,EAAE,MAAM,mCAAoB,MAAM,mCAAoB,QAAQ,KAAK,CAAC;AAAA;AAAA;AAAA;AAKpG,MAAM,oBAAoB,6BAAO,MAAM,EAAE,MAAM,mCAAoB,MAAM,mCAAoB,QAAQ,KAAK,CAAC;AAAA;AAAA;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/cjs/parts/styles.js
CHANGED
|
@@ -28,7 +28,7 @@ var React = __toESM(require("react"));
|
|
|
28
28
|
var import_ds_system = require("@elliemae/ds-system");
|
|
29
29
|
var import_ds_grid = require("@elliemae/ds-grid");
|
|
30
30
|
var import_theming = require("../exported-related/theming");
|
|
31
|
-
const Container = (0, import_ds_system.styled)(import_ds_grid.Grid, { name: import_theming.DSGlobalHeaderName, slot: import_theming.
|
|
31
|
+
const Container = (0, import_ds_system.styled)(import_ds_grid.Grid, { name: import_theming.DSGlobalHeaderName, slot: import_theming.DSGlobalHeaderSlots.CONTAINER })`
|
|
32
32
|
${({ bg, backgroundColor }) => bg || backgroundColor ? "" : "background-image: linear-gradient(45deg, #0f364a 0%, #1b6392 54%, #164566 100%);"}
|
|
33
33
|
color: ${({ theme }) => theme.colors.neutral["000"]};
|
|
34
34
|
height: 40px;
|
|
@@ -38,7 +38,10 @@ const Container = (0, import_ds_system.styled)(import_ds_grid.Grid, { name: impo
|
|
|
38
38
|
${import_ds_system.layout}
|
|
39
39
|
${import_ds_system.background}
|
|
40
40
|
`;
|
|
41
|
-
const StyledButton = (0, import_ds_system.styled)("button", {
|
|
41
|
+
const StyledButton = (0, import_ds_system.styled)("button", {
|
|
42
|
+
name: import_theming.DSGlobalHeaderName,
|
|
43
|
+
slot: import_theming.DSGlobalHeaderSlots.MENUBAR.ITEM_BUTTON
|
|
44
|
+
})`
|
|
42
45
|
height: 40px;
|
|
43
46
|
width: 40px;
|
|
44
47
|
border: none;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/parts/styles.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable @typescript-eslint/no-unsafe-assignment */\nimport { styled, sizing, space, layout, background } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport {
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,uBAA0D;AAC1D,qBAAqB;AACrB,
|
|
4
|
+
"sourcesContent": ["/* eslint-disable @typescript-eslint/no-unsafe-assignment */\nimport { styled, sizing, space, layout, background } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { DSGlobalHeaderSlots, DSGlobalHeaderName } from '../exported-related/theming';\n\nexport const Container = styled(Grid, { name: DSGlobalHeaderName, slot: DSGlobalHeaderSlots.CONTAINER })`\n ${({ bg, backgroundColor }) =>\n bg || backgroundColor ? '' : 'background-image: linear-gradient(45deg, #0f364a 0%, #1b6392 54%, #164566 100%);'}\n color: ${({ theme }) => theme.colors.neutral['000']};\n height: 40px;\n padding: 0 24px 0 12px;\n ${sizing}\n ${space}\n ${layout}\n ${background}\n`;\n\nexport const StyledButton = styled('button', {\n name: DSGlobalHeaderName,\n slot: DSGlobalHeaderSlots.MENUBAR.ITEM_BUTTON,\n})`\n height: 40px;\n width: 40px;\n border: none;\n background-color: transparent;\n cursor: pointer;\n position: relative;\n outline: none;\n fill: ${({ theme }) => theme.colors.neutral['000']};\n &:hover:not(:focus) {\n background-color: ${({ theme }) => theme.colors.brand[700]};\n outline: none;\n }\n &:focus {\n :before {\n content: '';\n position: absolute;\n z-index: 2;\n top: 2px;\n left: 2px;\n width: calc(100% - 4px);\n height: calc(100% - 4px);\n border: 2px solid ${({ theme }) => theme.colors.neutral['000']};\n border-radius: 4px;\n }\n }\n`;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,uBAA0D;AAC1D,qBAAqB;AACrB,qBAAwD;AAEjD,MAAM,YAAY,6BAAO,qBAAM,EAAE,MAAM,mCAAoB,MAAM,mCAAoB,UAAU,CAAC;AAAA,IACnG,CAAC,EAAE,IAAI,sBACP,MAAM,kBAAkB,KAAK;AAAA,WACtB,CAAC,EAAE,YAAY,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA,IAG3C;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAGG,MAAM,eAAe,6BAAO,UAAU;AAAA,EAC3C,MAAM;AAAA,EACN,MAAM,mCAAoB,QAAQ;AACpC,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,UAQS,CAAC,EAAE,YAAY,MAAM,OAAO,QAAQ;AAAA;AAAA,wBAEtB,CAAC,EAAE,YAAY,MAAM,OAAO,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,0BAYhC,CAAC,EAAE,YAAY,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
2
|
const DSGlobalHeaderName = "DSGlobalHeader";
|
|
3
|
-
const
|
|
3
|
+
const DSGlobalHeaderSlots = {
|
|
4
4
|
CONTAINER: "root",
|
|
5
5
|
LOGO: {
|
|
6
6
|
CONTAINER: "logo-container"
|
|
@@ -33,6 +33,6 @@ const slots = {
|
|
|
33
33
|
};
|
|
34
34
|
export {
|
|
35
35
|
DSGlobalHeaderName,
|
|
36
|
-
|
|
36
|
+
DSGlobalHeaderSlots
|
|
37
37
|
};
|
|
38
38
|
//# sourceMappingURL=theming.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/exported-related/theming.ts"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export const DSGlobalHeaderName = 'DSGlobalHeader';\n\nexport const
|
|
5
|
-
"mappings": "AAAA;ACAO,MAAM,qBAAqB;AAE3B,MAAM,
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export const DSGlobalHeaderName = 'DSGlobalHeader';\n\nexport const DSGlobalHeaderSlots = {\n CONTAINER: 'root',\n LOGO: {\n CONTAINER: 'logo-container',\n },\n BREADCRUMB: {\n CONTAINER: 'breadcrumb-container',\n PIPE: 'breadcrumb-pipe',\n CHEVRON: 'breadcrumb-chevron',\n LIST: 'breadcrumb-list',\n ITEM: 'breadcrumb-item',\n ITEM_LINK: 'breadcrumb-item-link',\n ITEM_LINK_LABEL: 'breadcrumb-item-link-label',\n },\n MENUBAR: {\n CONTAINER: 'menubar-container',\n LIST: 'menubar-list',\n ITEM: 'menubar-item',\n ITEM_BUTTON: 'menubar-item-button',\n POPUP_MENU: {\n LIST: 'menubar-item-popupmenu-list',\n ITEM: 'menubar-item-popupmenu-item',\n ITEM_BUTTON: 'menubar-item-popupmenu-item-button',\n SEPARATOR: 'menubar-item-popupmenu-separator',\n ITEM_BUTTON_LABEL: 'menubar-item-popupmenu-item-label',\n },\n SEARCH_TOGGLE: {\n CONTAINER: 'menubar-item-searchtoggle-container',\n },\n },\n};\n"],
|
|
5
|
+
"mappings": "AAAA;ACAO,MAAM,qBAAqB;AAE3B,MAAM,sBAAsB;AAAA,EACjC,WAAW;AAAA,EACX,MAAM;AAAA,IACJ,WAAW;AAAA,EACb;AAAA,EACA,YAAY;AAAA,IACV,WAAW;AAAA,IACX,MAAM;AAAA,IACN,SAAS;AAAA,IACT,MAAM;AAAA,IACN,MAAM;AAAA,IACN,WAAW;AAAA,IACX,iBAAiB;AAAA,EACnB;AAAA,EACA,SAAS;AAAA,IACP,WAAW;AAAA,IACX,MAAM;AAAA,IACN,MAAM;AAAA,IACN,aAAa;AAAA,IACb,YAAY;AAAA,MACV,MAAM;AAAA,MACN,MAAM;AAAA,MACN,aAAa;AAAA,MACb,WAAW;AAAA,MACX,mBAAmB;AAAA,IACrB;AAAA,IACA,eAAe;AAAA,MACb,WAAW;AAAA,IACb;AAAA,EACF;AACF;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -2,9 +2,15 @@ import * as React from "react";
|
|
|
2
2
|
import { styled } from "@elliemae/ds-system";
|
|
3
3
|
import { Grid } from "@elliemae/ds-grid";
|
|
4
4
|
import { ChevronSmallRight } from "@elliemae/ds-icons";
|
|
5
|
-
import { DSGlobalHeaderName,
|
|
6
|
-
const StyledBreadcrumbContainer = styled(Grid, {
|
|
7
|
-
|
|
5
|
+
import { DSGlobalHeaderName, DSGlobalHeaderSlots } from "../../exported-related/theming";
|
|
6
|
+
const StyledBreadcrumbContainer = styled(Grid, {
|
|
7
|
+
name: DSGlobalHeaderName,
|
|
8
|
+
slot: DSGlobalHeaderSlots.BREADCRUMB.CONTAINER
|
|
9
|
+
})``;
|
|
10
|
+
const StyledBreadcrumbList = styled("ul", {
|
|
11
|
+
name: DSGlobalHeaderName,
|
|
12
|
+
slot: DSGlobalHeaderSlots.BREADCRUMB.LIST
|
|
13
|
+
})`
|
|
8
14
|
display: grid;
|
|
9
15
|
grid-auto-flow: column;
|
|
10
16
|
min-width: fit-content;
|
|
@@ -13,23 +19,29 @@ const StyledBreadcrumbList = styled("ul", { name: DSGlobalHeaderName, slot: slot
|
|
|
13
19
|
padding: 0;
|
|
14
20
|
height: 100%;
|
|
15
21
|
`;
|
|
16
|
-
const StyledPipe = styled("span", {
|
|
22
|
+
const StyledPipe = styled("span", {
|
|
23
|
+
name: DSGlobalHeaderName,
|
|
24
|
+
slot: DSGlobalHeaderSlots.BREADCRUMB.PIPE
|
|
25
|
+
})`
|
|
17
26
|
margin: 0 7px 0 0;
|
|
18
27
|
border-left: ${({ theme, showIconOnly }) => showIconOnly ? "none" : `1px solid ${theme.colors.neutral["000"]}`};
|
|
19
28
|
height: 20px;
|
|
20
29
|
`;
|
|
21
30
|
const StyledChevron = styled(ChevronSmallRight, {
|
|
22
31
|
name: DSGlobalHeaderName,
|
|
23
|
-
slot:
|
|
32
|
+
slot: DSGlobalHeaderSlots.BREADCRUMB.CHEVRON
|
|
24
33
|
})`
|
|
25
34
|
fill: ${({ theme }) => theme.colors.neutral["000"]};
|
|
26
35
|
`;
|
|
27
|
-
const StyledBreadcrumbItem = styled("li", {
|
|
36
|
+
const StyledBreadcrumbItem = styled("li", {
|
|
37
|
+
name: DSGlobalHeaderName,
|
|
38
|
+
slot: DSGlobalHeaderSlots.BREADCRUMB.ITEM
|
|
39
|
+
})`
|
|
28
40
|
display: flex;
|
|
29
41
|
align-items: center;
|
|
30
42
|
height: 40px;
|
|
31
43
|
`;
|
|
32
|
-
const StyledLink = styled("a", { name: DSGlobalHeaderName, slot:
|
|
44
|
+
const StyledLink = styled("a", { name: DSGlobalHeaderName, slot: DSGlobalHeaderSlots.BREADCRUMB.ITEM_LINK })`
|
|
33
45
|
width: fit-content;
|
|
34
46
|
height: 40px;
|
|
35
47
|
display: grid;
|
|
@@ -55,7 +67,10 @@ const StyledLink = styled("a", { name: DSGlobalHeaderName, slot: slots.BREADCRUM
|
|
|
55
67
|
}
|
|
56
68
|
}
|
|
57
69
|
`;
|
|
58
|
-
const StyledLabel = styled("span", {
|
|
70
|
+
const StyledLabel = styled("span", {
|
|
71
|
+
name: DSGlobalHeaderName,
|
|
72
|
+
slot: DSGlobalHeaderSlots.BREADCRUMB.ITEM_LINK_LABEL
|
|
73
|
+
})`
|
|
59
74
|
color: ${({ theme }) => theme.colors.neutral["000"]};
|
|
60
75
|
${({ theme, isSelected }) => `-webkit-text-stroke: 0.4px ${isSelected ? theme.colors.neutral["000"] : "transparent"}`};
|
|
61
76
|
font-size: 16px;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/Breadcrumb/styles.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable @typescript-eslint/no-unsafe-assignment */\nimport { styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { ChevronSmallRight } from '@elliemae/ds-icons';\nimport { DSGlobalHeaderName,
|
|
5
|
-
"mappings": "AAAA;ACCA;AACA;AACA;AACA;AAeO,MAAM,4BAA4B,OAAO,MAAM,
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable @typescript-eslint/no-unsafe-assignment */\nimport { styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { ChevronSmallRight } from '@elliemae/ds-icons';\nimport { DSGlobalHeaderName, DSGlobalHeaderSlots } from '../../exported-related/theming';\n\ninterface PipeT {\n showIconOnly: boolean;\n}\n\ninterface ChevronT {\n size: string;\n}\n\ninterface LabelT {\n isSelected: boolean;\n isOnlyItem: boolean;\n}\n\nexport const StyledBreadcrumbContainer = styled(Grid, {\n name: DSGlobalHeaderName,\n slot: DSGlobalHeaderSlots.BREADCRUMB.CONTAINER,\n})``;\n\nexport const StyledBreadcrumbList = styled('ul', {\n name: DSGlobalHeaderName,\n slot: DSGlobalHeaderSlots.BREADCRUMB.LIST,\n})`\n display: grid;\n grid-auto-flow: column;\n min-width: fit-content;\n align-items: center;\n margin: 0;\n padding: 0;\n height: 100%;\n`;\n\nexport const StyledPipe = styled('span', {\n name: DSGlobalHeaderName,\n slot: DSGlobalHeaderSlots.BREADCRUMB.PIPE,\n})<PipeT>`\n margin: 0 7px 0 0;\n border-left: ${({ theme, showIconOnly }) => (showIconOnly ? 'none' : `1px solid ${theme.colors.neutral['000']}`)};\n height: 20px;\n`;\n\nexport const StyledChevron = styled(ChevronSmallRight, {\n name: DSGlobalHeaderName,\n slot: DSGlobalHeaderSlots.BREADCRUMB.CHEVRON,\n})<ChevronT>`\n fill: ${({ theme }) => theme.colors.neutral['000']};\n`;\n\nexport const StyledBreadcrumbItem = styled('li', {\n name: DSGlobalHeaderName,\n slot: DSGlobalHeaderSlots.BREADCRUMB.ITEM,\n})`\n display: flex;\n align-items: center;\n height: 40px;\n`;\n\nexport const StyledLink = styled('a', { name: DSGlobalHeaderName, slot: DSGlobalHeaderSlots.BREADCRUMB.ITEM_LINK })`\n width: fit-content;\n height: 40px;\n display: grid;\n place-items: center;\n margin: 0;\n padding: 0;\n border: 1px solid transparent;\n background-color: transparent;\n outline: none;\n cursor: pointer;\n position: relative;\n &:focus {\n :before {\n content: '';\n position: absolute;\n z-index: 2;\n top: 2px;\n left: -5px;\n width: calc(100% + 10px);\n height: calc(100% - 4px);\n border: 2px solid ${({ theme }) => theme.colors.neutral['000']};\n border-radius: 4px;\n }\n }\n`;\n\nexport const StyledLabel = styled('span', {\n name: DSGlobalHeaderName,\n slot: DSGlobalHeaderSlots.BREADCRUMB.ITEM_LINK_LABEL,\n})<LabelT>`\n color: ${({ theme }) => theme.colors.neutral['000']};\n ${({ theme, isSelected }) =>\n `-webkit-text-stroke: 0.4px ${isSelected ? theme.colors.neutral['000'] : 'transparent'}`};\n font-size: 16px;\n line-height: 1;\n text-transform: uppercase;\n border-bottom: ${({ theme, isSelected, isOnlyItem }) =>\n `2px solid ${isSelected && !isOnlyItem ? theme.colors.neutral['000'] : 'transparent'}`};\n margin: 3px 5px 0 5px;\n :hover {\n ${({ theme }) => `-webkit-text-stroke: 0.4px ${theme.colors.neutral['000']}`};\n }\n`;\n"],
|
|
5
|
+
"mappings": "AAAA;ACCA;AACA;AACA;AACA;AAeO,MAAM,4BAA4B,OAAO,MAAM;AAAA,EACpD,MAAM;AAAA,EACN,MAAM,oBAAoB,WAAW;AACvC,CAAC;AAEM,MAAM,uBAAuB,OAAO,MAAM;AAAA,EAC/C,MAAM;AAAA,EACN,MAAM,oBAAoB,WAAW;AACvC,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAUM,MAAM,aAAa,OAAO,QAAQ;AAAA,EACvC,MAAM;AAAA,EACN,MAAM,oBAAoB,WAAW;AACvC,CAAC;AAAA;AAAA,iBAEgB,CAAC,EAAE,OAAO,mBAAoB,eAAe,SAAS,aAAa,MAAM,OAAO,QAAQ;AAAA;AAAA;AAIlG,MAAM,gBAAgB,OAAO,mBAAmB;AAAA,EACrD,MAAM;AAAA,EACN,MAAM,oBAAoB,WAAW;AACvC,CAAC;AAAA,UACS,CAAC,EAAE,YAAY,MAAM,OAAO,QAAQ;AAAA;AAGvC,MAAM,uBAAuB,OAAO,MAAM;AAAA,EAC/C,MAAM;AAAA,EACN,MAAM,oBAAoB,WAAW;AACvC,CAAC;AAAA;AAAA;AAAA;AAAA;AAMM,MAAM,aAAa,OAAO,KAAK,EAAE,MAAM,oBAAoB,MAAM,oBAAoB,WAAW,UAAU,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,0BAqBxF,CAAC,EAAE,YAAY,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA;AAMvD,MAAM,cAAc,OAAO,QAAQ;AAAA,EACxC,MAAM;AAAA,EACN,MAAM,oBAAoB,WAAW;AACvC,CAAC;AAAA,WACU,CAAC,EAAE,YAAY,MAAM,OAAO,QAAQ;AAAA,IAC3C,CAAC,EAAE,OAAO,iBACV,+BAA+B,aAAa,MAAM,OAAO,QAAQ,SAAS;AAAA;AAAA;AAAA;AAAA,mBAI3D,CAAC,EAAE,OAAO,YAAY,iBACrC,aAAa,cAAc,CAAC,aAAa,MAAM,OAAO,QAAQ,SAAS;AAAA;AAAA;AAAA,MAGrE,CAAC,EAAE,YAAY,8BAA8B,MAAM,OAAO,QAAQ;AAAA;AAAA;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,8 +1,11 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
2
|
import { styled } from "@elliemae/ds-system";
|
|
3
3
|
import { Grid } from "@elliemae/ds-grid";
|
|
4
|
-
import { DSGlobalHeaderName,
|
|
5
|
-
const StyledLogoContainer = styled(Grid, {
|
|
4
|
+
import { DSGlobalHeaderName, DSGlobalHeaderSlots } from "../../exported-related/theming";
|
|
5
|
+
const StyledLogoContainer = styled(Grid, {
|
|
6
|
+
name: DSGlobalHeaderName,
|
|
7
|
+
slot: DSGlobalHeaderSlots.LOGO.CONTAINER
|
|
8
|
+
})``;
|
|
6
9
|
export {
|
|
7
10
|
StyledLogoContainer
|
|
8
11
|
};
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/Logo/styles.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { DSGlobalHeaderName,
|
|
5
|
-
"mappings": "AAAA;ACAA;AACA;AACA;AAEO,MAAM,sBAAsB,OAAO,MAAM,
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { DSGlobalHeaderName, DSGlobalHeaderSlots } from '../../exported-related/theming';\n\nexport const StyledLogoContainer = styled(Grid, {\n name: DSGlobalHeaderName,\n slot: DSGlobalHeaderSlots.LOGO.CONTAINER,\n})``;\n"],
|
|
5
|
+
"mappings": "AAAA;ACAA;AACA;AACA;AAEO,MAAM,sBAAsB,OAAO,MAAM;AAAA,EAC9C,MAAM;AAAA,EACN,MAAM,oBAAoB,KAAK;AACjC,CAAC;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,15 +1,21 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
2
|
import { styled } from "@elliemae/ds-system";
|
|
3
|
-
import { DSGlobalHeaderName,
|
|
4
|
-
const StyledList = styled("ul", { name: DSGlobalHeaderName, slot:
|
|
3
|
+
import { DSGlobalHeaderName, DSGlobalHeaderSlots } from "../../../../../exported-related/theming";
|
|
4
|
+
const StyledList = styled("ul", { name: DSGlobalHeaderName, slot: DSGlobalHeaderSlots.MENUBAR.POPUP_MENU.LIST })`
|
|
5
5
|
padding: 5px 0px;
|
|
6
6
|
margin: 0;
|
|
7
7
|
background: white;
|
|
8
8
|
`;
|
|
9
|
-
const StyledItemContainer = styled("li", {
|
|
9
|
+
const StyledItemContainer = styled("li", {
|
|
10
|
+
name: DSGlobalHeaderName,
|
|
11
|
+
slot: DSGlobalHeaderSlots.MENUBAR.POPUP_MENU.ITEM
|
|
12
|
+
})`
|
|
10
13
|
list-style: none;
|
|
11
14
|
`;
|
|
12
|
-
const StyledItemButton = styled("button", {
|
|
15
|
+
const StyledItemButton = styled("button", {
|
|
16
|
+
name: DSGlobalHeaderName,
|
|
17
|
+
slot: DSGlobalHeaderSlots.MENUBAR.POPUP_MENU.ITEM_BUTTON
|
|
18
|
+
})`
|
|
13
19
|
display: flex;
|
|
14
20
|
align-items: center;
|
|
15
21
|
justify-content: center;
|
|
@@ -24,12 +30,18 @@ const StyledItemButton = styled("button", { name: DSGlobalHeaderName, slot: slot
|
|
|
24
30
|
border: ${({ theme }) => `1px solid ${theme.colors.brand[600]}`};
|
|
25
31
|
}
|
|
26
32
|
`;
|
|
27
|
-
const StyledLabel = styled("span", {
|
|
33
|
+
const StyledLabel = styled("span", {
|
|
34
|
+
name: DSGlobalHeaderName,
|
|
35
|
+
slot: DSGlobalHeaderSlots.MENUBAR.POPUP_MENU.ITEM_BUTTON_LABEL
|
|
36
|
+
})`
|
|
28
37
|
width: 100%;
|
|
29
38
|
font-size: 14px;
|
|
30
39
|
margin: 10px;
|
|
31
40
|
`;
|
|
32
|
-
const StyledSeparator = styled("div", {
|
|
41
|
+
const StyledSeparator = styled("div", {
|
|
42
|
+
name: DSGlobalHeaderName,
|
|
43
|
+
slot: DSGlobalHeaderSlots.MENUBAR.POPUP_MENU.SEPARATOR
|
|
44
|
+
})`
|
|
33
45
|
width: 100%;
|
|
34
46
|
border: none;
|
|
35
47
|
border-bottom: 1px solid #ccc;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../../../../scripts/build/transpile/react-shim.js", "../../../../../../../src/parts/Toolbar/outOfTheBox/PopupMenu/menuContent/styles.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { styled } from '@elliemae/ds-system';\nimport { DSGlobalHeaderName,
|
|
5
|
-
"mappings": "AAAA;ACAA;AACA;AAEO,MAAM,aAAa,OAAO,MAAM,EAAE,MAAM,oBAAoB,MAAM,
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { styled } from '@elliemae/ds-system';\nimport { DSGlobalHeaderName, DSGlobalHeaderSlots } from '../../../../../exported-related/theming';\n\nexport const StyledList = styled('ul', { name: DSGlobalHeaderName, slot: DSGlobalHeaderSlots.MENUBAR.POPUP_MENU.LIST })`\n padding: 5px 0px;\n margin: 0;\n background: white;\n`;\n\nexport const StyledItemContainer = styled('li', {\n name: DSGlobalHeaderName,\n slot: DSGlobalHeaderSlots.MENUBAR.POPUP_MENU.ITEM,\n})`\n list-style: none;\n`;\n\nexport const StyledItemButton = styled('button', {\n name: DSGlobalHeaderName,\n slot: DSGlobalHeaderSlots.MENUBAR.POPUP_MENU.ITEM_BUTTON,\n})`\n display: flex;\n align-items: center;\n justify-content: center;\n width: 100%;\n padding: 0 20px;\n cursor: pointer;\n border: 1px solid transparent;\n background-color: transparent;\n outline: none;\n :hover,\n :focus {\n border: ${({ theme }) => `1px solid ${theme.colors.brand[600]}`};\n }\n`;\n\nexport const StyledLabel = styled('span', {\n name: DSGlobalHeaderName,\n slot: DSGlobalHeaderSlots.MENUBAR.POPUP_MENU.ITEM_BUTTON_LABEL,\n})`\n width: 100%;\n font-size: 14px;\n margin: 10px;\n`;\n\nexport const StyledSeparator = styled('div', {\n name: DSGlobalHeaderName,\n slot: DSGlobalHeaderSlots.MENUBAR.POPUP_MENU.SEPARATOR,\n})`\n width: 100%;\n border: none;\n border-bottom: 1px solid #ccc;\n`;\n"],
|
|
5
|
+
"mappings": "AAAA;ACAA;AACA;AAEO,MAAM,aAAa,OAAO,MAAM,EAAE,MAAM,oBAAoB,MAAM,oBAAoB,QAAQ,WAAW,KAAK,CAAC;AAAA;AAAA;AAAA;AAAA;AAM/G,MAAM,sBAAsB,OAAO,MAAM;AAAA,EAC9C,MAAM;AAAA,EACN,MAAM,oBAAoB,QAAQ,WAAW;AAC/C,CAAC;AAAA;AAAA;AAIM,MAAM,mBAAmB,OAAO,UAAU;AAAA,EAC/C,MAAM;AAAA,EACN,MAAM,oBAAoB,QAAQ,WAAW;AAC/C,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,cAYa,CAAC,EAAE,YAAY,aAAa,MAAM,OAAO,MAAM;AAAA;AAAA;AAItD,MAAM,cAAc,OAAO,QAAQ;AAAA,EACxC,MAAM;AAAA,EACN,MAAM,oBAAoB,QAAQ,WAAW;AAC/C,CAAC;AAAA;AAAA;AAAA;AAAA;AAMM,MAAM,kBAAkB,OAAO,OAAO;AAAA,EAC3C,MAAM;AAAA,EACN,MAAM,oBAAoB,QAAQ,WAAW;AAC/C,CAAC;AAAA;AAAA;AAAA;AAAA;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
2
|
import { styled } from "@elliemae/ds-system";
|
|
3
|
-
import { DSGlobalHeaderName,
|
|
3
|
+
import { DSGlobalHeaderName, DSGlobalHeaderSlots } from "../../../../exported-related/theming";
|
|
4
4
|
const StyledNavSearchBoxContainer = styled("div", {
|
|
5
5
|
name: DSGlobalHeaderName,
|
|
6
|
-
slot:
|
|
6
|
+
slot: DSGlobalHeaderSlots.MENUBAR.SEARCH_TOGGLE.CONTAINER
|
|
7
7
|
})`
|
|
8
8
|
background: ${({ theme }) => theme.colors.neutral["000"]};
|
|
9
9
|
position: relative;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../../../scripts/build/transpile/react-shim.js", "../../../../../../src/parts/Toolbar/outOfTheBox/SearchToggle/styles.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { styled } from '@elliemae/ds-system';\nimport { DSGlobalHeaderName,
|
|
5
|
-
"mappings": "AAAA;ACAA;AACA;AAEO,MAAM,8BAA8B,OAAO,OAAO;AAAA,EACvD,MAAM;AAAA,EACN,MAAM,
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { styled } from '@elliemae/ds-system';\nimport { DSGlobalHeaderName, DSGlobalHeaderSlots } from '../../../../exported-related/theming';\n\nexport const StyledNavSearchBoxContainer = styled('div', {\n name: DSGlobalHeaderName,\n slot: DSGlobalHeaderSlots.MENUBAR.SEARCH_TOGGLE.CONTAINER,\n})`\n background: ${({ theme }) => theme.colors.neutral['000']};\n position: relative;\n min-width: 260px;\n\n & .em-ds-button {\n margin-right: 2px;\n height: 24px;\n width: 24px;\n }\n\n & .em-ds-input {\n border: none;\n outline: none;\n box-shadow: none;\n }\n\n & .em-ds-input:focus {\n border: none;\n box-shadow: none;\n }\n\n & .em-ds-input.em-ds-input--clearable:hover {\n border: none;\n outline: none;\n box-shadow: none;\n }\n\n & .em-ds-input-addon-wrapper {\n box-shadow: none;\n }\n\n & .em-ds-input-addon-wrapper:hover {\n outline: none;\n }\n\n & .em-ds-input-addon-wrapper__addon:hover {\n outline: none;\n }\n\n & .em-ds-input:not(.floating-label-input-controller):hover:active {\n border: none;\n outline: none;\n box-shadow: none;\n }\n`;\n"],
|
|
5
|
+
"mappings": "AAAA;ACAA;AACA;AAEO,MAAM,8BAA8B,OAAO,OAAO;AAAA,EACvD,MAAM;AAAA,EACN,MAAM,oBAAoB,QAAQ,cAAc;AAClD,CAAC;AAAA,gBACe,CAAC,EAAE,YAAY,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,13 +1,16 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
2
|
import { styled } from "@elliemae/ds-system";
|
|
3
3
|
import { Grid } from "@elliemae/ds-grid";
|
|
4
|
-
import { DSGlobalHeaderName,
|
|
5
|
-
const StyledMenubarContainer = styled("nav", {
|
|
6
|
-
|
|
4
|
+
import { DSGlobalHeaderName, DSGlobalHeaderSlots } from "../../exported-related/theming";
|
|
5
|
+
const StyledMenubarContainer = styled("nav", {
|
|
6
|
+
name: DSGlobalHeaderName,
|
|
7
|
+
slot: DSGlobalHeaderSlots.MENUBAR.CONTAINER
|
|
8
|
+
})``;
|
|
9
|
+
const StyledList = styled(Grid, { name: DSGlobalHeaderName, slot: DSGlobalHeaderSlots.MENUBAR.LIST })`
|
|
7
10
|
padding: 0;
|
|
8
11
|
margin: 0;
|
|
9
12
|
`;
|
|
10
|
-
const StyledToolbarItem = styled("li", { name: DSGlobalHeaderName, slot:
|
|
13
|
+
const StyledToolbarItem = styled("li", { name: DSGlobalHeaderName, slot: DSGlobalHeaderSlots.MENUBAR.ITEM })`
|
|
11
14
|
list-style: none;
|
|
12
15
|
`;
|
|
13
16
|
export {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/Toolbar/styles.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { DSGlobalHeaderName,
|
|
5
|
-
"mappings": "AAAA;ACAA;AACA;AACA;AAEO,MAAM,yBAAyB,OAAO,OAAO,
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { DSGlobalHeaderName, DSGlobalHeaderSlots } from '../../exported-related/theming';\n\nexport const StyledMenubarContainer = styled('nav', {\n name: DSGlobalHeaderName,\n slot: DSGlobalHeaderSlots.MENUBAR.CONTAINER,\n})``;\n\nexport const StyledList = styled(Grid, { name: DSGlobalHeaderName, slot: DSGlobalHeaderSlots.MENUBAR.LIST })`\n padding: 0;\n margin: 0;\n`;\n\nexport const StyledToolbarItem = styled('li', { name: DSGlobalHeaderName, slot: DSGlobalHeaderSlots.MENUBAR.ITEM })`\n list-style: none;\n`;\n"],
|
|
5
|
+
"mappings": "AAAA;ACAA;AACA;AACA;AAEO,MAAM,yBAAyB,OAAO,OAAO;AAAA,EAClD,MAAM;AAAA,EACN,MAAM,oBAAoB,QAAQ;AACpC,CAAC;AAEM,MAAM,aAAa,OAAO,MAAM,EAAE,MAAM,oBAAoB,MAAM,oBAAoB,QAAQ,KAAK,CAAC;AAAA;AAAA;AAAA;AAKpG,MAAM,oBAAoB,OAAO,MAAM,EAAE,MAAM,oBAAoB,MAAM,oBAAoB,QAAQ,KAAK,CAAC;AAAA;AAAA;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/esm/parts/styles.js
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
2
|
import { styled, sizing, space, layout, background } from "@elliemae/ds-system";
|
|
3
3
|
import { Grid } from "@elliemae/ds-grid";
|
|
4
|
-
import {
|
|
5
|
-
const Container = styled(Grid, { name: DSGlobalHeaderName, slot:
|
|
4
|
+
import { DSGlobalHeaderSlots, DSGlobalHeaderName } from "../exported-related/theming";
|
|
5
|
+
const Container = styled(Grid, { name: DSGlobalHeaderName, slot: DSGlobalHeaderSlots.CONTAINER })`
|
|
6
6
|
${({ bg, backgroundColor }) => bg || backgroundColor ? "" : "background-image: linear-gradient(45deg, #0f364a 0%, #1b6392 54%, #164566 100%);"}
|
|
7
7
|
color: ${({ theme }) => theme.colors.neutral["000"]};
|
|
8
8
|
height: 40px;
|
|
@@ -12,7 +12,10 @@ const Container = styled(Grid, { name: DSGlobalHeaderName, slot: slots.CONTAINER
|
|
|
12
12
|
${layout}
|
|
13
13
|
${background}
|
|
14
14
|
`;
|
|
15
|
-
const StyledButton = styled("button", {
|
|
15
|
+
const StyledButton = styled("button", {
|
|
16
|
+
name: DSGlobalHeaderName,
|
|
17
|
+
slot: DSGlobalHeaderSlots.MENUBAR.ITEM_BUTTON
|
|
18
|
+
})`
|
|
16
19
|
height: 40px;
|
|
17
20
|
width: 40px;
|
|
18
21
|
border: none;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/styles.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable @typescript-eslint/no-unsafe-assignment */\nimport { styled, sizing, space, layout, background } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport {
|
|
5
|
-
"mappings": "AAAA;ACCA;AACA;AACA;AAEO,MAAM,YAAY,OAAO,MAAM,EAAE,MAAM,oBAAoB,MAAM,
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable @typescript-eslint/no-unsafe-assignment */\nimport { styled, sizing, space, layout, background } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { DSGlobalHeaderSlots, DSGlobalHeaderName } from '../exported-related/theming';\n\nexport const Container = styled(Grid, { name: DSGlobalHeaderName, slot: DSGlobalHeaderSlots.CONTAINER })`\n ${({ bg, backgroundColor }) =>\n bg || backgroundColor ? '' : 'background-image: linear-gradient(45deg, #0f364a 0%, #1b6392 54%, #164566 100%);'}\n color: ${({ theme }) => theme.colors.neutral['000']};\n height: 40px;\n padding: 0 24px 0 12px;\n ${sizing}\n ${space}\n ${layout}\n ${background}\n`;\n\nexport const StyledButton = styled('button', {\n name: DSGlobalHeaderName,\n slot: DSGlobalHeaderSlots.MENUBAR.ITEM_BUTTON,\n})`\n height: 40px;\n width: 40px;\n border: none;\n background-color: transparent;\n cursor: pointer;\n position: relative;\n outline: none;\n fill: ${({ theme }) => theme.colors.neutral['000']};\n &:hover:not(:focus) {\n background-color: ${({ theme }) => theme.colors.brand[700]};\n outline: none;\n }\n &:focus {\n :before {\n content: '';\n position: absolute;\n z-index: 2;\n top: 2px;\n left: 2px;\n width: calc(100% - 4px);\n height: calc(100% - 4px);\n border: 2px solid ${({ theme }) => theme.colors.neutral['000']};\n border-radius: 4px;\n }\n }\n`;\n"],
|
|
5
|
+
"mappings": "AAAA;ACCA;AACA;AACA;AAEO,MAAM,YAAY,OAAO,MAAM,EAAE,MAAM,oBAAoB,MAAM,oBAAoB,UAAU,CAAC;AAAA,IACnG,CAAC,EAAE,IAAI,sBACP,MAAM,kBAAkB,KAAK;AAAA,WACtB,CAAC,EAAE,YAAY,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA,IAG3C;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAGG,MAAM,eAAe,OAAO,UAAU;AAAA,EAC3C,MAAM;AAAA,EACN,MAAM,oBAAoB,QAAQ;AACpC,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,UAQS,CAAC,EAAE,YAAY,MAAM,OAAO,QAAQ;AAAA;AAAA,wBAEtB,CAAC,EAAE,YAAY,MAAM,OAAO,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,0BAYhC,CAAC,EAAE,YAAY,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@elliemae/ds-global-header",
|
|
3
|
-
"version": "3.1.0
|
|
3
|
+
"version": "3.1.0",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"description": "ICE MT - Dimsum - Global Header",
|
|
6
6
|
"files": [
|
|
@@ -135,13 +135,13 @@
|
|
|
135
135
|
"indent": 4
|
|
136
136
|
},
|
|
137
137
|
"dependencies": {
|
|
138
|
-
"@elliemae/ds-app-picker": "3.1.0
|
|
139
|
-
"@elliemae/ds-form": "3.1.0
|
|
140
|
-
"@elliemae/ds-grid": "3.1.0
|
|
141
|
-
"@elliemae/ds-icons": "3.1.0
|
|
142
|
-
"@elliemae/ds-popperjs": "3.1.0
|
|
143
|
-
"@elliemae/ds-system": "3.1.0
|
|
144
|
-
"@elliemae/ds-utilities": "3.1.0
|
|
138
|
+
"@elliemae/ds-app-picker": "3.1.0",
|
|
139
|
+
"@elliemae/ds-form": "3.1.0",
|
|
140
|
+
"@elliemae/ds-grid": "3.1.0",
|
|
141
|
+
"@elliemae/ds-icons": "3.1.0",
|
|
142
|
+
"@elliemae/ds-popperjs": "3.1.0",
|
|
143
|
+
"@elliemae/ds-system": "3.1.0",
|
|
144
|
+
"@elliemae/ds-utilities": "3.1.0",
|
|
145
145
|
"uid": "~2.0.0"
|
|
146
146
|
},
|
|
147
147
|
"devDependencies": {
|