@marianmeres/stuic 1.24.0 → 1.26.0

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.
@@ -50,7 +50,7 @@ export declare const createAlertConfirmPromptStore: () => {
50
50
  confirm: (onOk: FnOnOK, o?: Partial<Dialog>) => void;
51
51
  prompt: (onOk: FnOnOK, o?: Partial<Dialog>) => void;
52
52
  };
53
- export declare const createAlert: (acp: ReturnType<typeof createAlertConfirmPromptStore>) => (message: string, o?: Partial<Dialog>) => Promise<unknown>;
54
- export declare const createConfirm: (acp: ReturnType<typeof createAlertConfirmPromptStore>) => (message: string, o?: Partial<Dialog>) => Promise<unknown>;
55
- export declare const createPrompt: (acp: ReturnType<typeof createAlertConfirmPromptStore>) => (message: string, defaultValue?: string, o?: Partial<Dialog>) => Promise<unknown>;
53
+ export declare const createAlert: (acp: ReturnType<typeof createAlertConfirmPromptStore>, defaults?: Partial<Dialog>) => (message: string, o?: Partial<Dialog>) => Promise<unknown>;
54
+ export declare const createConfirm: (acp: ReturnType<typeof createAlertConfirmPromptStore>, defaults?: Partial<Dialog>) => (message: string, o?: Partial<Dialog>) => Promise<unknown>;
55
+ export declare const createPrompt: (acp: ReturnType<typeof createAlertConfirmPromptStore>, defaults?: Partial<Dialog>) => (message: string, defaultValue?: string, o?: Partial<Dialog>) => Promise<unknown>;
56
56
  export {};
@@ -80,9 +80,10 @@ export const createAlertConfirmPromptStore = () => {
80
80
  };
81
81
  };
82
82
  // sugar helpers to patch the native window.alert/confirm/prompt
83
- export const createAlert = (acp) =>
83
+ export const createAlert = (acp, defaults) =>
84
84
  // allowing to add the custom param outside of the native signature
85
85
  (message, o) => new Promise((resolve) => acp.alert({
86
+ ...(defaults || {}),
86
87
  onOk: () => {
87
88
  acp.close();
88
89
  resolve(undefined);
@@ -94,12 +95,13 @@ export const createAlert = (acp) =>
94
95
  },
95
96
  ...(o || {}),
96
97
  }));
97
- export const createConfirm = (acp) =>
98
+ export const createConfirm = (acp, defaults) =>
98
99
  // allowing to add the custom param outside of the native signature
99
100
  (message, o) => new Promise((resolve) => acp.confirm(() => {
100
101
  acp.close();
101
102
  resolve(true);
102
103
  }, {
104
+ ...(defaults || {}),
103
105
  content: message,
104
106
  onCancel: () => {
105
107
  acp.close();
@@ -111,12 +113,13 @@ export const createConfirm = (acp) =>
111
113
  },
112
114
  ...(o || {}),
113
115
  }));
114
- export const createPrompt = (acp) =>
116
+ export const createPrompt = (acp, defaults) =>
115
117
  // allowing to add the custom param outside of the native signature
