@sparklingopinions/sparkling-ui 0.9.3 → 0.10.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.
- package/dist/aliases.d.ts +3 -3
- package/dist/components/Badge/Badge.js.map +1 -1
- package/dist/components/Badge/Badge.vue.d.ts +6 -3
- package/dist/components/Badge/Badge.vue_vue_type_script_setup_true_lang.js +2 -2
- package/dist/components/Badge/Badge.vue_vue_type_script_setup_true_lang.js.map +1 -1
- package/package.json +1 -1
package/dist/aliases.d.ts
CHANGED
|
@@ -126,7 +126,7 @@ export type ConfirmDialogProps = AlertDialogProps;
|
|
|
126
126
|
/** @deprecated Renamed to Badge. */
|
|
127
127
|
export declare const Pill: {
|
|
128
128
|
new (...args: any[]): import("vue").CreateComponentPublicInstanceWithMixins<Readonly<BadgeProps> & Readonly<{}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, import("vue").PublicProps, {
|
|
129
|
-
variant: "text" | "soft";
|
|
129
|
+
variant: "text" | "soft" | "outline";
|
|
130
130
|
label: string;
|
|
131
131
|
tone: BadgeTone;
|
|
132
132
|
dot: boolean;
|
|
@@ -138,7 +138,7 @@ export declare const Pill: {
|
|
|
138
138
|
M: {};
|
|
139
139
|
Defaults: {};
|
|
140
140
|
}, Readonly<BadgeProps> & Readonly<{}>, {}, {}, {}, {}, {
|
|
141
|
-
variant: "text" | "soft";
|
|
141
|
+
variant: "text" | "soft" | "outline";
|
|
142
142
|
label: string;
|
|
143
143
|
tone: BadgeTone;
|
|
144
144
|
dot: boolean;
|
|
@@ -147,7 +147,7 @@ export declare const Pill: {
|
|
|
147
147
|
__isTeleport?: never;
|
|
148
148
|
__isSuspense?: never;
|
|
149
149
|
} & import("vue").ComponentOptionsBase<Readonly<BadgeProps> & Readonly<{}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, {
|
|
150
|
-
variant: "text" | "soft";
|
|
150
|
+
variant: "text" | "soft" | "outline";
|
|
151
151
|
label: string;
|
|
152
152
|
tone: BadgeTone;
|
|
153
153
|
dot: boolean;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Badge.js","names":["_sfc_main","Badge_vue_vue_type_script_setup_true_lang_default","Badge_default"],"sources":["../../../src/components/Badge/Badge.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue'\n\nexport type BadgeTone = 'neutral' | 'accent' | 'success' | 'warning' | 'info' | 'danger'\n\nexport interface BadgeProps {\n tone?: BadgeTone\n
|
|
1
|
+
{"version":3,"file":"Badge.js","names":["_sfc_main","Badge_vue_vue_type_script_setup_true_lang_default","Badge_default"],"sources":["../../../src/components/Badge/Badge.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue'\n\nexport type BadgeTone = 'neutral' | 'accent' | 'success' | 'warning' | 'info' | 'danger'\n\nexport interface BadgeProps {\n tone?: BadgeTone\n /**\n * `soft` is a tinted chip; `text` is a dot and a coloured label, lighter; `outline` is a small\n * neutral pill (the dot carries the tone) for a count that isn't the page's own.\n */\n variant?: 'soft' | 'text' | 'outline'\n dot?: boolean\n label?: string\n}\n\nconst props = withDefaults(defineProps<BadgeProps>(), { tone: 'neutral', variant: 'soft', dot: true, label: undefined })\n\nconst tones: Record<BadgeTone, { chip: string; text: string; dot: string }> = {\n neutral: { chip: 'bg-sui-sunken text-sui-ink-subtle', text: 'text-sui-ink-muted', dot: 'bg-sui-mark-faint' },\n accent: { chip: 'bg-sui-accent-wash text-sui-accent', text: 'text-sui-accent', dot: 'bg-sui-accent-solid' },\n success: {\n chip: 'bg-sui-success-soft text-sui-success',\n text: 'text-sui-success',\n dot: 'bg-sui-success-mid'\n },\n warning: {\n chip: 'bg-sui-warning-soft text-sui-warning',\n text: 'text-sui-warning',\n dot: 'bg-sui-warning-bright'\n },\n info: { chip: 'bg-sui-info-soft text-sui-info', text: 'text-sui-info', dot: 'bg-sui-info-mid' },\n danger: { chip: 'bg-sui-danger-soft text-sui-danger', text: 'text-sui-danger', dot: 'bg-sui-danger-solid' }\n}\n\nconst tone = computed(() => tones[props.tone])\n\nconst shape = computed(() => {\n if (props.variant === 'soft') return ['h-6 gap-1.5 rounded-md px-2.5 text-xs font-medium', tone.value.chip]\n if (props.variant === 'outline')\n return 'h-5 gap-1.25 rounded-full border border-sui-line bg-sui-surface pr-1.75 pl-1.5 text-11.5 leading-none font-semibold text-sui-ink-emphasis tabular-nums'\n return ['gap-1.5 text-xs font-medium', tone.value.text]\n})\n</script>\n\n<template>\n <span class=\"inline-flex items-center whitespace-nowrap\" :class=\"shape\">\n <span v-if=\"dot\" class=\"h-1.5 w-1.5 shrink-0 rounded-full\" :class=\"tone.dot\" />\n <slot>{{ label }}</slot>\n </span>\n</template>\n"],"mappings":""}
|
|
@@ -1,8 +1,11 @@
|
|
|
1
1
|
export type BadgeTone = 'neutral' | 'accent' | 'success' | 'warning' | 'info' | 'danger';
|
|
2
2
|
export interface BadgeProps {
|
|
3
3
|
tone?: BadgeTone;
|
|
4
|
-
/**
|
|
5
|
-
|
|
4
|
+
/**
|
|
5
|
+
* `soft` is a tinted chip; `text` is a dot and a coloured label, lighter; `outline` is a small
|
|
6
|
+
* neutral pill (the dot carries the tone) for a count that isn't the page's own.
|
|
7
|
+
*/
|
|
8
|
+
variant?: 'soft' | 'text' | 'outline';
|
|
6
9
|
dot?: boolean;
|
|
7
10
|
label?: string;
|
|
8
11
|
}
|
|
@@ -11,7 +14,7 @@ type __VLS_Slots = {} & {
|
|
|
11
14
|
default?: (props: typeof __VLS_1) => any;
|
|
12
15
|
};
|
|
13
16
|
declare const __VLS_base: import("vue").DefineComponent<BadgeProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<BadgeProps> & Readonly<{}>, {
|
|
14
|
-
variant: "text" | "soft";
|
|
17
|
+
variant: "text" | "soft" | "outline";
|
|
15
18
|
label: string;
|
|
16
19
|
tone: BadgeTone;
|
|
17
20
|
dot: boolean;
|
|
@@ -43,8 +43,8 @@ var l = /*@__PURE__*/ i({
|
|
|
43
43
|
text: "text-sui-danger",
|
|
44
44
|
dot: "bg-sui-danger-solid"
|
|
45
45
|
}
|
|
46
|
-
}, d = e(() => u[l.tone]);
|
|
47
|
-
return (e, l) => (o(), n("span", { class: a(["inline-flex items-center
|
|
46
|
+
}, d = e(() => u[l.tone]), f = e(() => l.variant === "soft" ? ["h-6 gap-1.5 rounded-md px-2.5 text-xs font-medium", d.value.chip] : l.variant === "outline" ? "h-5 gap-1.25 rounded-full border border-sui-line bg-sui-surface pr-1.75 pl-1.5 text-11.5 leading-none font-semibold text-sui-ink-emphasis tabular-nums" : ["gap-1.5 text-xs font-medium", d.value.text]);
|
|
47
|
+
return (e, l) => (o(), n("span", { class: a(["inline-flex items-center whitespace-nowrap", f.value]) }, [i.dot ? (o(), n("span", {
|
|
48
48
|
key: 0,
|
|
49
49
|
class: a(["h-1.5 w-1.5 shrink-0 rounded-full", d.value.dot])
|
|
50
50
|
}, null, 2)) : t("", !0), s(e.$slots, "default", {}, () => [r(c(i.label), 1)])], 2));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Badge.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createElementBlock","_normalizeClass","_createCommentVNode","_renderSlot","_createTextVNode","_toDisplayString","Badge_vue_vue_type_script_setup_true_lang_default","props","__props","tones","tone","computed","openBlock","createElementBlock","normalizeClass","createCommentVNode","renderSlot","_ctx","createTextVNode","toDisplayString"],"sources":["../../../src/components/Badge/Badge.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue'\n\nexport type BadgeTone = 'neutral' | 'accent' | 'success' | 'warning' | 'info' | 'danger'\n\nexport interface BadgeProps {\n tone?: BadgeTone\n
|
|
1
|
+
{"version":3,"file":"Badge.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createElementBlock","_normalizeClass","_createCommentVNode","_renderSlot","_createTextVNode","_toDisplayString","Badge_vue_vue_type_script_setup_true_lang_default","props","__props","tones","tone","computed","shape","openBlock","createElementBlock","normalizeClass","createCommentVNode","renderSlot","_ctx","createTextVNode","toDisplayString"],"sources":["../../../src/components/Badge/Badge.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue'\n\nexport type BadgeTone = 'neutral' | 'accent' | 'success' | 'warning' | 'info' | 'danger'\n\nexport interface BadgeProps {\n tone?: BadgeTone\n /**\n * `soft` is a tinted chip; `text` is a dot and a coloured label, lighter; `outline` is a small\n * neutral pill (the dot carries the tone) for a count that isn't the page's own.\n */\n variant?: 'soft' | 'text' | 'outline'\n dot?: boolean\n label?: string\n}\n\nconst props = withDefaults(defineProps<BadgeProps>(), { tone: 'neutral', variant: 'soft', dot: true, label: undefined })\n\nconst tones: Record<BadgeTone, { chip: string; text: string; dot: string }> = {\n neutral: { chip: 'bg-sui-sunken text-sui-ink-subtle', text: 'text-sui-ink-muted', dot: 'bg-sui-mark-faint' },\n accent: { chip: 'bg-sui-accent-wash text-sui-accent', text: 'text-sui-accent', dot: 'bg-sui-accent-solid' },\n success: {\n chip: 'bg-sui-success-soft text-sui-success',\n text: 'text-sui-success',\n dot: 'bg-sui-success-mid'\n },\n warning: {\n chip: 'bg-sui-warning-soft text-sui-warning',\n text: 'text-sui-warning',\n dot: 'bg-sui-warning-bright'\n },\n info: { chip: 'bg-sui-info-soft text-sui-info', text: 'text-sui-info', dot: 'bg-sui-info-mid' },\n danger: { chip: 'bg-sui-danger-soft text-sui-danger', text: 'text-sui-danger', dot: 'bg-sui-danger-solid' }\n}\n\nconst tone = computed(() => tones[props.tone])\n\nconst shape = computed(() => {\n if (props.variant === 'soft') return ['h-6 gap-1.5 rounded-md px-2.5 text-xs font-medium', tone.value.chip]\n if (props.variant === 'outline')\n return 'h-5 gap-1.25 rounded-full border border-sui-line bg-sui-surface pr-1.75 pl-1.5 text-11.5 leading-none font-semibold text-sui-ink-emphasis tabular-nums'\n return ['gap-1.5 text-xs font-medium', tone.value.text]\n})\n</script>\n\n<template>\n <span class=\"inline-flex items-center whitespace-nowrap\" :class=\"shape\">\n <span v-if=\"dot\" class=\"h-1.5 w-1.5 shrink-0 rounded-full\" :class=\"tone.dot\" />\n <slot>{{ label }}</slot>\n </span>\n</template>\n"],"mappings":";;;;;;;;;;;;;;EAgBA,IAAMQ,IAAQC,GAERC,IAAwE;GAC5E,SAAS;IAAE,MAAM;IAAqC,MAAM;IAAsB,KAAK;GAAoB;GAC3G,QAAQ;IAAE,MAAM;IAAsC,MAAM;IAAmB,KAAK;GAAsB;GAC1G,SAAS;IACP,MAAM;IACN,MAAM;IACN,KAAK;GACP;GACA,SAAS;IACP,MAAM;IACN,MAAM;IACN,KAAK;GACP;GACA,MAAM;IAAE,MAAM;IAAkC,MAAM;IAAiB,KAAK;GAAkB;GAC9F,QAAQ;IAAE,MAAM;IAAsC,MAAM;IAAmB,KAAK;GAAsB;EAC5G,GAEMC,IAAOC,QAAeF,EAAMF,EAAM,KAAK,GAEvCK,IAAQD,QACRJ,EAAM,YAAY,SAAe,CAAC,qDAAqDG,EAAK,MAAM,IAAI,IACtGH,EAAM,YAAY,YACb,2JACF,CAAC,+BAA+BG,EAAK,MAAM,IAAI,CACvD;E,kBAICX,EAAA,GAAAC,EAGO,QAAA,EAHD,OAAKC,EAAA,CAAC,8CAAqDW,EAAA,KAAK,CAAA,E,IACxDJ,EAAA,OAAZT,EAAA,GAAAC,EAA+E,QAAA;;GAA9D,OAAKC,EAAA,CAAC,qCAA4CS,EAAA,MAAK,GAAG,CAAA;E,0BAC3EP,EAAwBe,EAAA,QAAA,WAAA,CAAA,SAAA,CAAfd,EAAAC,EAAAG,EAAA,KAAK,GAAA,CAAA,C"}
|