@adminui-dev/layout 1.0.4 → 1.0.5
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/typings.d.ts +3 -1
- package/dist/index.cjs.js +1 -1
- package/dist/index.d.ts +3 -1
- package/dist/index.esm.js +1 -1
- package/package.json +7 -1
|
@@ -5,6 +5,7 @@ type ContainerMode = 'inline' | 'box' | 'panel';
|
|
|
5
5
|
type ContainerStretch = 'inline' | 'auto' | 'fill';
|
|
6
6
|
type SkinType = 'tidy' | 'rich';
|
|
7
7
|
type Position = "top" | "center" | "bottom";
|
|
8
|
+
type AvatarPosition = "rightTop" | "leftBottom" | "none";
|
|
8
9
|
type ConfigStateDispatcher = {
|
|
9
10
|
layoutConfig: LayoutConfig;
|
|
10
11
|
locale: string;
|
|
@@ -48,6 +49,7 @@ interface LayoutConfig {
|
|
|
48
49
|
headerTransparent?: boolean;
|
|
49
50
|
containerTransparent?: boolean;
|
|
50
51
|
collapsedPosition?: Position;
|
|
52
|
+
avatarPosition?: AvatarPosition;
|
|
51
53
|
userInfo?: UserInfo;
|
|
52
54
|
brandInfo?: BrandInfo;
|
|
53
55
|
}
|
|
@@ -122,4 +124,4 @@ interface ContainerProps extends LayoutProps {
|
|
|
122
124
|
transparent?: boolean;
|
|
123
125
|
children?: React.ReactNode;
|
|
124
126
|
}
|
|
125
|
-
export type { LayoutProps, BaseLayoutProps, RootLayoutProps, ContainerProps, ContainerMode, ContainerStretch, Theme, LayoutTheme, LayoutType, LayoutConfig, Language, LocaleMessageData, UserInfo, BrandInfo, ConfigStateDispatcher, ConfigActionDispatcher, SkinType, ThemeSkin, MenuData, Position, OutletContainer };
|
|
127
|
+
export type { LayoutProps, BaseLayoutProps, RootLayoutProps, ContainerProps, ContainerMode, ContainerStretch, Theme, LayoutTheme, LayoutType, LayoutConfig, Language, LocaleMessageData, UserInfo, BrandInfo, ConfigStateDispatcher, ConfigActionDispatcher, SkinType, ThemeSkin, MenuData, Position, AvatarPosition, OutletContainer };
|
package/dist/index.cjs.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";var e=require("react/jsx-runtime"),n=require("react");function t(e,n){void 0===n&&(n={});var t=n.insertAt;if(e&&"undefined"!=typeof document){var r=document.head||document.getElementsByTagName("head")[0],o=document.createElement("style");o.type="text/css","top"===t&&r.firstChild?r.insertBefore(o,r.firstChild):r.appendChild(o),o.styleSheet?o.styleSheet.cssText=e:o.appendChild(document.createTextNode(e))}}var r="Layout-module_rootBackground__j3UVG";function o(){return e.jsx("div",{className:r})}t("@layer base {\r\n html, body {\r\n padding: 0;\r\n margin: 0;\r\n border: 0;\r\n width: 100
|
|
1
|
+
"use strict";var e=require("react/jsx-runtime"),n=require("react");function t(e,n){void 0===n&&(n={});var t=n.insertAt;if(e&&"undefined"!=typeof document){var r=document.head||document.getElementsByTagName("head")[0],o=document.createElement("style");o.type="text/css","top"===t&&r.firstChild?r.insertBefore(o,r.firstChild):r.appendChild(o),o.styleSheet?o.styleSheet.cssText=e:o.appendChild(document.createTextNode(e))}}var r="Layout-module_rootBackground__j3UVG";function o(){return e.jsx("div",{className:r})}t("@layer base {\r\n html, body {\r\n padding: 0;\r\n margin: 0;\r\n border: 0;\r\n width: 100%; \r\n height: 100%;\r\n }\r\n #Layout-module_root__3x-pW { \r\n text-align: initial;\r\n width: 100%;\r\n height:100%\r\n } \r\n}\r\n*, *:before, *:after {\r\n box-sizing: border-box;\r\n}\r\n.Layout-module_rootBox__3JHjy {\r\n text-rendering: optimizeLegibility;\r\n -webkit-font-smoothing: antialiased;\r\n -moz-osx-font-smoothing: grayscale;\r\n width: 100%;\r\n min-height: 100%;\r\n}\r\n.Layout-module_rootBackground__j3UVG {\r\n box-sizing: border-box; \r\n pointer-events: none;\r\n overflow: hidden;\r\n inset-block-start:0;\r\n inset-inline-start:0; \r\n height:100%;\r\n min-height: 100%;\r\n position: fixed;\r\n z-index: 0;\r\n}\r\n.Layout-module_rootLayout__jVEEF {\r\n box-sizing: border-box; \r\n width: 100%;\r\n min-height: 100%;\r\n display: flex; \r\n flex-flow: row;\r\n background-color: transparent;\r\n container-type: inline-size;\r\n}\r\n\r\n.Layout-module_mainLayout__6W9W9 {\r\n box-sizing: border-box; \r\n display: flex;\r\n flex-flow: column; \r\n width: 100%;\r\n}\r\n");const i=Symbol("LayoutAside"),a=Symbol("LayoutContent"),s=Symbol("LayoutHeader"),l={icon:"",name:"default",themeType:"tidy",theme:["light","dark"]},d={headerHeight:50,asideWidth:260,layoutType:"leftMenu",collapsedPosition:"bottom",avatarPosition:"rightTop",theme:"system",primaryColor:"#417ffb",skinName:l.name},u=n.createContext({setTheme:()=>{},setLayoutConfig:()=>{},setLocale:()=>{}}),c=n.createContext({locale:"en-US",languages:[],theme:"system",layoutConfig:{},themeSkin:l,themeSkinMap:{tidy:[],rich:[]}}),m=()=>n.useContext(c);function h(n){return e.jsx(e.Fragment,{children:n.children})}function g(n){return e.jsx(e.Fragment,{children:n.children})}function x(n){return e.jsx(e.Fragment,{children:n.children})}h.displayName="LayoutContent",h.role=a,g.displayName="LayoutAside",g.role=i,x.displayName="LayoutHeader",x.role=s;var f="layout-module_rootBox__Y8bEx",y="layout-module_rootLayout__TePvr",b="layout-module_mainLayout__a8Tb9";function p(t){let r=null,l=null,d=null;return n.Children.forEach(t.children,e=>{const n=e.type.role;n===s?r=e:n===a?l=e:n===i&&(d=e)}),e.jsx(e.Fragment,{children:e.jsxs("div",{ref:t.ref,className:f,style:{...t.style},children:[e.jsx(o,{}),e.jsxs("div",{className:y,children:[d,e.jsxs("div",{className:b,children:[r,l]})]})]})})}t("@layer base {\r\n html, body {\r\n padding: 0;\r\n margin: 0;\r\n border: 0;\r\n width: 100%; \r\n height: 100%;\r\n }\r\n #layout-module_root__0efzq { \r\n text-align: initial;\r\n width: 100%;\r\n height:100%\r\n } \r\n}\r\n*, *:before, *:after {\r\n box-sizing: border-box;\r\n}\r\n.layout-module_rootBox__Y8bEx {\r\n text-rendering: optimizeLegibility;\r\n -webkit-font-smoothing: antialiased;\r\n -moz-osx-font-smoothing: grayscale;\r\n width: 100%;\r\n min-height: 100%;\r\n}\r\n.layout-module_rootBackground__vEs6e {\r\n box-sizing: border-box; \r\n pointer-events: none;\r\n overflow: hidden;\r\n inset-block-start:0;\r\n inset-inline-start:0; \r\n height:100%;\r\n min-height: 100%;\r\n position: fixed;\r\n z-index: 0;\r\n}\r\n.layout-module_rootLayout__TePvr {\r\n box-sizing: border-box; \r\n width: 100%;\r\n min-height: 100%;\r\n display: flex; \r\n flex-flow: row;\r\n background-color: transparent;\r\n container-type: inline-size;\r\n}\r\n\r\n.layout-module_mainLayout__a8Tb9 {\r\n box-sizing: border-box; \r\n display: flex;\r\n flex-flow: column; \r\n width: 100%;\r\n}\r\n"),p.Aside=g,p.Content=h,p.Header=x;const _=e=>({r:parseInt(e.slice(1,3),16),g:parseInt(e.slice(3,5),16),b:parseInt(e.slice(5,7),16),a:9===e.length?(parseInt(e.slice(7,9),16)/255).toFixed(2):1});exports.BaseLayout=p,exports.FullScreenButton=function(t){const r=!!document.fullscreenElement,[o,i]=n.useState(r),a=()=>{i(!!document.fullscreenElement)},s=e=>{"F11"===e.code&&(e.preventDefault(),l())};n.useEffect(()=>(document.addEventListener("fullscreenchange",a),document.addEventListener("keydown",s,!0),()=>{document.removeEventListener("fullscreenchange",a),document.removeEventListener("keydown",s)}),[]);const l=()=>{o?document.exitFullscreen():document.documentElement.requestFullscreen()};if(!t.buttons||t.buttons.length<2)return e.jsx(e.Fragment,{});const[d,u]=t.buttons,c=o?d:u;return n.cloneElement(c,{onClick:e=>{console.log(e),l()}})},exports.LayoutBackground=o,exports.createConfigActionContext=()=>u,exports.createConfigStateContext=()=>c,exports.defaultConfig=d,exports.defaultSkinData=l,exports.defineConfig=function(e){return e},exports.getAvatarInitials=function(e){if(!e)return"";const n=Array.from(e);if(0===n.length)return"";const t=n[0];return function(e){if(0===e.length)return!1;const n=e.codePointAt(0);return n>=19968&&n<=40959||n>=13312&&n<=19903||n>=12352&&n<=12543||n>=44032&&n<=55215||n>=65280&&n<=65519||n>=126976&&n<=129791||n>=127744&&n<=128511||n>=128640&&n<=128767||n>=129280&&n<=129535||n>=9728&&n<=9983||n>=9984&&n<=10175}(t)?t:n.slice(0,2).join("")},exports.getLayoutTheme=e=>{if("system"==e){return window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light"}return e},exports.hexToRgb=e=>{const{r:n,g:t,b:r}=_(e);return{r:n,g:t,b:r}},exports.hexToRgbaString=(e,n)=>{const{r:t,g:r,b:o,a:i}=_(e);return`rgba(${t}, ${r}, ${o}, ${n??i})`},exports.useConfigAction=()=>n.useContext(u),exports.useConfigState=m,exports.useTheme=()=>m().theme;
|
package/dist/index.d.ts
CHANGED
|
@@ -9,6 +9,7 @@ type ContainerMode = 'inline' | 'box' | 'panel';
|
|
|
9
9
|
type ContainerStretch = 'inline' | 'auto' | 'fill';
|
|
10
10
|
type SkinType = 'tidy' | 'rich';
|
|
11
11
|
type Position = "top" | "center" | "bottom";
|
|
12
|
+
type AvatarPosition = "rightTop" | "leftBottom" | "none";
|
|
12
13
|
type ConfigStateDispatcher = {
|
|
13
14
|
layoutConfig: LayoutConfig;
|
|
14
15
|
locale: string;
|
|
@@ -52,6 +53,7 @@ interface LayoutConfig {
|
|
|
52
53
|
headerTransparent?: boolean;
|
|
53
54
|
containerTransparent?: boolean;
|
|
54
55
|
collapsedPosition?: Position;
|
|
56
|
+
avatarPosition?: AvatarPosition;
|
|
55
57
|
userInfo?: UserInfo;
|
|
56
58
|
brandInfo?: BrandInfo;
|
|
57
59
|
}
|
|
@@ -190,4 +192,4 @@ declare const hexToRgbaString: (color: string, alpha?: number) => string;
|
|
|
190
192
|
declare const getLayoutTheme: (theme: Theme) => LayoutTheme;
|
|
191
193
|
|
|
192
194
|
export { BaseLayout, export_default$1 as FullScreenButton, export_default as LayoutBackground, createConfigActionContext, createConfigStateContext, defaultConfig, defaultSkinData, defineConfig, getAvatarInitials, getLayoutTheme, hexToRgb, hexToRgbaString, useConfigAction, useConfigState, useTheme };
|
|
193
|
-
export type { BaseLayoutProps, BrandInfo, ConfigActionDispatcher, ConfigStateDispatcher, ContainerMode, ContainerProps, ContainerStretch, Language, LayoutConfig, LayoutProps, LayoutTheme, LayoutType, LocaleMessageData, MenuData, OutletContainer, Position, RootLayoutProps, SkinType, Theme, ThemeSkin, UserInfo };
|
|
195
|
+
export type { AvatarPosition, BaseLayoutProps, BrandInfo, ConfigActionDispatcher, ConfigStateDispatcher, ContainerMode, ContainerProps, ContainerStretch, Language, LayoutConfig, LayoutProps, LayoutTheme, LayoutType, LocaleMessageData, MenuData, OutletContainer, Position, RootLayoutProps, SkinType, Theme, ThemeSkin, UserInfo };
|
package/dist/index.esm.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as n,Fragment as e,jsxs as r}from"react/jsx-runtime";import t,{createContext as o,useContext as i,useState as l,useEffect as a}from"react";function d(n,e){void 0===e&&(e={});var r=e.insertAt;if(n&&"undefined"!=typeof document){var t=document.head||document.getElementsByTagName("head")[0],o=document.createElement("style");o.type="text/css","top"===r&&t.firstChild?t.insertBefore(o,t.firstChild):t.appendChild(o),o.styleSheet?o.styleSheet.cssText=n:o.appendChild(document.createTextNode(n))}}var s="Layout-module_rootBackground__j3UVG";function u(){return n("div",{className:s})}function c(n){return n}d("@layer base {\r\n html, body {\r\n padding: 0;\r\n margin: 0;\r\n border: 0;\r\n width: 100
|
|
1
|
+
import{jsx as n,Fragment as e,jsxs as r}from"react/jsx-runtime";import t,{createContext as o,useContext as i,useState as l,useEffect as a}from"react";function d(n,e){void 0===e&&(e={});var r=e.insertAt;if(n&&"undefined"!=typeof document){var t=document.head||document.getElementsByTagName("head")[0],o=document.createElement("style");o.type="text/css","top"===r&&t.firstChild?t.insertBefore(o,t.firstChild):t.appendChild(o),o.styleSheet?o.styleSheet.cssText=n:o.appendChild(document.createTextNode(n))}}var s="Layout-module_rootBackground__j3UVG";function u(){return n("div",{className:s})}function c(n){return n}d("@layer base {\r\n html, body {\r\n padding: 0;\r\n margin: 0;\r\n border: 0;\r\n width: 100%; \r\n height: 100%;\r\n }\r\n #Layout-module_root__3x-pW { \r\n text-align: initial;\r\n width: 100%;\r\n height:100%\r\n } \r\n}\r\n*, *:before, *:after {\r\n box-sizing: border-box;\r\n}\r\n.Layout-module_rootBox__3JHjy {\r\n text-rendering: optimizeLegibility;\r\n -webkit-font-smoothing: antialiased;\r\n -moz-osx-font-smoothing: grayscale;\r\n width: 100%;\r\n min-height: 100%;\r\n}\r\n.Layout-module_rootBackground__j3UVG {\r\n box-sizing: border-box; \r\n pointer-events: none;\r\n overflow: hidden;\r\n inset-block-start:0;\r\n inset-inline-start:0; \r\n height:100%;\r\n min-height: 100%;\r\n position: fixed;\r\n z-index: 0;\r\n}\r\n.Layout-module_rootLayout__jVEEF {\r\n box-sizing: border-box; \r\n width: 100%;\r\n min-height: 100%;\r\n display: flex; \r\n flex-flow: row;\r\n background-color: transparent;\r\n container-type: inline-size;\r\n}\r\n\r\n.Layout-module_mainLayout__6W9W9 {\r\n box-sizing: border-box; \r\n display: flex;\r\n flex-flow: column; \r\n width: 100%;\r\n}\r\n");const m=Symbol("LayoutAside"),h=Symbol("LayoutContent"),y=Symbol("LayoutHeader"),f={icon:"",name:"default",themeType:"tidy",theme:["light","dark"]},g={headerHeight:50,asideWidth:260,layoutType:"leftMenu",collapsedPosition:"bottom",avatarPosition:"rightTop",theme:"system",primaryColor:"#417ffb",skinName:f.name},b=o({setTheme:()=>{},setLayoutConfig:()=>{},setLocale:()=>{}}),x=o({locale:"en-US",languages:[],theme:"system",layoutConfig:{},themeSkin:f,themeSkinMap:{tidy:[],rich:[]}}),p=()=>b,_=()=>x,L=()=>i(x),v=()=>i(b),w=()=>L().theme;function k(r){return n(e,{children:r.children})}function z(r){return n(e,{children:r.children})}function E(r){return n(e,{children:r.children})}k.displayName="LayoutContent",k.role=h,z.displayName="LayoutAside",z.role=m,E.displayName="LayoutHeader",E.role=y;var C="layout-module_rootBox__Y8bEx",T="layout-module_rootLayout__TePvr",N="layout-module_mainLayout__a8Tb9";function B(o){let i=null,l=null,a=null;return t.Children.forEach(o.children,n=>{const e=n.type.role;e===y?i=n:e===h?l=n:e===m&&(a=n)}),n(e,{children:r("div",{ref:o.ref,className:C,style:{...o.style},children:[n(u,{}),r("div",{className:T,children:[a,r("div",{className:N,children:[i,l]})]})]})})}function S(r){const o=!!document.fullscreenElement,[i,d]=l(o),s=()=>{d(!!document.fullscreenElement)},u=n=>{"F11"===n.code&&(n.preventDefault(),c())};a(()=>(document.addEventListener("fullscreenchange",s),document.addEventListener("keydown",u,!0),()=>{document.removeEventListener("fullscreenchange",s),document.removeEventListener("keydown",u)}),[]);const c=()=>{i?document.exitFullscreen():document.documentElement.requestFullscreen()};if(!r.buttons||r.buttons.length<2)return n(e,{});const[m,h]=r.buttons,y=i?m:h;return t.cloneElement(y,{onClick:n=>{console.log(n),c()}})}function j(n){if(!n)return"";const e=Array.from(n);if(0===e.length)return"";const r=e[0];return function(n){if(0===n.length)return!1;const e=n.codePointAt(0);return e>=19968&&e<=40959||e>=13312&&e<=19903||e>=12352&&e<=12543||e>=44032&&e<=55215||e>=65280&&e<=65519||e>=126976&&e<=129791||e>=127744&&e<=128511||e>=128640&&e<=128767||e>=129280&&e<=129535||e>=9728&&e<=9983||e>=9984&&e<=10175}(r)?r:e.slice(0,2).join("")}d("@layer base {\r\n html, body {\r\n padding: 0;\r\n margin: 0;\r\n border: 0;\r\n width: 100%; \r\n height: 100%;\r\n }\r\n #layout-module_root__0efzq { \r\n text-align: initial;\r\n width: 100%;\r\n height:100%\r\n } \r\n}\r\n*, *:before, *:after {\r\n box-sizing: border-box;\r\n}\r\n.layout-module_rootBox__Y8bEx {\r\n text-rendering: optimizeLegibility;\r\n -webkit-font-smoothing: antialiased;\r\n -moz-osx-font-smoothing: grayscale;\r\n width: 100%;\r\n min-height: 100%;\r\n}\r\n.layout-module_rootBackground__vEs6e {\r\n box-sizing: border-box; \r\n pointer-events: none;\r\n overflow: hidden;\r\n inset-block-start:0;\r\n inset-inline-start:0; \r\n height:100%;\r\n min-height: 100%;\r\n position: fixed;\r\n z-index: 0;\r\n}\r\n.layout-module_rootLayout__TePvr {\r\n box-sizing: border-box; \r\n width: 100%;\r\n min-height: 100%;\r\n display: flex; \r\n flex-flow: row;\r\n background-color: transparent;\r\n container-type: inline-size;\r\n}\r\n\r\n.layout-module_mainLayout__a8Tb9 {\r\n box-sizing: border-box; \r\n display: flex;\r\n flex-flow: column; \r\n width: 100%;\r\n}\r\n"),B.Aside=z,B.Content=k,B.Header=E;const A=n=>({r:parseInt(n.slice(1,3),16),g:parseInt(n.slice(3,5),16),b:parseInt(n.slice(5,7),16),a:9===n.length?(parseInt(n.slice(7,9),16)/255).toFixed(2):1}),F=n=>{const{r:e,g:r,b:t}=A(n);return{r:e,g:r,b:t}},H=(n,e)=>{const{r:r,g:t,b:o,a:i}=A(n);return`rgba(${r}, ${t}, ${o}, ${e??i})`},P=n=>{if("system"==n){return window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light"}return n};export{B as BaseLayout,S as FullScreenButton,u as LayoutBackground,p as createConfigActionContext,_ as createConfigStateContext,g as defaultConfig,f as defaultSkinData,c as defineConfig,j as getAvatarInitials,P as getLayoutTheme,F as hexToRgb,H as hexToRgbaString,v as useConfigAction,L as useConfigState,w as useTheme};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@adminui-dev/layout",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.5",
|
|
4
4
|
"description": "adminui.dev's layout",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"layout",
|
|
@@ -8,6 +8,7 @@
|
|
|
8
8
|
"admin",
|
|
9
9
|
"dashboard"
|
|
10
10
|
],
|
|
11
|
+
|
|
11
12
|
"license": "MIT",
|
|
12
13
|
"author": "zhouwenqi",
|
|
13
14
|
"type": "commonjs",
|
|
@@ -30,6 +31,11 @@
|
|
|
30
31
|
"files": [
|
|
31
32
|
"dist"
|
|
32
33
|
],
|
|
34
|
+
"repository": {
|
|
35
|
+
"type": "git",
|
|
36
|
+
"url": "git+https://github.com/zhouwenqi/adminui-layout.git"
|
|
37
|
+
},
|
|
38
|
+
"homepage": "https://demo.adminui.dev",
|
|
33
39
|
"scripts": {
|
|
34
40
|
"build": "rollup -c",
|
|
35
41
|
"dev": "rollup -c -w",
|