@zonos/amino 5.1.55 → 5.1.56

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.
@@ -1 +1 @@
1
- "use strict";var e=require("../../_tslib-ccfac372.js"),n=require("react/jsx-runtime"),r=require("styled-components"),t=require("../input/SearchInput.js");require("./NavigationGroup.js");var i=require("../../styles/constants/theme.js");function o(e){return e&&e.__esModule?e:{default:e}}require("react"),require("../../icons/SearchIcon.js"),require("../../icons/icon-base/_IconBase.js"),require("../collapse/Collapse.js"),require("@mui/material/Collapse");var a,d,h,l,s,b,c,m,g,p,u=o(r),x=u.default.div(a||(a=e.__makeTemplateObject(["\n box-sizing: border-box;\n width: ",";\n"],["\n box-sizing: border-box;\n width: ",";\n"])),i.theme.sidebarWidth),f=u.default.div(d||(d=e.__makeTemplateObject(["\n padding: ",";\n box-sizing: border-box;\n overflow-y: auto;\n height: 100%;\n width: 100%;\n display: flex;\n flex-direction: column;\n"],["\n padding: ",";\n box-sizing: border-box;\n overflow-y: auto;\n height: 100%;\n width: 100%;\n display: flex;\n flex-direction: column;\n"])),i.theme.space16),j=u.default.div(h||(h=e.__makeTemplateObject(["\n margin-bottom: ",";\n"],["\n margin-bottom: ",";\n"])),i.theme.space40),v=u.default.div(l||(l=e.__makeTemplateObject(["\n margin-bottom: ",";\n"],["\n margin-bottom: ",";\n"])),i.theme.space24),_=u.default(t.SearchInput)(s||(s=e.__makeTemplateObject(["\n border: 0;\n svg {\n color: ",";\n }\n input {\n background-color: ",";\n border: 0;\n ::placeholder {\n color: ",";\n }\n }\n"],["\n border: 0;\n svg {\n color: ",";\n }\n input {\n background-color: ",";\n border: 0;\n ::placeholder {\n color: ",";\n }\n }\n"])),i.theme.gray1200,i.theme.gray100,i.theme.gray1200),y=u.default.nav(b||(b=e.__makeTemplateObject(["\n border-right: ",";\n width: ",";\n box-sizing: border-box;\n display: grid;\n grid-template-rows: 1fr calc(39px + "," * 2);\n height: inherit;\n background: ",";\n"],["\n border-right: ",";\n width: ",";\n box-sizing: border-box;\n display: grid;\n grid-template-rows: 1fr calc(39px + "," * 2);\n height: inherit;\n background: ",";\n"])),i.theme.border,i.theme.sidebarWidth,i.theme.space24,i.theme.sidebarColor),k=u.default.div(c||(c=e.__makeTemplateObject(["\n height: ",";\n display: grid;\n grid-template-columns: "," 1fr;\n"],["\n height: ",";\n display: grid;\n grid-template-columns: "," 1fr;\n"])),(function(e){return e.$hasHeader?"calc(100vh - ".concat(i.theme.appbarHeight,")"):"100vh"}),i.theme.sidebarWidth),w=u.default.main(m||(m=e.__makeTemplateObject(["\n height: 100vh;\n overflow: hidden;\n"],["\n height: 100vh;\n overflow: hidden;\n"]))),z=u.default.div(g||(g=e.__makeTemplateObject(["\n height: inherit;\n overflow-y: auto;\n padding: ",";\n box-sizing: border-box;\n"],["\n height: inherit;\n overflow-y: auto;\n padding: ",";\n box-sizing: border-box;\n"])),i.theme.space32),q=u.default.header(p||(p=e.__makeTemplateObject(["\n background: ",";\n box-shadow: ",";\n border-bottom: ",";\n height: ",";\n z-index: ",";\n position: sticky;\n top: 0;\n box-sizing: border-box;\n display: flex;\n"],["\n background: ",";\n box-shadow: ",";\n border-bottom: ",";\n height: ",";\n z-index: ",";\n position: sticky;\n top: 0;\n box-sizing: border-box;\n display: flex;\n"])),i.theme.headerColor,i.theme.v3ShadowBase,i.theme.border,i.theme.appbarHeight,i.theme.appbarElevation);exports.Layout=function(e){var r=e.className,t=e.content,i=e.footer,o=e.headerContent,a=e.logoSidebar,d=e.searchInput,h=e.sidebar;return n.jsxs(w,{className:r,children:[!!o&&n.jsx(q,{children:o}),n.jsxs(k,{$hasHeader:!!o,children:[n.jsxs(y,{children:[n.jsxs(f,{children:[!!a&&n.jsx(v,{children:a}),!!d&&n.jsx(j,{children:n.jsx(_,{onChange:d.onChange,value:d.value})}),h]}),n.jsx(x,{children:i})]}),n.jsx(z,{children:t})]})]})};
1
+ "use strict";var e=require("react/jsx-runtime"),o=require("../input/SearchInput.js");require("./NavigationGroup.js");var a=require("../../styles/constants/theme.js");require("../../_tslib-ccfac372.js"),require("react"),require("styled-components"),require("../../icons/SearchIcon.js"),require("../../icons/icon-base/_IconBase.js"),require("../collapse/Collapse.js"),require("@mui/material/Collapse");var r={aminoLayout:"Amino_Layout-module__aminoLayout--k-8EW",contentGrid:"Amino_Layout-module__contentGrid--6ltoS",styledSidebar:"Amino_Layout-module__styledSidebar--dnwoo",sidebarContent:"Amino_Layout-module__sidebarContent--NXMVV",searchInputWrapper:"Amino_Layout-module__searchInputWrapper--JldDc",styledLogoSidebar:"Amino_Layout-module__styledLogoSidebar--MTiPe",styledSearchInput:"Amino_Layout-module__styledSearchInput--uJCBW",content:"Amino_Layout-module__content--LYUwT",header:"Amino_Layout-module__header--lID5Y",footer:"Amino_Layout-module__footer--5enlV"};!function(e,o){void 0===o&&(o={});var a=o.insertAt;if(e&&"undefined"!=typeof document){var r=document.head||document.getElementsByTagName("head")[0],t=document.createElement("style");t.type="text/css","top"===a&&r.firstChild?r.insertBefore(t,r.firstChild):r.appendChild(t),t.styleSheet?t.styleSheet.cssText=e:t.appendChild(document.createTextNode(e))}}(".Amino_Layout-module__aminoLayout--k-8EW{height:100vh;overflow:hidden}.Amino_Layout-module__contentGrid--6ltoS{display:grid;grid-template-columns:var(--amino-sidebar-width) 1fr;height:var(--amino-appbar-height)}.Amino_Layout-module__styledSidebar--dnwoo{background:var(--amino-sidebar-color);border-right:var(--amino-border);box-sizing:border-box;display:grid;grid-template-rows:1fr calc(39px + var(--amino-space-24)*2);height:inherit;width:var(--amino-sidebar-width)}.Amino_Layout-module__sidebarContent--NXMVV{box-sizing:border-box;color:red;display:flex;flex-direction:column;height:100%;overflow-y:auto;padding:var(--amino-space-16);width:100%}.Amino_Layout-module__searchInputWrapper--JldDc{margin-bottom:var(--amino-space-40)}.Amino_Layout-module__styledLogoSidebar--MTiPe{margin-bottom:var(--amino-space-24)}.Amino_Layout-module__styledSearchInput--uJCBW{border:0}.Amino_Layout-module__styledSearchInput--uJCBW svg{color:var(--amino-gray-1200)}.Amino_Layout-module__styledSearchInput--uJCBW input{background-color:var(--amino-gray-100);border:0}.Amino_Layout-module__styledSearchInput--uJCBW input ::-webkit-input-placeholder{color:var(--amino-gray-1200)}.Amino_Layout-module__styledSearchInput--uJCBW input ::placeholder{color:var(--amino-gray-1200)}.Amino_Layout-module__content--LYUwT{box-sizing:border-box;height:inherit;overflow-y:auto;padding:var(--amino-space-32)}.Amino_Layout-module__header--lID5Y{background:var(--amino-header-color);border-bottom:var(--amino-border);box-shadow:var(--amino-v3-shadow-base);box-sizing:border-box;display:flex;height:var(--amino-appbar-height);position:-webkit-sticky;position:sticky;top:0;z-index:var(--amino-appbar-elevation)}.Amino_Layout-module__footer--5enlV{box-sizing:border-box;width:var(--amino-sidebar-width)}");exports.Layout=function(t){var i=t.className,n=t.content,d=t.footer,s=t.headerContent,l=t.logoSidebar,u=t.searchInput,m=t.sidebar;return e.jsxs("main",{className:[i,r.aminoLayout].join(" "),children:[!!s&&e.jsx("header",{className:r.header,children:s}),e.jsxs("div",{className:r.contentGrid,style:{height:s?"calc(100vh - ".concat(a.theme.appbarHeight,")"):"100vh"},children:[e.jsxs("nav",{className:r.styledSidebar,children:[e.jsxs("div",{className:r.sidebarContent,children:[!!l&&e.jsx("div",{className:r.styledLogoSidebar,children:l}),!!u&&e.jsx("div",{className:r.searchInputWrapper,children:e.jsx(o.SearchInput,{className:r.styledSearchInput,onChange:u.onChange,value:u.value})}),m]}),e.jsx("div",{className:r.footer,children:d})]}),e.jsx("div",{className:r.content,children:n})]})]})};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@zonos/amino",
3
- "version": "5.1.55",
3
+ "version": "5.1.56",
4
4
  "description": "Core UI components for Amino",
