@operato/input 2.0.0-alpha.59 → 2.0.0-alpha.64

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 (160) hide show
  1. package/CHANGELOG.md +20 -0
  2. package/dist/src/ox-input-barcode.js +2 -2
  3. package/dist/src/ox-input-barcode.js.map +1 -1
  4. package/dist/src/ox-input-container.d.ts +1 -1
  5. package/dist/src/ox-input-container.js +2 -2
  6. package/dist/src/ox-input-container.js.map +1 -1
  7. package/dist/src/ox-input-crontab.d.ts +0 -1
  8. package/dist/src/ox-input-crontab.js +4 -7
  9. package/dist/src/ox-input-crontab.js.map +1 -1
  10. package/dist/src/ox-input-data.js +2 -2
  11. package/dist/src/ox-input-data.js.map +1 -1
  12. package/dist/src/ox-input-duration.d.ts +0 -1
  13. package/dist/src/ox-input-duration.js +13 -9
  14. package/dist/src/ox-input-duration.js.map +1 -1
  15. package/dist/src/ox-input-file.d.ts +1 -1
  16. package/dist/src/ox-input-file.js +10 -9
  17. package/dist/src/ox-input-file.js.map +1 -1
  18. package/dist/src/ox-input-i18n-label.d.ts +1 -1
  19. package/dist/src/ox-input-i18n-label.js +1 -1
  20. package/dist/src/ox-input-i18n-label.js.map +1 -1
  21. package/dist/src/ox-input-image.d.ts +1 -1
  22. package/dist/src/ox-input-image.js +4 -4
  23. package/dist/src/ox-input-image.js.map +1 -1
  24. package/dist/src/ox-input-key-values.d.ts +1 -1
  25. package/dist/src/ox-input-key-values.js +9 -10
  26. package/dist/src/ox-input-key-values.js.map +1 -1
  27. package/dist/src/ox-input-mass-fraction.d.ts +1 -1
  28. package/dist/src/ox-input-mass-fraction.js +46 -29
  29. package/dist/src/ox-input-mass-fraction.js.map +1 -1
  30. package/dist/src/ox-input-multiple-colors.d.ts +1 -1
  31. package/dist/src/ox-input-multiple-colors.js +7 -7
  32. package/dist/src/ox-input-multiple-colors.js.map +1 -1
  33. package/dist/src/ox-input-options.d.ts +1 -1
  34. package/dist/src/ox-input-options.js +5 -7
  35. package/dist/src/ox-input-options.js.map +1 -1
  36. package/dist/src/ox-input-partition-keys.d.ts +1 -1
  37. package/dist/src/ox-input-partition-keys.js +10 -10
  38. package/dist/src/ox-input-partition-keys.js.map +1 -1
  39. package/dist/src/ox-input-privilege.d.ts +0 -1
  40. package/dist/src/ox-input-privilege.js +15 -31
  41. package/dist/src/ox-input-privilege.js.map +1 -1
  42. package/dist/src/ox-input-search.d.ts +1 -1
  43. package/dist/src/ox-input-search.js +4 -4
  44. package/dist/src/ox-input-search.js.map +1 -1
  45. package/dist/src/ox-input-table.d.ts +1 -1
  46. package/dist/src/ox-input-table.js +12 -12
  47. package/dist/src/ox-input-table.js.map +1 -1
  48. package/dist/src/ox-input-unit-number.d.ts +1 -1
  49. package/dist/src/ox-input-unit-number.js +5 -4
  50. package/dist/src/ox-input-unit-number.js.map +1 -1
  51. package/dist/src/ox-input-value-map.js +15 -15
  52. package/dist/src/ox-input-value-map.js.map +1 -1
  53. package/dist/src/ox-input-value-ranges.js +15 -15
  54. package/dist/src/ox-input-value-ranges.js.map +1 -1
  55. package/dist/src/ox-input-work-shift.js +4 -5
  56. package/dist/src/ox-input-work-shift.js.map +1 -1
  57. package/dist/src/ox-select.d.ts +1 -1
  58. package/dist/src/ox-select.js +4 -4
  59. package/dist/src/ox-select.js.map +1 -1
  60. package/dist/stories/ox-input-3axis.stories.js +14 -1
  61. package/dist/stories/ox-input-3axis.stories.js.map +1 -1
  62. package/dist/stories/ox-input-3dish.stories.js +14 -1
  63. package/dist/stories/ox-input-3dish.stories.js.map +1 -1
  64. package/dist/stories/ox-input-angle.stories.js +13 -1
  65. package/dist/stories/ox-input-angle.stories.js.map +1 -1
  66. package/dist/stories/ox-input-barcode.stories.js +13 -1
  67. package/dist/stories/ox-input-barcode.stories.js.map +1 -1
  68. package/dist/stories/ox-input-code.stories.js +13 -1
  69. package/dist/stories/ox-input-code.stories.js.map +1 -1
  70. package/dist/stories/ox-input-crontab.stories.js +13 -1
  71. package/dist/stories/ox-input-crontab.stories.js.map +1 -1
  72. package/dist/stories/ox-input-data.stories.js +13 -1
  73. package/dist/stories/ox-input-data.stories.js.map +1 -1
  74. package/dist/stories/ox-input-duration.stories.js +13 -1
  75. package/dist/stories/ox-input-duration.stories.js.map +1 -1
  76. package/dist/stories/ox-input-file.stories.js +13 -1
  77. package/dist/stories/ox-input-file.stories.js.map +1 -1
  78. package/dist/stories/ox-input-hashtags.stories.js +13 -1
  79. package/dist/stories/ox-input-hashtags.stories.js.map +1 -1
  80. package/dist/stories/ox-input-i18n-label.stories.js +13 -1
  81. package/dist/stories/ox-input-i18n-label.stories.js.map +1 -1
  82. package/dist/stories/ox-input-key-values.stories.js +13 -1
  83. package/dist/stories/ox-input-key-values.stories.js.map +1 -1
  84. package/dist/stories/ox-input-mass-fraction.stories.js +13 -1
  85. package/dist/stories/ox-input-mass-fraction.stories.js.map +1 -1
  86. package/dist/stories/ox-input-multiple-colors.stories.js +21 -10
  87. package/dist/stories/ox-input-multiple-colors.stories.js.map +1 -1
  88. package/dist/stories/ox-input-options.stories.js +13 -1
  89. package/dist/stories/ox-input-options.stories.js.map +1 -1
  90. package/dist/stories/ox-input-partition-keys.stories.js +13 -1
  91. package/dist/stories/ox-input-partition-keys.stories.js.map +1 -1
  92. package/dist/stories/ox-input-privilege.stories.js +13 -1
  93. package/dist/stories/ox-input-privilege.stories.js.map +1 -1
  94. package/dist/stories/ox-input-quantifier.stories.js +13 -1
  95. package/dist/stories/ox-input-quantifier.stories.js.map +1 -1
  96. package/dist/stories/ox-input-range.stories.js +13 -1
  97. package/dist/stories/ox-input-range.stories.js.map +1 -1
  98. package/dist/stories/ox-input-search.stories.js +13 -1
  99. package/dist/stories/ox-input-search.stories.js.map +1 -1
  100. package/dist/stories/ox-input-select-buttons.stories.js +13 -1
  101. package/dist/stories/ox-input-select-buttons.stories.js.map +1 -1
  102. package/dist/stories/ox-input-unit.stories.js +14 -1
  103. package/dist/stories/ox-input-unit.stories.js.map +1 -1
  104. package/dist/stories/ox-input-value-map.stories.js +13 -1
  105. package/dist/stories/ox-input-value-map.stories.js.map +1 -1
  106. package/dist/stories/ox-input-value-ranges.stories.js +13 -1
  107. package/dist/stories/ox-input-value-ranges.stories.js.map +1 -1
  108. package/dist/stories/ox-input-work-shift.stories.js +13 -1
  109. package/dist/stories/ox-input-work-shift.stories.js.map +1 -1
  110. package/dist/stories/ox-select.stories.js +13 -1
  111. package/dist/stories/ox-select.stories.js.map +1 -1
  112. package/dist/tsconfig.tsbuildinfo +1 -1
  113. package/package.json +5 -5
  114. package/src/ox-input-barcode.ts +2 -2
  115. package/src/ox-input-container.ts +2 -2
  116. package/src/ox-input-crontab.ts +4 -8
  117. package/src/ox-input-data.ts +2 -2
  118. package/src/ox-input-duration.ts +13 -10
  119. package/src/ox-input-file.ts +10 -9
  120. package/src/ox-input-i18n-label.ts +1 -1
  121. package/src/ox-input-image.ts +4 -4
  122. package/src/ox-input-key-values.ts +27 -22
  123. package/src/ox-input-mass-fraction.ts +46 -29
  124. package/src/ox-input-multiple-colors.ts +7 -7
  125. package/src/ox-input-options.ts +5 -7
  126. package/src/ox-input-partition-keys.ts +28 -22
  127. package/src/ox-input-privilege.ts +15 -32
  128. package/src/ox-input-search.ts +4 -4
  129. package/src/ox-input-table.ts +12 -12
  130. package/src/ox-input-unit-number.ts +5 -4
  131. package/src/ox-input-value-map.ts +17 -17
  132. package/src/ox-input-value-ranges.ts +17 -17
  133. package/src/ox-input-work-shift.ts +4 -5
  134. package/src/ox-select.ts +4 -4
  135. package/stories/ox-input-3axis.stories.ts +14 -1
  136. package/stories/ox-input-3dish.stories.ts +14 -1
  137. package/stories/ox-input-angle.stories.ts +13 -1
  138. package/stories/ox-input-barcode.stories.ts +13 -1
  139. package/stories/ox-input-code.stories.ts +13 -1
  140. package/stories/ox-input-crontab.stories.ts +13 -1
  141. package/stories/ox-input-data.stories.ts +13 -1
  142. package/stories/ox-input-duration.stories.ts +13 -1
  143. package/stories/ox-input-file.stories.ts +13 -1
  144. package/stories/ox-input-hashtags.stories.ts +13 -1
  145. package/stories/ox-input-i18n-label.stories.ts +13 -1
  146. package/stories/ox-input-key-values.stories.ts +13 -1
  147. package/stories/ox-input-mass-fraction.stories.ts +13 -1
  148. package/stories/ox-input-multiple-colors.stories.ts +21 -10
  149. package/stories/ox-input-options.stories.ts +13 -1
  150. package/stories/ox-input-partition-keys.stories.ts +13 -1
  151. package/stories/ox-input-privilege.stories.ts +13 -1
  152. package/stories/ox-input-quantifier.stories.ts +13 -1
  153. package/stories/ox-input-range.stories.ts +13 -1
  154. package/stories/ox-input-search.stories.ts +13 -1
  155. package/stories/ox-input-select-buttons.stories.ts +13 -1
  156. package/stories/ox-input-unit.stories.ts +14 -1
  157. package/stories/ox-input-value-map.stories.ts +13 -1
  158. package/stories/ox-input-value-ranges.stories.ts +13 -1
  159. package/stories/ox-input-work-shift.stories.ts +13 -1
  160. package/stories/ox-select.stories.ts +13 -1
