react-bwin 0.4.1 → 0.5.1
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/react-bwin.css +1 -1
- package/dist/react-bwin.d.ts +11 -2
- package/dist/react-bwin.js +381 -324
- package/dist/react-bwin.umd.js +2 -2
- package/package.json +2 -2
package/dist/react-bwin.css
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
bw-window{--bw-font-family:system-ui;--bw-font-size:14px;--bw-drop-area-bg-color:#0000000d;--bw-glass-clearance:2px;--bw-glass-border-radius:2px;--bw-glass-border-color:#1a1a1a;--bw-glass-border-color-disabled:#ccc;--bw-glass-bg-color-disabled:#f7f7f7;--bw-glass-header-height:30px;--bw-glass-header-gap:4px;--bw-glass-header-bg-color:#f7f7f7;--bw-minimized-glass-highlight-color:#d9d9d9;--bw-detached-glass-shadow:0 2px 6px #0000001f, 0 4px 14px #00000038;--bw-detached-glass-shadow-active:0 4px 10px #00000038, 0 10px 30px #00000061;--bw-detached-glass-resize-handle-size:12px;--bw-sill-gap:6px}bw-window[theme=dark]{--lightningcss-light: ;--lightningcss-dark:initial;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bw-glass-border-color:#666;--bw-glass-border-color-disabled:#4d4d4d;--bw-glass-header-bg-color:#2e2e2e;--bw-glass-bg-color-disabled:#292929;--bw-drop-area-bg-color:#ffffff1a;--bw-detached-glass-shadow:0 2px 6px #0000008c, 0 4px 14px #000000a6;--bw-detached-glass-shadow-active:0 4px 10px #000000a6, 0 10px 30px #000c;--bw-minimized-glass-highlight-color:#a6a6a6cc}bw-window[theme=dark] bw-pane,bw-window[theme=dark] bw-muntin{background-color:#242424}bw-window[theme=dark] bw-glass{color:#e6e6e6;background-color:#292929}bw-window[theme=dark] .bw-glass-tab:hover,bw-window[theme=dark] .bw-glass-action:hover,bw-window[theme=dark] .bw-minimized-glass:hover{background-color:#424242}.body--bw-resize-x{-webkit-user-select:none;user-select:none;cursor:ew-resize}.body--bw-resize-y{-webkit-user-select:none;user-select:none;cursor:ns-resize}bw-window{box-sizing:border-box;display:block;position:absolute}bw-window:has(>bw-pane[maximized])>:is(bw-pane,bw-muntin):not([maximized]){display:none}bw-pane{isolation:isolate;box-sizing:border-box;background-color:#f2f2f2;position:absolute;overflow:auto}bw-pane[drop-area]:before{content:"";background-color:var(--bw-drop-area-bg-color);position:absolute}bw-pane[drop-area=top]:before{height:50%;top:0;left:0;right:0}bw-pane[drop-area=right]:before{width:50%;top:0;bottom:0;right:0}bw-pane[drop-area=bottom]:before{height:50%;bottom:0;left:0;right:0}bw-pane[drop-area=left]:before{width:50%;top:0;bottom:0;left:0}bw-pane[drop-area=center]:before{inset:0}bw-muntin{box-sizing:border-box;background-color:#fff;position:absolute}bw-muntin[horizontal]{cursor:ns-resize}bw-muntin[vertical]{cursor:ew-resize}bw-muntin[resizable=false]{cursor:auto}bw-window:has(bw-glass) bw-pane{background-color:#0000}bw-window:has(bw-glass) bw-pane[drop-area]:before{z-index:1}bw-window:has(bw-glass) bw-pane[drop-area=top]:before{top:var(--bw-glass-clearance);left:var(--bw-glass-clearance);right:var(--bw-glass-clearance);height:50%}bw-window:has(bw-glass) bw-pane[drop-area=right]:before{top:var(--bw-glass-clearance);right:var(--bw-glass-clearance);bottom:var(--bw-glass-clearance);width:50%}bw-window:has(bw-glass) bw-pane[drop-area=bottom]:before{bottom:var(--bw-glass-clearance);left:var(--bw-glass-clearance);right:var(--bw-glass-clearance);height:50%}bw-window:has(bw-glass) bw-pane[drop-area=left]:before{top:var(--bw-glass-clearance);left:var(--bw-glass-clearance);bottom:var(--bw-glass-clearance);width:50%}bw-window:has(bw-glass) bw-pane[drop-area=center]:before{inset:var(--bw-glass-clearance)}bw-window:has(bw-glass) bw-muntin{background-color:#0000}bw-glass{inset:var(--bw-glass-clearance);border:1px solid var(--bw-glass-border-color);border-radius:var(--bw-glass-border-radius);font-family:var(--bw-font-family);font-size:var(--bw-font-size);box-sizing:border-box;
|
|
1
|
+
bw-window{--bw-font-family:system-ui;--bw-font-size:14px;--bw-drop-area-bg-color:#0000000d;--bw-glass-clearance:2px;--bw-glass-border-radius:2px;--bw-glass-border-color:#1a1a1a;--bw-glass-border-color-disabled:#ccc;--bw-glass-bg-color-disabled:#f7f7f7;--bw-glass-header-height:30px;--bw-glass-header-gap:4px;--bw-glass-header-bg-color:#f7f7f7;--bw-minimized-glass-highlight-color:#d9d9d9;--bw-detached-glass-shadow:0 2px 6px #0000001f, 0 4px 14px #00000038;--bw-detached-glass-shadow-active:0 4px 10px #00000038, 0 10px 30px #00000061;--bw-detached-glass-resize-handle-size:12px;--bw-sill-gap:6px}bw-window[theme=dark]{--lightningcss-light: ;--lightningcss-dark:initial;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bw-glass-border-color:#666;--bw-glass-border-color-disabled:#4d4d4d;--bw-glass-header-bg-color:#2e2e2e;--bw-glass-bg-color-disabled:#292929;--bw-drop-area-bg-color:#ffffff1a;--bw-detached-glass-shadow:0 2px 6px #0000008c, 0 4px 14px #000000a6;--bw-detached-glass-shadow-active:0 4px 10px #000000a6, 0 10px 30px #000c;--bw-minimized-glass-highlight-color:#a6a6a6cc}bw-window[theme=dark] bw-pane,bw-window[theme=dark] bw-muntin{background-color:#242424}bw-window[theme=dark] bw-glass-content{color:#e6e6e6;background-color:#292929}bw-window[theme=dark] .bw-glass-tab:hover,bw-window[theme=dark] .bw-glass-action:hover,bw-window[theme=dark] .bw-minimized-glass:hover{background-color:#424242}.body--bw-resize-x{-webkit-user-select:none;user-select:none;cursor:ew-resize}.body--bw-resize-y{-webkit-user-select:none;user-select:none;cursor:ns-resize}bw-window{box-sizing:border-box;display:block;position:absolute}bw-window:has(>bw-pane[maximized])>:is(bw-pane,bw-muntin):not([maximized]){display:none}bw-pane{isolation:isolate;box-sizing:border-box;background-color:#f2f2f2;position:absolute;overflow:auto}bw-pane[drop-area]:before{content:"";background-color:var(--bw-drop-area-bg-color);position:absolute}bw-pane[drop-area=top]:before{height:50%;top:0;left:0;right:0}bw-pane[drop-area=right]:before{width:50%;top:0;bottom:0;right:0}bw-pane[drop-area=bottom]:before{height:50%;bottom:0;left:0;right:0}bw-pane[drop-area=left]:before{width:50%;top:0;bottom:0;left:0}bw-pane[drop-area=center]:before{inset:0}bw-muntin{box-sizing:border-box;background-color:#fff;position:absolute}bw-muntin[horizontal]{cursor:ns-resize}bw-muntin[vertical]{cursor:ew-resize}bw-muntin[resizable=false]{cursor:auto}bw-window:has(bw-glass) bw-pane{background-color:#0000}bw-window:has(bw-glass) bw-pane[drop-area]:before{z-index:1}bw-window:has(bw-glass) bw-pane[drop-area=top]:before{top:var(--bw-glass-clearance);left:var(--bw-glass-clearance);right:var(--bw-glass-clearance);height:50%}bw-window:has(bw-glass) bw-pane[drop-area=right]:before{top:var(--bw-glass-clearance);right:var(--bw-glass-clearance);bottom:var(--bw-glass-clearance);width:50%}bw-window:has(bw-glass) bw-pane[drop-area=bottom]:before{bottom:var(--bw-glass-clearance);left:var(--bw-glass-clearance);right:var(--bw-glass-clearance);height:50%}bw-window:has(bw-glass) bw-pane[drop-area=left]:before{top:var(--bw-glass-clearance);left:var(--bw-glass-clearance);bottom:var(--bw-glass-clearance);width:50%}bw-window:has(bw-glass) bw-pane[drop-area=center]:before{inset:var(--bw-glass-clearance)}bw-window:has(bw-glass) bw-muntin{background-color:#0000}bw-glass{inset:var(--bw-glass-clearance);border:1px solid var(--bw-glass-border-color);border-radius:var(--bw-glass-border-radius);font-family:var(--bw-font-family);font-size:var(--bw-font-size);box-sizing:border-box;flex-direction:column;display:flex;position:absolute}bw-glass[draggable=true]:active{cursor:move;opacity:.4}bw-glass-header{box-sizing:border-box;flex-basis:var(--bw-glass-header-height);-webkit-user-select:none;user-select:none;align-items:center;gap:var(--bw-glass-header-gap);padding-inline:var(--bw-glass-header-gap);border-bottom:1px solid var(--bw-glass-border-color);border-top-left-radius:var(--bw-glass-border-radius);border-top-right-radius:var(--bw-glass-border-radius);background-color:var(--bw-glass-header-bg-color);flex-shrink:0;display:flex;overflow:hidden}bw-glass-title{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}bw-glass-tab-container{align-self:flex-end;gap:var(--bw-glass-header-gap);display:flex}.bw-glass-tab{font-family:var(--bw-font-family);border:1px solid var(--bw-glass-border-color);border-top-left-radius:var(--bw-glass-border-radius);border-top-right-radius:var(--bw-glass-border-radius);cursor:pointer;border-bottom:none}.bw-glass-tab:hover{background-color:#fff}.bw-glass-tab:active{transform:translateY(1px)}bw-glass-action-container{flex-shrink:0;gap:2px;margin-left:auto;display:flex}.bw-glass-action{font-family:var(--bw-font-family);border:1px solid var(--bw-glass-border-color);border-radius:var(--bw-glass-border-radius);cursor:pointer}.bw-glass-action:hover{background-color:#fff}.bw-glass-action:active{transform:scale(.95)}.bw-glass-action:disabled{border:1px solid var(--bw-glass-border-color-disabled);background-color:var(--bw-glass-bg-color-disabled);cursor:not-allowed}.bw-glass-action:disabled:hover{background-color:var(--bw-glass-bg-color-disabled)}.bw-glass-action:disabled:active{transform:scale(1)}.bw-glass-action--minimize:before{content:"−"}.bw-glass-action--detach:before{content:"☐"}.bw-glass-action--attach:before{content:"⊞"}.bw-glass-action--maximize:before{content:"🡥"}bw-pane[maximized] .bw-glass-action--maximize:before{content:"🡧"}.bw-glass-action--close:before{content:"✕"}bw-glass-content{box-sizing:border-box;border-bottom-left-radius:var(--bw-glass-border-radius);border-bottom-right-radius:var(--bw-glass-border-radius);background-color:#fff;flex-grow:1;display:block;overflow:auto}bw-glass[detached]{box-shadow:var(--bw-detached-glass-shadow)}bw-glass[detached][active]{box-shadow:var(--bw-detached-glass-shadow-active)}bw-glass[detached]>bw-glass-header[can-drag=true]:active{cursor:move}bw-glass-resize-handle{z-index:2;touch-action:none;position:absolute}bw-glass-resize-handle[resize-dir=n]{top:calc(var(--bw-detached-glass-resize-handle-size) / -2);height:var(--bw-detached-glass-resize-handle-size);cursor:ns-resize;left:0;right:0}bw-glass-resize-handle[resize-dir=s]{bottom:calc(var(--bw-detached-glass-resize-handle-size) / -2);height:var(--bw-detached-glass-resize-handle-size);cursor:ns-resize;left:0;right:0}bw-glass-resize-handle[resize-dir=e]{top:0;bottom:0;right:calc(var(--bw-detached-glass-resize-handle-size) / -2);width:var(--bw-detached-glass-resize-handle-size);cursor:ew-resize}bw-glass-resize-handle[resize-dir=w]{top:0;bottom:0;left:calc(var(--bw-detached-glass-resize-handle-size) / -2);width:var(--bw-detached-glass-resize-handle-size);cursor:ew-resize}bw-glass-resize-handle[resize-dir=ne]{top:calc(var(--bw-detached-glass-resize-handle-size) / -2);right:calc(var(--bw-detached-glass-resize-handle-size) / -2);width:var(--bw-detached-glass-resize-handle-size);height:var(--bw-detached-glass-resize-handle-size);cursor:nesw-resize}bw-glass-resize-handle[resize-dir=nw]{top:calc(var(--bw-detached-glass-resize-handle-size) / -2);left:calc(var(--bw-detached-glass-resize-handle-size) / -2);width:var(--bw-detached-glass-resize-handle-size);height:var(--bw-detached-glass-resize-handle-size);cursor:nwse-resize}bw-glass-resize-handle[resize-dir=se]{bottom:calc(var(--bw-detached-glass-resize-handle-size) / -2);right:calc(var(--bw-detached-glass-resize-handle-size) / -2);width:var(--bw-detached-glass-resize-handle-size);height:var(--bw-detached-glass-resize-handle-size);cursor:nwse-resize}bw-glass-resize-handle[resize-dir=sw]{bottom:calc(var(--bw-detached-glass-resize-handle-size) / -2);left:calc(var(--bw-detached-glass-resize-handle-size) / -2);width:var(--bw-detached-glass-resize-handle-size);height:var(--bw-detached-glass-resize-handle-size);cursor:nesw-resize}bw-sill{margin-top:calc(var(--bw-sill-gap) - var(--bw-glass-clearance));gap:var(--bw-sill-gap);box-sizing:border-box;width:100%;padding-inline:var(--bw-glass-clearance);display:flex;position:absolute;top:100%}.bw-minimized-glass,.bw-minimized-detached-glass{border:1px solid var(--bw-glass-border-color);border-radius:var(--bw-glass-border-radius);cursor:pointer;background-color:var(--bw-glass-header-bg-color);flex-basis:10%;height:10px;display:block}:is(.bw-minimized-glass,.bw-minimized-detached-glass):hover{background-color:#fff}:is(.bw-minimized-glass,.bw-minimized-detached-glass):active{transform:scale(.95)}.bw-minimized-glass,.bw-minimized-detached-glass{animation:2s ease-out bw-minimized-glass-highlight}@keyframes bw-minimized-glass-highlight{0%{background-color:var(--bw-glass-header-bg-color)}30%{background-color:var(--bw-minimized-glass-highlight-color)}to{background-color:var(--bw-glass-header-bg-color)}}
|
|
2
2
|
/*$vite$:1*/
|
package/dist/react-bwin.d.ts
CHANGED
|
@@ -3,8 +3,12 @@ declare module 'react-bwin' {
|
|
|
3
3
|
export const DEFAULT_GLASS_ACTIONS: Action[]
|
|
4
4
|
export const DEFAULT_DETACHED_GLASS_ACTIONS: Action[]
|
|
5
5
|
export const Window: React.ForwardRefExoticComponent<
|
|
6
|
-
WindowProps & React.RefAttributes<
|
|
6
|
+
WindowProps & React.RefAttributes<WindowApi>
|
|
7
7
|
>
|
|
8
|
+
export const WindowProvider: React.FunctionComponent<
|
|
9
|
+
React.PropsWithChildren<{}>
|
|
10
|
+
>
|
|
11
|
+
export function useWindow(): WindowApi
|
|
8
12
|
}
|
|
9
13
|
|
|
10
14
|
declare global {
|
|
@@ -87,13 +91,18 @@ declare global {
|
|
|
87
91
|
setTheme(theme: string): void
|
|
88
92
|
}
|
|
89
93
|
|
|
90
|
-
type
|
|
94
|
+
type WindowApi = {
|
|
91
95
|
addPane: (targetPaneId: string, fields: PaneFields) => void
|
|
92
96
|
removePane: (targetPaneId: string) => void
|
|
93
97
|
fit: () => void
|
|
94
98
|
setTheme: (theme: string) => void
|
|
95
99
|
}
|
|
96
100
|
|
|
101
|
+
/**
|
|
102
|
+
* @deprecated Use {@link WindowApi} instead.
|
|
103
|
+
*/
|
|
104
|
+
type WindowHandle = WindowApi
|
|
105
|
+
|
|
97
106
|
type WindowProps = Omit<ConfigRoot, 'children'> & {
|
|
98
107
|
panes?: ConfigNode[]
|
|
99
108
|
}
|