5
5
  "repository": "git@github.com:Zonos/amino.git",
6
6
  "license": "MIT",
package/theme.scss ADDED
@@ -0,0 +1,234 @@
1
+ /** Base amino theme scss variable */
2
+ $amino-transition: var(--amino-transition);
3
+ $amino-type-scale-base: var(--amino-type-scale-base);
4
+ $amino-glass-0: var(--amino-glass-0);
5
+ $amino-glass-50: var(--amino-glass-50);
6
+ $amino-glass-100: var(--amino-glass-100);
7
+ $amino-glass-200: var(--amino-glass-200);
8
+ $amino-glass-300: var(--amino-glass-300);
9
+ $amino-glass-400: var(--amino-glass-400);
10
+ $amino-glass-500: var(--amino-glass-500);
11
+ $amino-glass-600: var(--amino-glass-600);
12
+ $amino-glass-700: var(--amino-glass-700);
13
+ $amino-glass-800: var(--amino-glass-800);
14
+ $amino-glass-900: var(--amino-glass-900);
15
+ $amino-glass-1000: var(--amino-glass-1000);
16
+ $amino-glass-1100: var(--amino-glass-1100);
17
+ $amino-glass-1200: var(--amino-glass-1200);
18
+ $amino-gray-0: var(--amino-gray-0);
19
+ $amino-gray-50: var(--amino-gray-50);
20
+ $amino-gray-100: var(--amino-gray-100);
21
+ $amino-gray-200: var(--amino-gray-200);
22
+ $amino-gray-300: var(--amino-gray-300);
23
+ $amino-gray-400: var(--amino-gray-400);
24
+ $amino-gray-500: var(--amino-gray-500);
25
+ $amino-gray-600: var(--amino-gray-600);
26
+ $amino-gray-700: var(--amino-gray-700);
27
+ $amino-gray-800: var(--amino-gray-800);
28
+ $amino-gray-900: var(--amino-gray-900);
29
+ $amino-gray-1000: var(--amino-gray-1000);
30
+ $amino-gray-1100: var(--amino-gray-1100);
31
+ $amino-gray-1200: var(--amino-gray-1200);
32
+ $amino-blue-100: var(--amino-blue-100);
33
+ $amino-blue-200: var(--amino-blue-200);
34
+ $amino-blue-300: var(--amino-blue-300);
35
+ $amino-blue-400: var(--amino-blue-400);
36
+ $amino-blue-500: var(--amino-blue-500);
37
+ $amino-blue-600: var(--amino-blue-600);
38
+ $amino-blue-700: var(--amino-blue-700);
39
+ $amino-blue-800: var(--amino-blue-800);
40
+ $amino-blue-900: var(--amino-blue-900);
41
+ $amino-blue-1000: var(--amino-blue-1000);
42
+ $amino-cyan-100: var(--amino-cyan-100);
43
+ $amino-cyan-200: var(--amino-cyan-200);
44
+ $amino-cyan-300: var(--amino-cyan-300);
45
+ $amino-cyan-400: var(--amino-cyan-400);
46
+ $amino-cyan-500: var(--amino-cyan-500);
47
+ $amino-cyan-600: var(--amino-cyan-600);
48
+ $amino-cyan-700: var(--amino-cyan-700);
49
+ $amino-cyan-800: var(--amino-cyan-800);
50
+ $amino-cyan-900: var(--amino-cyan-900);
51
+ $amino-cyan-1000: var(--amino-cyan-1000);
52
+ $amino-red-100: var(--amino-red-100);
53
+ $amino-red-200: var(--amino-red-200);
54
+ $amino-red-300: var(--amino-red-300);
55
+ $amino-red-400: var(--amino-red-400);
56
+ $amino-red-500: var(--amino-red-500);
57
+ $amino-red-600: var(--amino-red-600);
58
+ $amino-red-700: var(--amino-red-700);
59
+ $amino-red-800: var(--amino-red-800);
60
+ $amino-red-900: var(--amino-red-900);
61
+ $amino-red-1000: var(--amino-red-1000);
62
+ $amino-orange-100: var(--amino-orange-100);
63
+ $amino-orange-200: var(--amino-orange-200);
64
+ $amino-orange-300: var(--amino-orange-300);
65
+ $amino-orange-400: var(--amino-orange-400);
66
+ $amino-orange-500: var(--amino-orange-500);
67
+ $amino-orange-600: var(--amino-orange-600);
68
+ $amino-orange-700: var(--amino-orange-700);
69
+ $amino-orange-800: var(--amino-orange-800);
70
+ $amino-orange-900: var(--amino-orange-900);
71
+ $amino-orange-1000: var(--amino-orange-1000);
72
+ $amino-green-100: var(--amino-green-100);
73
+ $amino-green-200: var(--amino-green-200);
74
+ $amino-green-300: var(--amino-green-300);
75
+ $amino-green-400: var(--amino-green-400);
76
+ $amino-green-500: var(--amino-green-500);
77
+ $amino-green-600: var(--amino-green-600);
78
+ $amino-green-700: var(--amino-green-700);
79
+ $amino-green-800: var(--amino-green-800);
80
+ $amino-green-900: var(--amino-green-900);
81
+ $amino-green-1000: var(--amino-green-1000);
82
+ $amino-purple-100: var(--amino-purple-100);
83
+ $amino-purple-200: var(--amino-purple-200);
84
+ $amino-purple-300: var(--amino-purple-300);
85
+ $amino-purple-400: var(--amino-purple-400);
86
+ $amino-purple-500: var(--amino-purple-500);
87
+ $amino-purple-600: var(--amino-purple-600);
88
+ $amino-purple-700: var(--amino-purple-700);
89
+ $amino-purple-800: var(--amino-purple-800);
90
+ $amino-purple-900: var(--amino-purple-900);
91
+ $amino-purple-1000: var(--amino-purple-1000);
92
+ $amino-transparent-white: var(--amino-transparent-white);
93
+ $amino-transparent-black: var(--amino-transparent-black);
94
+ $amino-transparent-gray-600: var(--amino-transparent-gray-600);
95
+ $amino-v3-shadow-base: var(--amino-v3-shadow-base);
96
+ $amino-v3-shadow-medium: var(--amino-v3-shadow-medium);
97
+ $amino-v3-shadow-large: var(--amino-v3-shadow-large);
98
+ $amino-v3-shadow-xl: var(--amino-v3-shadow-xl);
99
+ $amino-v3-shadow-xxl: var(--amino-v3-shadow-xxl);
100
+ $amino-v3-shadow-inset: var(--amino-v3-shadow-inset);
101
+ $amino-shadow-button-primary: var(--amino-shadow-button-primary);
102
+ $amino-shadow-button-success: var(--amino-shadow-button-success);
103
+ $amino-shadow-button-danger: var(--amino-shadow-button-danger);
104
+ $amino-shadow-button-warning: var(--amino-shadow-button-warning);
105
+ $amino-button-focus-ring: var(--amino-button-focus-ring);
106
+ $amino-shadow-button-standard: var(--amino-shadow-button-standard);
107
+ $amino-shadow-button-disabled: var(--amino-shadow-button-disabled);
108
+ $amino-space-negative-80: var(--amino-space-negative-80);
109
+ $amino-space-negative-76: var(--amino-space-negative-76);
110
+ $amino-space-negative-72: var(--amino-space-negative-72);
111
+ $amino-space-negative-68: var(--amino-space-negative-68);
112
+ $amino-space-negative-64: var(--amino-space-negative-64);
113
+ $amino-space-negative-60: var(--amino-space-negative-60);
114
+ $amino-space-negative-56: var(--amino-space-negative-56);
115
+ $amino-space-negative-52: var(--amino-space-negative-52);
116
+ $amino-space-negative-48: var(--amino-space-negative-48);
117
+ $amino-space-negative-44: var(--amino-space-negative-44);
118
+ $amino-space-negative-40: var(--amino-space-negative-40);
119
+ $amino-space-negative-36: var(--amino-space-negative-36);
120
+ $amino-space-negative-32: var(--amino-space-negative-32);
121
+ $amino-space-negative-28: var(--amino-space-negative-28);
122
+ $amino-space-negative-24: var(--amino-space-negative-24);
123
+ $amino-space-negative-20: var(--amino-space-negative-20);
124
+ $amino-space-negative-16: var(--amino-space-negative-16);
125
+ $amino-space-negative-12: var(--amino-space-negative-12);
126
+ $amino-space-negative-8: var(--amino-space-negative-8);
127
+ $amino-space-negative-4: var(--amino-space-negative-4);
128
+ $amino-space-0: var(--amino-space-0);
129
+ $amino-space-4: var(--amino-space-4);
130
+ $amino-space-8: var(--amino-space-8);
131
+ $amino-space-12: var(--amino-space-12);
132
+ $amino-space-16: var(--amino-space-16);
133
+ $amino-space-20: var(--amino-space-20);
134
+ $amino-space-24: var(--amino-space-24);
135
+ $amino-space-28: var(--amino-space-28);
136
+ $amino-space-32: var(--amino-space-32);
137
+ $amino-space-36: var(--amino-space-36);
138
+ $amino-space-40: var(--amino-space-40);
139
+ $amino-space-44: var(--amino-space-44);
140
+ $amino-space-48: var(--amino-space-48);
141
+ $amino-space-52: var(--amino-space-52);
142
+ $amino-space-56: var(--amino-space-56);
143
+ $amino-space-60: var(--amino-space-60);
144
+ $amino-space-64: var(--amino-space-64);
145
+ $amino-space-68: var(--amino-space-68);
146
+ $amino-space-72: var(--amino-space-72);
147
+ $amino-space-76: var(--amino-space-76);
148
+ $amino-space-80: var(--amino-space-80);
149
+ $amino-border: var(--amino-border);
150
+ $amino-border-blue: var(--amino-border-blue);
151
+ $amino-border-red: var(--amino-border-red);
152
+ $amino-border-cyan: var(--amino-border-cyan);
153
+ $amino-border-orange: var(--amino-border-orange);
154
+ $amino-border-green: var(--amino-border-green);
155
+ $amino-border-purple: var(--amino-border-purple);
156
+ $amino-border-amber: var(--amino-border-amber);
157
+ $amino-border-transparent: var(--amino-border-transparent);
158
+ $amino-sidebar-color: var(--amino-sidebar-color);
159
+ $amino-header-color: var(--amino-header-color);
160
+ $amino-danger: var(--amino-danger);
161
+ $amino-danger-dark: var(--amino-danger-dark);
162
+ $amino-error: var(--amino-error);
163
+ $amino-primary: var(--amino-primary);
164
+ $amino-primary-light: var(--amino-primary-light);
165
+ $amino-primary-dark: var(--amino-primary-dark);
166
+ $amino-success: var(--amino-success);
167
+ $amino-success-dark: var(--amino-success-dark);
168
+ $amino-warning: var(--amino-warning);
169
+ $amino-warning-dark: var(--amino-warning-dark);
170
+ $amino-glow-error: var(--amino-glow-error);
171
+ $amino-glow-blue: var(--amino-glow-blue);
172
+ $amino-glow-cyan: var(--amino-glow-cyan);
173
+ $amino-glow-red: var(--amino-glow-red);
174
+ $amino-glow-orange: var(--amino-glow-orange);
175
+ $amino-glow-green: var(--amino-glow-green);
176
+ $amino-glow-purple: var(--amino-glow-purple);
177
+ $amino-page-background: var(--amino-page-background);
178
+ $amino-border-color: var(--amino-border-color);
179
+ $amino-hover-color: var(--amino-hover-color);
180
+ $amino-text-color: var(--amino-text-color);
181
+ $amino-text-color-secondary: var(--amino-text-color-secondary);
182
+ $amino-focus-button-standard: var(--amino-focus-button-standard);
183
+ $amino-focus-button: var(--amino-focus-button);
184
+ $amino-surface-color: var(--amino-surface-color);
185
+ $amino-surface-color-secondary: var(--amino-surface-color-secondary);
186
+ $amino-backdrop-color: var(--amino-backdrop-color);
187
+ $amino-button-primary-hover: var(--amino-button-primary-hover);
188
+ $amino-button-success-hover: var(--amino-button-success-hover);
189
+ $amino-button-danger-hover: var(--amino-button-danger-hover);
190
+ $amino-button-warning-hover: var(--amino-button-warning-hover);
191
+ $amino-button-standard-hover: var(--amino-button-standard-hover);
192
+ $amino-spinner-track-black: var(--amino-spinner-track-black);
193
+ $amino-spinner-stroke-black: var(--amino-spinner-stroke-black);
194
+ $amino-spinner-track-white: var(--amino-spinner-track-white);
195
+ $amino-spinner-stroke-white: var(--amino-spinner-stroke-white);
196
+ $amino-appbar-height: var(--amino-appbar-height);
197
+ $amino-sidebar-width: var(--amino-sidebar-width);
198
+ $amino-elevation-0: var(--amino-elevation-0);
199
+ $amino-elevation-100: var(--amino-elevation-100);
200
+ $amino-elevation-200: var(--amino-elevation-200);
201
+ $amino-elevation-300: var(--amino-elevation-300);
202
+ $amino-elevation-400: var(--amino-elevation-400);
203
+ $amino-elevation-500: var(--amino-elevation-500);
204
+ $amino-dialog-elevation: var(--amino-dialog-elevation);
205
+ $amino-toast-elevation: var(--amino-toast-elevation);
206
+ $amino-appbar-elevation: var(--amino-appbar-elevation);
207
+ $amino-size-xl: var(--amino-size-xl);
208
+ $amino-size-lg: var(--amino-size-lg);
209
+ $amino-size-md: var(--amino-size-md);
210
+ $amino-size-sm: var(--amino-size-sm);
211
+ $amino-radius-4: var(--amino-radius-4);
212
+ $amino-radius-6: var(--amino-radius-6);
213
+ $amino-radius-8: var(--amino-radius-8);
214
+ $amino-radius-10: var(--amino-radius-10);
215
+ $amino-radius-12: var(--amino-radius-12);
216
+ $amino-font-size-3xl: var(--amino-font-size-3xl);
217
+ $amino-font-size-2xl: var(--amino-font-size-2xl);
218
+ $amino-font-size-xl: var(--amino-font-size-xl);
219
+ $amino-font-size-l: var(--amino-font-size-l);
220
+ $amino-font-size-base-docs: var(--amino-font-size-base-docs);
221
+ $amino-font-size-base: var(--amino-font-size-base);
222
+ $amino-font-size-s: var(--amino-font-size-s);
223
+ $amino-font-size-xs: var(--amino-font-size-xs);
224
+ $amino-line-height-3xl: var(--amino-line-height-3xl);
225
+ $amino-line-height-2xl: var(--amino-line-height-2xl);
226
+ $amino-line-height-xl: var(--amino-line-height-xl);
227
+ $amino-line-height-l: var(--amino-line-height-l);
228
+ $amino-line-height-base: var(--amino-line-height-base);
229
+ $amino-line-height-s: var(--amino-line-height-s);
230
+ $amino-line-height-xs: var(--amino-line-height-xs);
231
+ $amino-font-sans: var(--amino-font-sans);
232
+ $amino-font-mono: var(--amino-font-mono);
233
+ $amino-font-harmonized-codes: var(--amino-font-harmonized-codes);
234
+ $amino-input-background: var(--amino-input-background);