@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.
- package/dist/views/core/button/components/button/button.svelte +9 -8
- package/dist/views/core/button/components/button/button.svelte.d.ts +1 -1
- package/dist/views/core/input/components/color-field/color-field.svelte +1 -1
- package/dist/views/core/input/components/input-field/input-field.svelte +2 -2
- package/dist/views/core/input/components/phone-field/phone-field.svelte +1 -1
- package/package.json +1 -1
|
@@ -2,9 +2,9 @@
|
|
|
2
2
|
export type ButtonAppearance =
|
|
3
3
|
| 'none'
|
|
4
4
|
| 'primary'
|
|
5
|
-
| '
|
|
5
|
+
| 'neutral'
|
|
6
6
|
| 'border'
|
|
7
|
-
| 'border-
|
|
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
|
|
54
|
-
import {
|
|
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 '
|
|
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-
|
|
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
|
|
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
|
|
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' | '
|
|
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 = {
|
|
@@ -156,7 +156,7 @@
|
|
|
156
156
|
if (size) {
|
|
157
157
|
switch (size) {
|
|
158
158
|
case 'lg':
|
|
159
|
-
sizeClassName = 'p-4 text-
|
|
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-
|
|
205
|
+
className = 'text-neutral';
|
|
206
206
|
break;
|
|
207
207
|
case 'md':
|
|
208
208
|
className = 'text-sm';
|