noph-ui 0.21.1 → 0.21.3

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 (7) hide show
  1. package/dist/button/Button.svelte +1 -1
  2. package/dist/button/IconButton.svelte +2 -0
  3. package/dist/chip/AssistChip.svelte +0 -2
  4. package/dist/chip/FilterChip.svelte +8 -8
  5. package/dist/chip/InputChip.svelte +8 -9
  6. package/dist/snackbar/Snackbar.svelte +0 -5
  7. package/package.json +1 -1
package/dist/button/Button.svelte CHANGED
@@ -100,7 +100,7 @@
100
100
  class={[
101
101
  'np-button',
102
102
  size,
103
- selected ? 'square' : 'round',
103
+ selected || loading ? 'square' : shape,
104
104
  toggle ? 'toggle' : '',
105
105
  'enabled',
106
106
  variant,
package/dist/button/IconButton.svelte CHANGED
@@ -132,6 +132,8 @@
132
132
 
133
133
  :global(.np-icon-button svg) {
134
134
  fill: currentColor;
135
+ height: var(--_icon-size, 1.25rem);
136
+ width: var(--_icon-size, 1.25rem);
135
137
  }
136
138
 
137
139
  .xs {
package/dist/chip/AssistChip.svelte CHANGED
@@ -15,8 +15,6 @@
15
15
  <Button
16
16
  size="xs"
17
17
  shape="square"
18
- --np-elevated-button-container-shape="var(--np-assist-chip-container-shape, var(--np-shape-corner-small))"
19
- --np-outlined-button-container-shape="var(--np-assist-chip-container-shape, var(--np-shape-corner-small))"
20
18
  --np-elevated-button-label-text-color="var(--np-assist-chip-label-text-color, var(--np-color-on-surface-variant))"
21
19
  --np-outlined-button-label-text-color="var(--np-assist-chip-label-text-color, var(--np-color-on-surface-variant))"
22
20
  --np-outlined-button-outline-color="var(--np-assist-chip-outline-color, var(--np-color-outline-variant))"
package/dist/chip/FilterChip.svelte CHANGED
@@ -86,8 +86,7 @@
86
86
  <IconButton
87
87
  {disabled}
88
88
  type="button"
89
- --np-icon-button-container-height="1.75rem"
90
- --np-icon-button-container-width="1.75rem"
89
+ size="xs"
91
90
  --np-icon-button-icon-size="1.125rem"
92
91
  aria-label={ariaLabelRemove}
93
92
  onclick={(
@@ -158,10 +157,10 @@
158
157
  padding-left: 0.5rem;
159
158
  }
160
159
  .np-filter-chip-removable {
161
- padding-right: 2px;
160
+ padding-right: 1px;
162
161
  }
163
162
  .np-filter-chip-removable .np-filter-chip-label {
164
- padding-right: 2px;
163
+ padding-right: 1px;
165
164
  }
166
165
  .np-chip-label {
167
166
  line-height: 1.25rem;
@@ -179,12 +178,13 @@
179
178
  pointer-events: none;
180
179
  }
181
180
  .np-filter-chip-default::before {
182
- border-width: 1px;
183
- border-style: solid;
184
- border-color: var(--np-filter-chip-outline-color, var(--np-color-outline-variant));
181
+ outline-style: solid;
182
+ outline-color: var(--np-filter-chip-outline-color, var(--np-color-outline-variant));
183
+ outline-width: 1px;
184
+ outline-offset: -1px;
185
185
  }
186
186
  .np-filter-chip:has(input:checked)::before {
187
- border-width: 0;
187
+ outline-style: none;
188
188
  background-color: var(--np-color-secondary-container);
189
189
  }
190
190
  .np-filter-chip-elevated {
package/dist/chip/InputChip.svelte CHANGED
@@ -71,8 +71,7 @@
71
71
  <IconButton
72
72
  {disabled}
73
73
  type="button"
74
- --np-icon-button-container-height="1.75rem"
75
- --np-icon-button-container-width="1.75rem"
74
+ size="xs"
76
75
  --np-icon-button-icon-size="1.125rem"
77
76
  aria-label={ariaLabelRemove}
78
77
  onclick={(
@@ -116,7 +115,7 @@
116
115
  border-radius: var(--np-input-chip-container-shape, var(--np-shape-corner-small));
117
116
  --np-icon-button-icon-color: var(--np-color-on-surface-variant);
118
117
  --np-icon-size: 1.125rem;
119
- padding-right: 2px;
118
+ padding-right: 1px;
120
119
  min-width: 0;
121
120
  }
122
121
  .np-input-chip-label input {
@@ -135,7 +134,6 @@
135
134
  gap: 0.5rem;
136
135
  z-index: 1;
137
136
  padding-left: 1rem;
138
- padding-right: 2px;
139
137
  overflow: hidden;
140
138
  }
141
139
  .np-chip-icon {
@@ -149,7 +147,7 @@
149
147
  line-height: 1.25rem;
150
148
  font-size: 0.875rem;
151
149
  font-weight: 500;
152
- padding-right: 2px;
150
+ padding-right: 1px;
153
151
  white-space: pre;
154
152
  overflow: hidden;
155
153
  text-overflow: ellipsis;
@@ -160,12 +158,13 @@
160
158
  inset: 0;
161
159
  border-radius: inherit;
162
160
  pointer-events: none;
163
- border-width: 1px;
164
- border-style: solid;
165
- border-color: var(--np-input-chip-outline-color, var(--np-color-outline-variant));
161
+ outline-style: solid;
162
+ outline-color: var(--np-input-chip-outline-color, var(--np-color-outline-variant));
163
+ outline-width: 1px;
164
+ outline-offset: -1px;
166
165
  }
167
166
  .np-input-chip-selected::before {
168
- border-width: 0;
167
+ outline-style: none;
169
168
  background-color: var(--np-color-secondary-container);
170
169
  }
171
170
  .np-input-chip-selected {
package/dist/snackbar/Snackbar.svelte CHANGED
@@ -62,8 +62,6 @@
62
62
  <Button
63
63
  variant="text"
64
64
  --np-text-button-label-text-color="var(--np-snackbar-action-color, var(--np-color-inverse-primary))"
65
- --np-text-button-container-shape="0"
66
- style="height:{buttonHeight};margin-right:0.25rem"
67
65
  aria-label={actionLabel}
68
66
  onclick={onActionClick}
69
67
  >
@@ -74,9 +72,6 @@
74
72
  <div class="np-snackbar-icon-container">
75
73
  <IconButton
76
74
  --np-icon-button-icon-color="var(--np-snackbar-text-color, var(--np-color-inverse-on-surface))"
77
- --np-icon-button-container-shape="0"
78
- --np-icon-button-container-height={buttonHeight}
79
- --np-icon-button-container-width="2.75rem"
80
75
  aria-label="Close"
81
76
  onclick={onIconClick}
82
77
  >
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "noph-ui",
3
- "version": "0.21.1",
3
+ "version": "0.21.3",
4
4
  "license": "MIT",
5
5
  "homepage": "https://noph.dev",
6
6
  "repository": {