@@ -36,7 +36,19 @@ const Template: Story<ArgTypes> = ({
36
36
  disabled
37
37
  }: ArgTypes) => html`
38
38
  <link href="/themes/app-theme.css" rel="stylesheet" />
39
- <link href="https://fonts.googleapis.com/css?family=Material+Icons&display=block" rel="stylesheet" />
39
+
40
+ <link
41
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL@20..48,100..700,0..1"
42
+ rel="stylesheet"
43
+ />
44
+ <link
45
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL@20..48,100..700,0..1"
46
+ rel="stylesheet"
47
+ />
48
+ <link
49
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Sharp:opsz,wght,FILL@20..48,100..700,0..1"
50
+ rel="stylesheet"
51
+ />
40
52
  <style>
41
53
  body {
42
54
  }
@@ -26,7 +26,19 @@ interface ArgTypes {
26
26
 
27
27
  const Template: Story<ArgTypes> = ({ name = 'crontab', value = '* * * * * *', disabled }: ArgTypes) => html`
28
28
  <link href="/themes/app-theme.css" rel="stylesheet" />
29
- <link href="https://fonts.googleapis.com/css?family=Material+Icons&display=block" rel="stylesheet" />
29
+
30
+ <link
31
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL@20..48,100..700,0..1"
32
+ rel="stylesheet"
33
+ />
34
+ <link
35
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL@20..48,100..700,0..1"
36
+ rel="stylesheet"
37
+ />
38
+ <link
39
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Sharp:opsz,wght,FILL@20..48,100..700,0..1"
40
+ rel="stylesheet"
41
+ />
30
42
  <style>
