@cloudparker/moldex.js 4.1.4 → 4.1.6

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.
@@ -2,9 +2,9 @@
2
2
  export type ButtonAppearance =
3
3
  | 'none'
4
4
  | 'primary'
5
- | 'base'
5
+ | 'neutral'
6
6
  | 'border'
7
- | 'border-base'
7
+ | 'border-neutral'
8
8
  | 'border-primary';
9
9
 
10
10
  export type ButtonSize = 'none' | 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl';
@@ -50,8 +50,9 @@
50
50
 
51
51
  <script lang="ts">
52
52
  import { ripple, type RipplePropsType } from '../../../../../actions/ripple.js';
53
- import { Icon, mdiOpenInNew } from '../../../icon';
54
- import { Spinner } from '../../../spinner';
53
+ import Icon from '../../../icon/components/icon/icon.svelte';
54
+ import { mdiOpenInNew } from '../../../icon/index.js';
55
+ import Spinner from '../../../spinner/components/spinner/spinner.svelte';
55
56
  import type { Snippet } from 'svelte';
56
57
 
57
58
  let {
@@ -94,12 +95,12 @@
94
95
  switch (appearance) {
95
96
  case 'none':
96
97
  return 'text-neutral-800 dark:text-neutral-300 hover:text-neutral-900 disabled:text-neutral-400 dark:disabled:text-neutral-500 dark:hover:text-neutral-200';
97
- case 'base':
98
+ case 'neutral':
98
99
  return 'text-neutral-800 dark:text-neutral-300 hover:text-neutral-900 disabled:text-neutral-400 dark:disabled:text-neutral-500 dark:hover:text-neutral-200 bg-neutral-200 dark:bg-neutral-700 hover:bg-neutral-300 dark:hover:bg-neutral-600 disabled:hover:bg-neutral-200 dark:disabled:hover:bg-neutral-700 ';
99
100
  case 'primary':
100
101
  return 'text-primary-100 hover:text-primary-50 bg-primary-600 hover:bg-primary-500 disabled:text-neutral-400 dark:disabled:text-neutral-500 disabled:bg-neutral-200 dark:disabled:bg-neutral-700 disabled:hover:bg-neutral-200 dark:disabled:hover:bg-neutral-700 ';
101
102
  case 'border':
102
- case 'border-base':
103
+ case 'border-neutral':
103
104
  return 'border-2 text-neutral-800 dark:text-neutral-300 hover:text-neutral-900 disabled:text-neutral-400 dark:disabled:text-neutral-500 dark:hover:text-neutral-200 border-neutral-200 hover:border-neutral-300 dark:border-neutral-700 dark:hover:border-neutral-600 dark:disabled:border-neutral-200 dark:disabled:hover:border-neutral-200 dark:disabled:border-neutral-700 dark:disabled:hover:border-neutral-700 ';
104
105
  case 'border-primary':
105
106
  return 'border-2 text-primary hover:text-primary-500 disabled:text-neutral-400 dark:disabled:text-neutral-500 border-primary hover:border-primary-500 dark:border-primary-600 dark:hover:border-primary-500 dark:disabled:border-neutral-200 dark:disabled:hover:border-neutral-200 dark:disabled:border-neutral-700 dark:disabled:hover:border-neutral-700 ';
@@ -158,7 +159,7 @@
158
159
  {id}
159
160
  href={url}
160
161
  {target}
161
- class="relative w-max flex items-center justify-center gap-2 focus:outline-primary dark:focus:outline-primary rounded {btnSizeClassName} {btnAppearanceClassName} {className}"
162
+ class="relative flex w-max items-center justify-center gap-2 rounded focus:outline-primary dark:focus:outline-primary {btnSizeClassName} {btnAppearanceClassName} {className}"
162
163
  onclick={onClick}
163
164
  use:handleRipple
164
165
  ondblclick={onDblClick}
@@ -186,7 +187,7 @@
186
187
  {type}
187
188
  {form}
188
189
  {title}
189
- class="relative flex items-center justify-center gap-2 focus:outline-primary dark:focus:outline-primary rounded {btnSizeClassName} {btnAppearanceClassName} {className}"
190
+ class="relative flex items-center justify-center gap-2 rounded focus:outline-primary dark:focus:outline-primary {btnSizeClassName} {btnAppearanceClassName} {className}"
190
191
  {disabled}
191
192
  use:handleRipple
192
193
  onclick={onClick}
@@ -1,4 +1,4 @@
1
- export type ButtonAppearance = 'none' | 'primary' | 'base' | 'border' | 'border-base' | 'border-primary';
1
+ export type ButtonAppearance = 'none' | 'primary' | 'neutral' | 'border' | 'border-neutral' | 'border-primary';
2
2
  export type ButtonSize = 'none' | 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl';
3
3
  export type ButtonType = 'button' | 'submit' | 'reset';
4
4
  export type ButtonProps = {
@@ -48,7 +48,7 @@
48
48
 
49
49
  let colorValue: string = $derived.by(() => {
50
50
  if (isValidHexColor(value)) {
51
- colorValue = value;
51
+ return value;
52
52
  }
53
53
  return '#000000';
54
54
  });
@@ -156,7 +156,7 @@
156
156
  if (size) {
157
157
  switch (size) {
158
158
  case 'lg':
159
- sizeClassName = 'p-4 text-base';
159
+ sizeClassName = 'p-4 text-neutral';
160
160
  break;
161
161
  case 'md':
162
162
  sizeClassName = 'p-2.5 text-sm';
@@ -202,7 +202,7 @@
202
202
  if (size) {
203
203
  switch (size) {
204
204
  case 'lg':
205
- className = 'text-base';
205
+ className = 'text-neutral';
206
206
  break;
207
207
  case 'md':
208
208
  className = 'text-sm';
@@ -156,7 +156,7 @@
156
156
  </script>
157
157
 
158
158
  {#snippet dialCodePickerItemTile(item: any, index: number)}
159
- <div class="w-14 text-sm font-bold text-base">
159
+ <div class="w-14 text-sm font-bold text-neutral">
160
160
  {item.dialCode}
161
161
  </div>
162
162
  <div class="flex-grow">
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@cloudparker/moldex.js",
3
- "version": "4.1.4",
3
+ "version": "4.1.6",
4
4
  "keywords": [
5
5
  "svelte"
6
6
  ],