noph-ui 0.12.16 → 0.12.19

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 (6) hide show
  1. package/dist/button/SegmentedButton.svelte +1 -1
  2. package/dist/menu/Menu.svelte +1 -0
  3. package/dist/select/Select.svelte +14 -5
  4. package/dist/select/types.d.ts +1 -0
  5. package/dist/themes/defaultTheme.css +6 -3
  6. package/package.json +6 -6
package/dist/button/SegmentedButton.svelte CHANGED
@@ -20,7 +20,7 @@
20
20
  bind:this={element}
21
21
  style="{attributes.style};grid-template-columns: repeat({options.length}, minmax(max-content, 1fr));"
22
22
  >
23
- {#each options as option, i}
23
+ {#each options as option, i (i)}
24
24
  <label class={['np-segmented-button', option.icon && 'width-icon']}>
25
25
  <div class="check-icon-wrapper">
26
26
  <div class="check-icon">
package/dist/menu/Menu.svelte CHANGED
@@ -144,6 +144,7 @@
144
144
  justify-self: var(--np-menu-justify-self, anchor-center);
145
145
  position-area: var(--np-menu-position-area, bottom center);
146
146
  position-try: normal flip-block;
147
+ z-index: 1000;
147
148
  }
148
149
 
149
150
  .np-menu-container:popover-open {
package/dist/select/Select.svelte CHANGED
@@ -13,6 +13,7 @@
13
13
  supportingText = '',
14
14
  tabindex = 0,
15
15
  start,
16
+ end,
16
17
  label,
17
18
  style,
18
19
  noAsterisk = false,
@@ -95,8 +96,12 @@
95
96
  bind:clientWidth
96
97
  autofocus={disabled ? false : autofocus}
97
98
  onclick={(event) => {
98
- event.preventDefault()
99
- menuElement?.showPopover()
99
+ const target = event.target as HTMLElement
100
+ const link = target.closest('a[href]')
101
+ if (!link) {
102
+ event.preventDefault()
103
+ menuElement?.showPopover()
104
+ }
100
105
  }}
101
106
  onkeydown={(event) => {
102
107
  if (event.key === 'Tab') {
@@ -171,7 +176,7 @@
171
176
  bind:value
172
177
  bind:this={selectElement}
173
178
  >
174
- {#each options as option}
179
+ {#each options as option, index (index)}
175
180
  <option value={option.value} selected={option.selected}>{option.label}</option>
176
181
  {/each}
177
182
  </select>
@@ -184,7 +189,11 @@
184
189
  </div>
185
190
  <div class="end">
186
191
  <span class="icon trailing">
187
- {@render arrows()}
192
+ {#if end}
193
+ {@render end()}
194
+ {:else}
195
+ {@render arrows()}
196
+ {/if}
188
197
  </span>
189
198
  </div>
190
199
  </div>
@@ -219,7 +228,7 @@
219
228
  }}
220
229
  bind:element={menuElement}
221
230
  >
222
- {#each options as option}
231
+ {#each options as option, index (index)}
223
232
  <Item
224
233
  onclick={(event) => {
225
234
  value = option.value
package/dist/select/types.d.ts CHANGED
@@ -7,6 +7,7 @@ export interface SelectProps extends Omit<HTMLSelectAttributes, 'multiple' | 'si
7
7
  errorText?: string;
8
8
  variant?: 'outlined' | 'filled';
9
9
  start?: Snippet;
10
+ end?: Snippet;
10
11
  noAsterisk?: boolean;
11
12
  element?: HTMLSpanElement;
12
13
  options: {
package/dist/themes/defaultTheme.css CHANGED
@@ -55,11 +55,14 @@
55
55
  --np-color-tertiary-fixed-dim: light-dark(#eab2ff, #eab2ff);
56
56
  --np-color-tertiary-palette-key-color: light-dark(#d29be8, #d29be8);
57
57
 
58
- --np-elevation-1: rgba(0, 0, 0, 0.2) 0px 3px 1px -2px, rgba(0, 0, 0, 0.14) 0px 2px 2px 0px,
58
+ --np-elevation-1:
59
+ rgba(0, 0, 0, 0.2) 0px 3px 1px -2px, rgba(0, 0, 0, 0.14) 0px 2px 2px 0px,
59
60
  rgba(0, 0, 0, 0.12) 0px 1px 5px 0px;
60
- --np-elevation-2: rgba(0, 0, 0, 0.2) 0px 2px 4px -1px, rgba(0, 0, 0, 0.14) 0px 4px 5px 0px,
61
+ --np-elevation-2:
62
+ rgba(0, 0, 0, 0.2) 0px 2px 4px -1px, rgba(0, 0, 0, 0.14) 0px 4px 5px 0px,
61
63
  rgba(0, 0, 0, 0.12) 0px 1px 10px 0px;
62
- --np-elevation-3: rgba(0, 0, 0, 0.2) 0px 5px 5px -3px, rgba(0, 0, 0, 0.14) 0px 8px 10px 1px,
64
+ --np-elevation-3:
65
+ rgba(0, 0, 0, 0.2) 0px 5px 5px -3px, rgba(0, 0, 0, 0.14) 0px 8px 10px 1px,
63
66
  rgba(0, 0, 0, 0.12) 0px 3px 14px 2px;
64
67
  --np-shape-corner-full: 9999px;
65
68
  --np-shape-corner-extra-small: 0.25rem;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "noph-ui",
3
- "version": "0.12.16",
3
+ "version": "0.12.19",
4
4
  "license": "MIT",
5
5
  "homepage": "https://noph.dev",
6
6
  "repository": {
@@ -55,13 +55,13 @@
55
55
  "@material/material-color-utilities": "^0.3.0",
56
56
  "@playwright/test": "^1.50.1",
57
57
  "@sveltejs/adapter-vercel": "^5.6.3",
58
- "@sveltejs/kit": "^2.17.2",
58
+ "@sveltejs/kit": "^2.17.3",
59
59
  "@sveltejs/package": "^2.3.10",
60
60
  "@sveltejs/vite-plugin-svelte": "^5.0.3",
61
61
  "@types/eslint": "^9.6.1",
62
62
  "eslint": "^9.21.0",
63
63
  "eslint-config-prettier": "^10.0.1",
64
- "eslint-plugin-svelte": "^2.46.1",
64
+ "eslint-plugin-svelte": "^3.0.0",
65
65
  "globals": "^16.0.0",
66
66
  "prettier": "^3.5.2",
67
67
  "prettier-plugin-svelte": "^3.3.3",
@@ -69,9 +69,9 @@
69
69
  "svelte": "^5.20.4",
70
70
  "svelte-check": "^4.1.4",
71
71
  "typescript": "^5.7.3",
72
- "typescript-eslint": "^8.24.1",
73
- "vite": "^6.1.1",
74
- "vitest": "^3.0.6"
72
+ "typescript-eslint": "^8.25.0",
73
+ "vite": "^6.2.0",
74
+ "vitest": "^3.0.7"
75
75
  },
76
76
  "svelte": "./dist/index.js",
77
77
  "types": "./dist/index.d.ts",