@operato/popup 2.0.0-beta.26 → 2.0.0-beta.31

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.
@@ -9,7 +9,7 @@ export default {
9
9
  component: 'ox-prompt',
10
10
  argTypes: {
11
11
  type: { control: 'select', options: ['success', 'error', 'warning', 'info', 'question'] },
12
- debug: { control: 'boolean' },
12
+ preventCloseOnBlur: { control: 'boolean' },
13
13
  theme: { control: 'select', options: ['light', 'dark'] }
14
14
  }
15
15
  }
@@ -22,7 +22,7 @@ interface Story<T> {
22
22
 
23
23
  interface ArgTypes {
24
24
  type: 'success' | 'error' | 'warning' | 'info' | 'question'
25
- debug: boolean
25
+ preventCloseOnBlur: boolean
26
26
  theme?: 'light' | 'dark'
27
27
  }
28
28
 
@@ -30,23 +30,22 @@ function popup(
30
30
  e: MouseEvent,
31
31
  type: 'success' | 'error' | 'warning' | 'info' | 'question' = 'warning',
32
32
  theme: 'light' | 'dark',
33
- debug: boolean
33
+ preventCloseOnBlur: boolean
34
34
  ) {
35
35
  const noImage = new URL('/assets/images/no-image.png', import.meta.url).href
36
36
 
37
- //@ts-ignore
38
- window.POPUP_DEBUG = debug
39
-
40
37
  OxPrompt.open({
41
38
  title: 'Are you sure ?',
42
39
  text: 'Are you sure to exit this page ?',
43
40
  type,
41
+ icon: noImage,
44
42
  confirmButton: { text: 'Confirm' },
45
- cancelButton: { text: 'Cancel' }
43
+ cancelButton: { text: 'Cancel' },
44
+ preventCloseOnBlur
46
45
  })
47
46
  }
48
47
 
49
- const Template: Story<ArgTypes> = ({ type, debug, theme = 'light' }: ArgTypes) => html`
48
+ const Template: Story<ArgTypes> = ({ type, preventCloseOnBlur, theme = 'light' }: ArgTypes) => html`
50
49
  <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap" rel="stylesheet" />
51
50
 
52
51
  <link href="/themes/light.css" rel="stylesheet" />
@@ -85,7 +84,11 @@ const Template: Story<ArgTypes> = ({ type, debug, theme = 'light' }: ArgTypes) =
85
84
  document.body.classList.add('${theme}')
86
85
  </script>
87
86
 
88
- <div id="place" @click=${(e: MouseEvent) => popup(e, type, theme, debug)} class="md-typescale-display-medium">
87
+ <div
88
+ id="place"
89
+ @click=${(e: MouseEvent) => popup(e, type, theme, preventCloseOnBlur)}
90
+ class="md-typescale-display-medium"
91
+ >
89
92
  Click this to prompt image
90
93
  </div>
91
94
  `
@@ -93,5 +96,5 @@ const Template: Story<ArgTypes> = ({ type, debug, theme = 'light' }: ArgTypes) =
93
96
  export const Regular = Template.bind({})
94
97
  Regular.args = {
95
98
  type: 'warning',
96
- debug: true
99
+ preventCloseOnBlur: true
97
100
  }