lupine.components 1.0.2 → 1.0.4

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.
Files changed (3) hide show
  1. package/package.json +1 -1
  2. package/src/components/float-window.tsx +4 -1
  3. package/src/styles/shared-themes.ts +4 -4
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "lupine.components",
3
- "version": "1.0.2",
3
+ "version": "1.0.4",
4
4
  "license": "MIT",
5
5
  "author": "uuware.com",
6
6
  "homepage": "https://uuware.com/",
package/src/components/float-window.tsx CHANGED
@@ -14,6 +14,7 @@ export type FloatWindowShowProps = {
14
14
  closeEvent?: () => void;
15
15
  handleClicked: (index: number, close: FloatWindowCloseProps) => void;
16
16
  closeWhenClickOutside?: boolean; // default false
17
+ zIndex?: string;
17
18
  };
18
19
 
19
20
  // because it's over a mask, so it can use primary colors
@@ -43,6 +44,7 @@ export class FloatWindow {
43
44
  closeEvent,
44
45
  handleClicked,
45
46
  closeWhenClickOutside = false,
47
+ zIndex,
46
48
  }: FloatWindowShowProps): Promise<FloatWindowCloseProps> {
47
49
  const onClickContainer = (event: any) => {
48
50
  if (closeWhenClickOutside !== false && event.target.className === 'fwin-box') {
@@ -105,7 +107,7 @@ export class FloatWindow {
105
107
  maxWidth: '90%',
106
108
  boxShadow: 'var(--cover-box-shadow)', //'#0000004c 0px 19px 38px, #00000038 0px 15px 12px',
107
109
  opacity: 0,
108
- zIndex: 'var(--layer-float-window)',
110
+ // zIndex: 'var(--layer-float-window)',
109
111
  '&.transition': {
110
112
  transition: 'all 0.3s',
111
113
  },
@@ -177,6 +179,7 @@ export class FloatWindow {
177
179
  </div>
178
180
  );
179
181
  base.style.position = 'fixed';
182
+ base.style.zIndex = zIndex || 'var(--layer-float-window)';
180
183
  document.body.appendChild(base);
181
184
  await mountComponents(base, component);
182
185
  return handleClose;
package/src/styles/shared-themes.ts CHANGED
@@ -7,10 +7,10 @@ export const sharedThemes: ThemeProps = {
7
7
  '--layer-header-footer': '300',
8
8
  '--layer-sidebar': '400',
9
9
  '--layer-sidebar-sub': '410',
10
- '--layer-float-window': '500',
11
- '--layer-slider': '600', // screen slider
12
- '--layer-modal': '700',
13
- '--layer-modal-over': '710',
10
+ '--layer-slider': '500', // screen slider
11
+ '--layer-modal': '600',
12
+ '--layer-modal-over': '610',
13
+ '--layer-float-window': '700',
14
14
  '--layer-menu': '800', // popup menu
15
15
  '--layer-menu-sub': '810',
16
16
  '--layer-notice': '900', // notice, loading, toast