116
118
  (message, defaultValue = '', o) => new Promise((resolve) => acp.prompt((value) => {
117
119
  acp.close();
118
120
  resolve(value);
119
121
  }, {
122
+ ...(defaults || {}),
120
123
  content: message,
121
124
  value: defaultValue,
122
125
  onCancel: () => {
@@ -49,13 +49,9 @@ export class ButtonConfig {
49
49
  static class = "";
50
50
  // to be defined at consumer level...
51
51
  static variant = {
52
- // primary: `
53
- // bg-[rgb(var(--primary))] text-[rgb(var(--on-primary))]
54
- // dark:bg-[rgb(var(--primary-dark))] dark:text-[rgb(var(--on-primary-dark))]
55
- // `.trim(),
56
52
  primary: `
57
- bg-primary text-on-primary
58
- dark:bg-primary-dark dark:text-on-primary-dark
53
+ bg-stuic-primary text-stuic-on-primary
54
+ dark:bg-stuic-primary-dark dark:text-stuic-on-primary-dark
59
55
  `.trim()
60
56
  };
61
57
  }
@@ -24,7 +24,7 @@ export { _class as class };
24
24
  export let labelClass = "";
25
25
  export let wrapClass = "";
26
26
  export let inputClass = "";
27
- export let invalidClass = "border-primary";
27
+ export let invalidClass = "border-stuic-primary";
28
28
  export let size = "md";
29
29
  export let id = getId();
30
30
  export let value;
@@ -93,9 +93,9 @@ $:
93
93
  class={twMerge(`
94
94
  rounded-md border border-gray-300
95
95
  bg-gray-100
96
- focus-within:border-primary
96
+ focus-within:border-stuic-primary
97
97
  focus-within:ring-4
98
- focus-within:ring-primary
98
+ focus-within:ring-stuic-primary
99
99
  focus-within:ring-opacity-20
100
100
  ${wrapClass}
101
101
  ${validation && !validation.valid ? invalidClass : ''}
@@ -160,7 +160,7 @@ $:
160
160
  <div
161
161
  transition:slide={{ duration: 150 }}
162
162
  class={twMerge(
163
- `mt-1 text-xs text-primary px-2 tracking-tight ${validationMessageClass}`
163
+ `mt-1 text-xs text-stuic-primary px-2 tracking-tight ${validationMessageClass}`
164
164
  )}
165
165
  >
166
166
  {@html validation.message}
@@ -6,7 +6,7 @@ import { slide } from "svelte/transition";
6
6
  import { getId } from "../../index.js";
7
7
  let _class = "";
8
8
  export { _class as class };
9
- export let invalidClass = "border-primary";
9
+ export let invalidClass = "border-stuic-primary";
10
10
  export let labelClass = "";
11
11
  export let descriptionClass = "";
12
12
  export let size = "md";
@@ -45,12 +45,12 @@ let idDesc = getId();
45
45
  bg-gray-100
46
46
  border-gray-300
47
47
  shadow-sm
48
- text-primary
48
+ text-stuic-primary
49
49
  cursor-pointer
50
- focus:border-primary
50
+ focus:border-stuic-primary
51
51
  focus:ring-4
52
52
  focus:ring-offset-0
53
- focus:ring-primary
53
+ focus:ring-stuic-primary
54
54
  focus:ring-opacity-20
55
55
  disabled:cursor-not-allowed
56
56
  ${validation && !validation.valid ? invalidClass : ''}
@@ -78,7 +78,9 @@ let idDesc = getId();
78
78
  {#if validation && !validation?.valid}
79
79
  <div
80
80
  transition:slide={{ duration: 150 }}
81
- class={twMerge(`text-xs text-primary tracking-tight ${validationMessageClass}`)}
81
+ class={twMerge(
82
+ `text-xs text-stuic-primary tracking-tight ${validationMessageClass}`
83
+ )}
82
84
  >
83
85
  {@html validation.message}
84
86
  </div>
@@ -20,7 +20,7 @@ export let options = [];
20
20
  let _class = "";
21
21
  export { _class as class };
22
22
  export let wrapClass = "";
23
- export let invalidClass = "border-primary";
23
+ export let invalidClass = "border-stuic-primary";
24
24
  export let size = "md";
25
25
  export let id = getId();
26
26
  export let value;
@@ -79,9 +79,9 @@ $:
79
79
  flex items-center
80
80
  rounded-md border border-gray-300
81
81
  bg-gray-100
82
- focus-within:border-primary
82
+ focus-within:border-stuic-primary
83
83
  focus-within:ring-4
84
- focus-within:ring-primary
84
+ focus-within:ring-stuic-primary
85
85
  focus-within:ring-opacity-20
86
86
  ${wrapClass}
87
87
  ${validation && !validation.valid ? invalidClass : ''}
@@ -113,7 +113,7 @@ $:
113
113
  <div
114
114
  transition:slide={{ duration: 150 }}
115
115
  class={twMerge(
116
- `mt-1 text-xs text-primary px-2 tracking-tight ${validationMessageClass}`
116
+ `mt-1 text-xs text-stuic-primary px-2 tracking-tight ${validationMessageClass}`
117
117
  )}
118
118
  >
119
119
  {@html validation.message}
@@ -8,7 +8,7 @@ import { createEventDispatcher, onMount } from "svelte";
8
8
  const dispatch = createEventDispatcher();
9
9
  let _class = "";
10
10
  export { _class as class };
11
- export let invalidClass = "border-primary";
11
+ export let invalidClass = "border-stuic-primary";
12
12
  export let labelClass = "";
13
13
  export let descriptionClass = "";
14
14
  export let size = "md";
@@ -50,12 +50,12 @@ let idDesc = getId();
50
50
  bg-gray-100
51
51
  border-gray-300
52
52
  shadow-sm
53
- text-primary
53
+ text-stuic-primary
54
54
  cursor-pointer
55
- focus:border-primary
55
+ focus:border-stuic-primary
56
56
  focus:ring-4
57
57
  focus:ring-offset-0
58
- focus:ring-primary
58
+ focus:ring-stuic-primary
59
59
  focus:ring-opacity-20
60
60
  disabled:cursor-not-allowed
61
61
  ${validation && !validation.valid ? invalidClass : ''}
@@ -82,7 +82,9 @@ let idDesc = getId();
82
82
  {#if validation && !validation?.valid}
83
83
  <div
84
84
  transition:slide={{ duration: 150 }}
85
- class={twMerge(`text-xs text-primary tracking-tight ${validationMessageClass}`)}
85
+ class={twMerge(
86
+ `text-xs text-stuic-primary tracking-tight ${validationMessageClass}`
87
+ )}
86
88
  >
87
89
  {@html validation.message}
88
90
  </div>
@@ -12,4 +12,7 @@ export let thc;
12
12
  {@html thc.html}
13
13
  {:else if thc?.component}
14
14
  <svelte:component this={thc.component} {...thc?.props || {}} />
15
+ {:else}
16
+ <!-- cast to string as the last resort -->
17
+ {thc}
15
18
  {/if}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@marianmeres/stuic",
3
- "version": "1.24.0",
3
+ "version": "1.26.0",
4
4
  "scripts": {
5
5
  "dev": "vite dev",
6
6
  "build": "vite build && npm run package && node ./scripts/date.js",