31
43
  body {
32
44
  }
@@ -26,7 +26,19 @@ interface ArgTypes {
26
26
 
27
27
  const Template: Story<ArgTypes> = ({ name = 'code', value = '', disabled }: ArgTypes) => html`
28
28
  <link href="/themes/app-theme.css" rel="stylesheet" />
29
- <link href="https://fonts.googleapis.com/css?family=Material+Icons&display=block" rel="stylesheet" />
29
+
30
+ <link
31
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL@20..48,100..700,0..1"
32
+ rel="stylesheet"
33
+ />
34
+ <link
35
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL@20..48,100..700,0..1"
36
+ rel="stylesheet"
37
+ />
38
+ <link
39
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Sharp:opsz,wght,FILL@20..48,100..700,0..1"
40
+ rel="stylesheet"
41
+ />
30
42
  <style>
31
43
  body {
32
44
  }
@@ -27,7 +27,19 @@ interface ArgTypes {
27
27
 
28
28
  const Template: Story<ArgTypes> = ({ name = 'duration', value = 3601, disabled }: ArgTypes) => html`
29
29
  <link href="/themes/app-theme.css" rel="stylesheet" />
30
- <link href="https://fonts.googleapis.com/css?family=Material+Icons&display=block" rel="stylesheet" />
30
+
31
+ <link
32
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL@20..48,100..700,0..1"
33
+ rel="stylesheet"
34
+ />
35
+ <link
36
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL@20..48,100..700,0..1"
37
+ rel="stylesheet"
38
+ />
39
+ <link
40
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Sharp:opsz,wght,FILL@20..48,100..700,0..1"
41
+ rel="stylesheet"
42
+ />
31
43
  <style>
32
44
  body {
33
45
  }
@@ -48,7 +48,19 @@ const Template: Story<ArgTypes> = ({
48
48
  disabled
49
49
  }: ArgTypes) => html`
50
50
  <link href="/themes/app-theme.css" rel="stylesheet" />
51
- <link href="https://fonts.googleapis.com/css?family=Material+Icons&display=block" rel="stylesheet" />
51
+
52
+ <link
53
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL@20..48,100..700,0..1"
54
+ rel="stylesheet"
55
+ />
56
+ <link
57
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL@20..48,100..700,0..1"
58
+ rel="stylesheet"
59
+ />
60
+ <link
61
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Sharp:opsz,wght,FILL@20..48,100..700,0..1"
62
+ rel="stylesheet"
63
+ />
52
64
  <style>
53
65
  body {
54
66
  }
@@ -28,7 +28,19 @@ interface ArgTypes {
28
28
 
29
29
  const Template: Story<ArgTypes> = ({ placeholder = 'hashtag', name = 'hello', value = [], disabled }: ArgTypes) => html`
30
30
  <link href="/themes/app-theme.css" rel="stylesheet" />
31
- <link href="https://fonts.googleapis.com/css?family=Material+Icons&display=block" rel="stylesheet" />
31
+
32
+ <link
33
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL@20..48,100..700,0..1"
34
+ rel="stylesheet"
35
+ />
36
+ <link
37
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL@20..48,100..700,0..1"
38
+ rel="stylesheet"
39
+ />
40
+ <link
41
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Sharp:opsz,wght,FILL@20..48,100..700,0..1"
42
+ rel="stylesheet"
43
+ />
32
44
  <style>
33
45
  body {
34
46
  }
@@ -26,7 +26,19 @@ interface ArgTypes {
26
26
 
27
27
  const Template: Story<ArgTypes> = ({ name = 'values', value, disabled }: ArgTypes) => html`
28
28
  <link href="/themes/app-theme.css" rel="stylesheet" />
29
- <link href="https://fonts.googleapis.com/css?family=Material+Icons&display=block" rel="stylesheet" />
29
+
30
+ <link
31
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL@20..48,100..700,0..1"
32
+ rel="stylesheet"
33
+ />
34
+ <link
35
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL@20..48,100..700,0..1"
36
+ rel="stylesheet"
37
+ />
38
+ <link
39
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Sharp:opsz,wght,FILL@20..48,100..700,0..1"
40
+ rel="stylesheet"
41
+ />
30
42
  <style>
31
43
  body {
32
44
  }
@@ -28,7 +28,19 @@ interface ArgTypes {
28
28
 
29
29
  const Template: Story<ArgTypes> = ({ name = 'key-values', value = {}, options = [], disabled }: ArgTypes) => html`
30
30
  <link href="/themes/app-theme.css" rel="stylesheet" />
31
- <link href="https://fonts.googleapis.com/css?family=Material+Icons&display=block" rel="stylesheet" />
31
+
32
+ <link
33
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL@20..48,100..700,0..1"
34
+ rel="stylesheet"
35
+ />
36
+ <link
37
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL@20..48,100..700,0..1"
38
+ rel="stylesheet"
39
+ />
40
+ <link
41
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Sharp:opsz,wght,FILL@20..48,100..700,0..1"
42
+ rel="stylesheet"
43
+ />
32
44
  <style>
33
45
  body {
34
46
  }
@@ -36,7 +36,19 @@ const Template: Story<ArgTypes> = ({
36
36
  disabled
37
37
  }: ArgTypes) => html`
38
38
  <link href="/themes/app-theme.css" rel="stylesheet" />
39
- <link href="https://fonts.googleapis.com/css?family=Material+Icons&display=block" rel="stylesheet" />
39
+
40
+ <link
41
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL@20..48,100..700,0..1"
42
+ rel="stylesheet"
43
+ />
44
+ <link
45
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL@20..48,100..700,0..1"
46
+ rel="stylesheet"
47
+ />
48
+ <link
49
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Sharp:opsz,wght,FILL@20..48,100..700,0..1"
50
+ rel="stylesheet"
51
+ />
40
52
  <style>
41
53
  body {
42
54
  }
@@ -22,7 +22,18 @@ interface ArgTypes {
22
22
  }
23
23
 
24
24
  const Template: Story<ArgTypes> = ({ disabled }: ArgTypes) => html`
25
- <link href="https://fonts.googleapis.com/css?family=Material+Icons&display=block" rel="stylesheet" />
25
+ <link
26
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL@20..48,100..700,0..1"
27
+ rel="stylesheet"
28
+ />
29
+ <link
30
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL@20..48,100..700,0..1"
31
+ rel="stylesheet"
32
+ />
33
+ <link
34
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Sharp:opsz,wght,FILL@20..48,100..700,0..1"
35
+ rel="stylesheet"
36
+ />
26
37
 
27
38
  <style>
28
39
  body {
@@ -99,15 +110,15 @@ const Template: Story<ArgTypes> = ({ disabled }: ArgTypes) => html`
99
110
  --icon-default-color: var(--theme-white-color);
100
111
 
101
112
  /* material design component themes */
102
- --mdc-theme-on-primary: var(--theme-white-color);
103
- --mdc-theme-primary: var(--secondary-text-color);
104
- --mdc-theme-on-secondary: var(--theme-white-color);
105
- --mdc-theme-secondary: var(--primary-color);
106
- --mdc-button-outline-color: var(--primary-color);
107
- --mdc-danger-button-primary-color: var(--status-danger-color);
108
- --mdc-danger-button-outline-color: var(--status-danger-color);
109
- --mdc-button-outline-width: 1px;
110
- --mdc-button-horizontal-padding: 16px;
113
+ --md-theme-on-primary: var(--theme-white-color);
114
+ --md-theme-primary: var(--secondary-text-color);
115
+ --md-theme-on-secondary: var(--theme-white-color);
116
+ --md-theme-secondary: var(--primary-color);
117
+ --md-button-outline-color: var(--primary-color);
118
+ --md-danger-button-primary-color: var(--status-danger-color);
119
+ --md-danger-button-outline-color: var(--status-danger-color);
120
+ --md-button-outline-width: 1px;
121
+ --md-button-horizontal-padding: 16px;
111
122
 
112
123
  /* button style */
113
124
  --button-background-color: #fafbfc;
@@ -26,7 +26,19 @@ interface ArgTypes {
26
26
 
27
27
  const Template: Story<ArgTypes> = ({ name = 'options', value = {}, disabled }: ArgTypes) => html`
28
28
  <link href="/themes/app-theme.css" rel="stylesheet" />
29
- <link href="https://fonts.googleapis.com/css?family=Material+Icons&display=block" rel="stylesheet" />
29
+
30
+ <link
31
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL@20..48,100..700,0..1"
32
+ rel="stylesheet"
33
+ />
34
+ <link
35
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL@20..48,100..700,0..1"
36
+ rel="stylesheet"
37
+ />
38
+ <link
39
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Sharp:opsz,wght,FILL@20..48,100..700,0..1"
40
+ rel="stylesheet"
41
+ />
30
42
  <style>
31
43
  body {
32
44
  }
@@ -26,7 +26,19 @@ interface ArgTypes {
26
26
 
27
27
  const Template: Story<ArgTypes> = ({ name = 'partition-keys', value = {}, disabled }: ArgTypes) => html`
28
28
  <link href="/themes/app-theme.css" rel="stylesheet" />
29
- <link href="https://fonts.googleapis.com/css?family=Material+Icons&display=block" rel="stylesheet" />
29
+
30
+ <link
31
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL@20..48,100..700,0..1"
32
+ rel="stylesheet"
33
+ />
34
+ <link
35
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL@20..48,100..700,0..1"
36
+ rel="stylesheet"
37
+ />
38
+ <link
39
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Sharp:opsz,wght,FILL@20..48,100..700,0..1"
40
+ rel="stylesheet"
41
+ />
30
42
  <style>
31
43
  body {
32
44
  }
@@ -33,7 +33,19 @@ interface ArgTypes {
33
33
 
34
34
  const Template: Story<ArgTypes> = ({ name = 'privilege', value = null, privileges, disabled }: ArgTypes) => html`
35
35
  <link href="/themes/app-theme.css" rel="stylesheet" />
36
- <link href="https://fonts.googleapis.com/css?family=Material+Icons&display=block" rel="stylesheet" />
36
+
37
+ <link
38
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL@20..48,100..700,0..1"
39
+ rel="stylesheet"
40
+ />
41
+ <link
42
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL@20..48,100..700,0..1"
43
+ rel="stylesheet"
44
+ />
45
+ <link
46
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Sharp:opsz,wght,FILL@20..48,100..700,0..1"
47
+ rel="stylesheet"
48
+ />
37
49
  <style>
38
50
  body {
39
51
  }
@@ -28,7 +28,19 @@ interface ArgTypes {
28
28
 
29
29
  const Template: Story<ArgTypes> = ({ name = 'quantifier', value, disabled }: ArgTypes) => html`
30
30
  <link href="/themes/app-theme.css" rel="stylesheet" />
31
- <link href="https://fonts.googleapis.com/css?family=Material+Icons&display=block" rel="stylesheet" />
31
+
32
+ <link
33
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL@20..48,100..700,0..1"
34
+ rel="stylesheet"
35
+ />
36
+ <link
37
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL@20..48,100..700,0..1"
38
+ rel="stylesheet"
39
+ />
40
+ <link
41
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Sharp:opsz,wght,FILL@20..48,100..700,0..1"
42
+ rel="stylesheet"
43
+ />
32
44
 
33
45
  <ox-input-quantifier
34
46
  name=${name}
@@ -39,7 +39,19 @@ const Template: Story<ArgTypes> = ({
39
39
  disabled
40
40
  }: ArgTypes) => html`
41
41
  <link href="/themes/app-theme.css" rel="stylesheet" />
42
- <link href="https://fonts.googleapis.com/css?family=Material+Icons&display=block" rel="stylesheet" />
42
+
43
+ <link
44
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL@20..48,100..700,0..1"
45
+ rel="stylesheet"
46
+ />
47
+ <link
48
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL@20..48,100..700,0..1"
49
+ rel="stylesheet"
50
+ />
51
+ <link
52
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Sharp:opsz,wght,FILL@20..48,100..700,0..1"
53
+ rel="stylesheet"
54
+ />
43
55
 
44
56
  <ox-input-range name=${name} value=${value} step=${step} min=${min} max=${max} ?disabled=${disabled}>
45
57
  </ox-input-range>
@@ -36,7 +36,19 @@ const Template: Story<ArgTypes> = ({
36
36
  disabled
37
37
  }: ArgTypes) => html`
38
38
  <link href="/themes/app-theme.css" rel="stylesheet" />
39
- <link href="https://fonts.googleapis.com/css?family=Material+Icons&display=block" rel="stylesheet" />
39
+
40
+ <link
41
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL@20..48,100..700,0..1"
42
+ rel="stylesheet"
43
+ />
44
+ <link
45
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL@20..48,100..700,0..1"
46
+ rel="stylesheet"
47
+ />
48
+ <link
49
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Sharp:opsz,wght,FILL@20..48,100..700,0..1"
50
+ rel="stylesheet"
51
+ />
40
52
  <style>
41
53
  body {
42
54
  }
@@ -36,7 +36,19 @@ const Template: Story<ArgTypes> = ({
36
36
  disabled
37
37
  }: ArgTypes) => html`
38
38
  <link href="/themes/app-theme.css" rel="stylesheet" />
39
- <link href="https://fonts.googleapis.com/css?family=Material+Icons&display=block" rel="stylesheet" />
39
+
40
+ <link
41
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL@20..48,100..700,0..1"
42
+ rel="stylesheet"
43
+ />
44
+ <link
45
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL@20..48,100..700,0..1"
46
+ rel="stylesheet"
47
+ />
48
+ <link
49
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Sharp:opsz,wght,FILL@20..48,100..700,0..1"
50
+ rel="stylesheet"
51
+ />
40
52
  <style>
41
53
  ox-input-select-buttons {
42
54
  max-width: 400px;
@@ -68,8 +68,21 @@ const Template: Story<ArgTypes> = ({
68
68
  userUnit,
69
69
  disabled
70
70
  }: ArgTypes) => html`
71
- <link href="https://fonts.googleapis.com/css?family=Material+Icons" rel="stylesheet" />
71
+ <link
72
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL@20..48,100..700,0..1"
73
+ rel="stylesheet"
74
+ />
75
+ <link
76
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL@20..48,100..700,0..1"
77
+ rel="stylesheet"
78
+ />
79
+ <link
80
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Sharp:opsz,wght,FILL@20..48,100..700,0..1"
81
+ rel="stylesheet"
82
+ />
83
+
72
84
  <link href="/themes/app-theme.css" rel="stylesheet" />
85
+
73
86
  <ox-input-unit-number
74
87
  name=${name}
75
88
  placeholder=${placeholder}
@@ -36,7 +36,19 @@ const Template: Story<ArgTypes> = ({
36
36
  disabled
37
37
  }: ArgTypes) => html`
38
38
  <link href="/themes/app-theme.css" rel="stylesheet" />
39
- <link href="https://fonts.googleapis.com/css?family=Material+Icons&display=block" rel="stylesheet" />
39
+
40
+ <link
41
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL@20..48,100..700,0..1"
42
+ rel="stylesheet"
43
+ />
44
+ <link
45
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL@20..48,100..700,0..1"
46
+ rel="stylesheet"
47
+ />
48
+ <link
49
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Sharp:opsz,wght,FILL@20..48,100..700,0..1"
50
+ rel="stylesheet"
51
+ />
40
52
  <style>
41
53
  body {
42
54
  }
@@ -36,7 +36,19 @@ const Template: Story<ArgTypes> = ({
36
36
  disabled
37
37
  }: ArgTypes) => html`
38
38
  <link href="/themes/app-theme.css" rel="stylesheet" />
39
- <link href="https://fonts.googleapis.com/css?family=Material+Icons&display=block" rel="stylesheet" />
39
+
40
+ <link
41
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL@20..48,100..700,0..1"
42
+ rel="stylesheet"
43
+ />
44
+ <link
45
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL@20..48,100..700,0..1"
46
+ rel="stylesheet"
47
+ />
48
+ <link
49
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Sharp:opsz,wght,FILL@20..48,100..700,0..1"
50
+ rel="stylesheet"
51
+ />
40
52
  <style>
41
53
  body {
42
54
  }
@@ -27,7 +27,19 @@ interface ArgTypes {
27
27
 
28
28
  const Template: Story<ArgTypes> = ({ name = 'work-shift', value = [], disabled }: ArgTypes) => html`
29
29
  <link href="/themes/app-theme.css" rel="stylesheet" />
30
- <link href="https://fonts.googleapis.com/css?family=Material+Icons&display=block" rel="stylesheet" />
30
+
31
+ <link
32
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL@20..48,100..700,0..1"
33
+ rel="stylesheet"
34
+ />
35
+ <link
36
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL@20..48,100..700,0..1"
37
+ rel="stylesheet"
38
+ />
39
+ <link
40
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Sharp:opsz,wght,FILL@20..48,100..700,0..1"
41
+ rel="stylesheet"
42
+ />
31
43
  <style>
32
44
  body {
33
45
  }
@@ -35,7 +35,19 @@ const Template: Story<ArgTypes> = ({
35
35
  disabled
36
36
  }: ArgTypes) => html`
37
37
  <link href="/themes/app-theme.css" rel="stylesheet" />
38
- <link href="https://fonts.googleapis.com/css?family=Material+Icons&display=block" rel="stylesheet" />
38
+
39
+ <link
40
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL@20..48,100..700,0..1"
41
+ rel="stylesheet"
42
+ />
43
+ <link
44
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL@20..48,100..700,0..1"
45
+ rel="stylesheet"
46
+ />
47
+ <link
48
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Sharp:opsz,wght,FILL@20..48,100..700,0..1"
49
+ rel="stylesheet"
50
+ />
39
51
 
40
52
  <div style="height: 300px">
41
53
  <ox-select