niuma-ui 1.1.12 → 1.2.0

package/dist/components/RsTimePickerColumns.impl.js

@@ -0,0 +1,172 @@
+import { useRsI18n } from "../composables/useRsI18n.js";
+import { useResolvedRsComponentSize } from "./resolve-size.js";
+import { TIME_HOUR_OPTIONS, TIME_SECOND_OPTIONS, formatTimeFromParts, getTimeMinuteOptions, parseTimeValue, scheduleAfterPaint, scrollTimeColumnToValue } from "./time-picker-utils.js";
+import { Fragment, computed, createCommentVNode, createElementBlock, createElementVNode, defineComponent, mergeModels, nextTick, normalizeClass, onMounted, onUnmounted, openBlock, renderList, toDisplayString, unref, useModel, useTemplateRef, watch } from "vue";
+//#region src/components/RsTimePickerColumns.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = { class: "rs-time-columns__column" };
+var _hoisted_2 = { class: "rs-time-columns__label" };
+var _hoisted_3 = { class: "rs-time-columns__list-shell" };
+var _hoisted_4 = [
+	"data-value",
+	"disabled",
+	"onClick"
+];
+var _hoisted_5 = { class: "rs-time-columns__column" };
+var _hoisted_6 = { class: "rs-time-columns__label" };
+var _hoisted_7 = { class: "rs-time-columns__list-shell" };
+var _hoisted_8 = [
+	"data-value",
+	"disabled",
+	"onClick"
+];
+var _hoisted_9 = {
+	key: 0,
+	class: "rs-time-columns__column"
+};
+var _hoisted_10 = { class: "rs-time-columns__label" };
+var _hoisted_11 = { class: "rs-time-columns__list-shell" };
+var _hoisted_12 = [
+	"data-value",
+	"disabled",
+	"onClick"
+];
+var RsTimePickerColumns_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	name: "RsTimePickerColumns",
+	__name: "RsTimePickerColumns",
+	props: /*@__PURE__*/ mergeModels({
+		minuteStep: { default: 1 },
+		second: {
+			type: Boolean,
+			default: false
+		},
+		disabled: {
+			type: Boolean,
+			default: false
+		},
+		size: {},
+		isUnitDisabled: {}
+	}, {
+		"modelValue": { default: "00:00" },
+		"modelModifiers": {}
+	}),
+	emits: ["update:modelValue"],
+	setup(__props, { expose: __expose }) {
+		const model = useModel(__props, "modelValue");
+		const props = __props;
+		const { t } = useRsI18n();
+		const resolvedSize = useResolvedRsComponentSize(() => props.size);
+		const hourListRef = useTemplateRef("hourListRef");
+		const minuteListRef = useTemplateRef("minuteListRef");
+		const secondListRef = useTemplateRef("secondListRef");
+		let cancelScheduledScroll;
+		const hourOptions = TIME_HOUR_OPTIONS;
+		const secondOptions = TIME_SECOND_OPTIONS;
+		const minuteOptions = computed(() => getTimeMinuteOptions(props.minuteStep));
+		const parts = computed(() => {
+			const parsed = parseTimeValue(model.value, props.second);
+			if (parsed) return {
+				hour: parsed.hour,
+				minute: parsed.minute,
+				second: parsed.second
+			};
+			return {
+				hour: 0,
+				minute: 0,
+				second: 0
+			};
+		});
+		function isDisabled(unit, value) {
+			return props.disabled || (props.isUnitDisabled?.(unit, value) ?? false);
+		}
+		function scrollColumn(container, value) {
+			scrollTimeColumnToValue(container, value);
+		}
+		function scrollToSelection() {
+			scrollColumn(hourListRef.value, parts.value.hour);
+			scrollColumn(minuteListRef.value, parts.value.minute);
+			if (props.second) scrollColumn(secondListRef.value, parts.value.second);
+		}
+		function scrollToSelectionAfterPaint() {
+			cancelScheduledScroll?.();
+			cancelScheduledScroll = scheduleAfterPaint(scrollToSelection);
+		}
+		function selectUnit(unit, value) {
+			if (isDisabled(unit, value)) return;
+			const next = {
+				...parts.value,
+				[unit]: value
+			};
+			model.value = formatTimeFromParts(next.hour, next.minute, next.second, props.second);
+		}
+		watch(() => [
+			parts.value.hour,
+			parts.value.minute,
+			parts.value.second,
+			props.second
+		], () => {
+			nextTick(scrollToSelection);
+		}, { flush: "post" });
+		onMounted(() => {
+			scrollToSelectionAfterPaint();
+		});
+		onUnmounted(() => {
+			cancelScheduledScroll?.();
+		});
+		__expose({
+			scrollToSelection,
+			scrollToSelectionAfterPaint,
+			resolvedSize
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", { class: normalizeClass(["rs-time-columns", [`rs-time-columns--${unref(resolvedSize)}`, { "rs-time-columns--seconds": __props.second }]]) }, [
+				createElementVNode("div", _hoisted_1, [createElementVNode("span", _hoisted_2, toDisplayString(unref(t)("timePicker.hour")), 1), createElementVNode("div", _hoisted_3, [createElementVNode("div", {
+					ref_key: "hourListRef",
+					ref: hourListRef,
+					class: "rs-time-columns__list"
+				}, [(openBlock(true), createElementBlock(Fragment, null, renderList(unref(hourOptions), (option) => {
+					return openBlock(), createElementBlock("button", {
+						key: option.value,
+						type: "button",
+						class: normalizeClass(["rs-time-columns__item", { "rs-time-columns__item--active": parts.value.hour === option.value }]),
+						"data-unit": "hour",
+						"data-value": option.value,
+						disabled: isDisabled("hour", option.value),
+						onClick: ($event) => selectUnit("hour", option.value)
+					}, toDisplayString(option.label), 11, _hoisted_4);
+				}), 128))], 512)])]),
+				createElementVNode("div", _hoisted_5, [createElementVNode("span", _hoisted_6, toDisplayString(unref(t)("timePicker.minute")), 1), createElementVNode("div", _hoisted_7, [createElementVNode("div", {
+					ref_key: "minuteListRef",
+					ref: minuteListRef,
+					class: "rs-time-columns__list"
+				}, [(openBlock(true), createElementBlock(Fragment, null, renderList(minuteOptions.value, (option) => {
+					return openBlock(), createElementBlock("button", {
+						key: option.value,
+						type: "button",
+						class: normalizeClass(["rs-time-columns__item", { "rs-time-columns__item--active": parts.value.minute === option.value }]),
+						"data-unit": "minute",
+						"data-value": option.value,
+						disabled: isDisabled("minute", option.value),
+						onClick: ($event) => selectUnit("minute", option.value)
+					}, toDisplayString(option.label), 11, _hoisted_8);
+				}), 128))], 512)])]),
+				__props.second ? (openBlock(), createElementBlock("div", _hoisted_9, [createElementVNode("span", _hoisted_10, toDisplayString(unref(t)("timePicker.second")), 1), createElementVNode("div", _hoisted_11, [createElementVNode("div", {
+					ref_key: "secondListRef",
+					ref: secondListRef,
+					class: "rs-time-columns__list"
+				}, [(openBlock(true), createElementBlock(Fragment, null, renderList(unref(secondOptions), (option) => {
+					return openBlock(), createElementBlock("button", {
+						key: option.value,
+						type: "button",
+						class: normalizeClass(["rs-time-columns__item", { "rs-time-columns__item--active": parts.value.second === option.value }]),
+						"data-unit": "second",
+						"data-value": option.value,
+						disabled: isDisabled("second", option.value),
+						onClick: ($event) => selectUnit("second", option.value)
+					}, toDisplayString(option.label), 11, _hoisted_12);
+				}), 128))], 512)])])) : createCommentVNode("", true)
+			], 2);
+		};
+	}
+});
+//#endregion
+export { RsTimePickerColumns_vue_vue_type_script_setup_true_lang_default as default };

package/dist/components/RsTimePickerColumns.js

@@ -0,0 +1,8 @@
+import './RsTimePickerColumns.css'
+import _plugin_vue_export_helper_default from "../_virtual/_plugin-vue_export-helper.js";
+import RsTimePickerColumns_vue_vue_type_script_setup_true_lang_default from "./RsTimePickerColumns.impl.js";
+
+//#region src/components/RsTimePickerColumns.vue
+var RsTimePickerColumns_default = /*#__PURE__*/ _plugin_vue_export_helper_default(RsTimePickerColumns_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-af4da4ba"]]);
+//#endregion
+export { RsTimePickerColumns_default as default };

package/dist/components/RsToaster.css

@@ -0,0 +1,329 @@
+
+[data-sonner-toaster].rs-toaster {
+  --rs-toast-radius: 1rem;
+  --rs-toast-bg: color-mix(in srgb, var(--rs-surface-elevated) 86%, transparent);
+  --rs-toast-border: color-mix(in srgb, var(--rs-border) 72%, rgb(255 255 255 / 0.08));
+  --rs-toast-shadow:
+    0 16px 40px -20px rgb(0 0 0 / 0.3),
+    0 8px 18px -14px rgb(0 0 0 / 0.18),
+    0 0 0 0.5px rgb(255 255 255 / 0.08);
+  --rs-toast-tint: color-mix(in srgb, var(--rs-info) 7%, transparent);
+  --rs-toast-highlight: rgb(255 255 255 / 0.08);
+  z-index: var(--rs-z-toast);
+  font-family: inherit;
+}
+[data-rs-theme='light'] [data-sonner-toaster].rs-toaster {
+  --rs-toast-bg: color-mix(in srgb, var(--rs-surface-elevated) 94%, rgb(255 255 255 / 0.8));
+  --rs-toast-border: color-mix(in srgb, var(--rs-border) 84%, rgb(255 255 255 / 0.9));
+  --rs-toast-shadow:
+    0 18px 42px -24px rgb(15 23 42 / 0.2),
+    0 8px 18px -14px rgb(15 23 42 / 0.12),
+    0 0 0 0.5px rgb(255 255 255 / 0.86);
+  --rs-toast-tint: color-mix(in srgb, var(--rs-info) 4%, #ffffff);
+  --rs-toast-highlight: rgb(255 255 255 / 0.72);
+}
+[data-sonner-toaster].rs-toaster [data-sonner-toast].rs-toast {
+  position: absolute;
+}
+[data-sonner-toaster].rs-toaster [data-sonner-toast].rs-toast[data-y-position='top'] {
+  top: 0;
+}
+[data-sonner-toaster].rs-toaster [data-sonner-toast].rs-toast[data-y-position='bottom'] {
+  top: auto;
+  bottom: 0;
+}
+[data-sonner-toaster].rs-toaster [data-sonner-toast].rs-toast[data-x-position='left'] {
+  left: 0;
+}
+[data-sonner-toaster].rs-toaster [data-sonner-toast].rs-toast[data-x-position='right'] {
+  right: 0;
+}
+[data-sonner-toaster].rs-toaster [data-sonner-toast].rs-toast[data-x-position='center'] {
+  left: 0;
+  right: 0;
+}
+.rs-toast {
+  --rs-toast-accent: color-mix(in srgb, var(--rs-info) 68%, transparent);
+  overflow: hidden;
+  display: grid;
+  grid-template-columns: auto minmax(0, 1fr);
+  align-items: center;
+  column-gap: 0.625rem;
+  row-gap: 0.5rem;
+  width: var(--width, auto);
+  min-width: 19rem;
+  max-width: min(29rem, calc(100vw - 1.5rem));
+  padding: 0.8125rem 2.25rem 0.8125rem 0.875rem;
+  border: 1px solid var(--rs-toast-border);
+  border-radius: var(--rs-toast-radius);
+  background:
+    linear-gradient(
+      180deg,
+      transparent 0.5rem,
+      var(--rs-toast-accent) 0.5rem calc(100% - 0.5rem),
+      transparent calc(100% - 0.5rem)
+    )
+    0.5rem 0 / 2px 100% no-repeat,
+    linear-gradient(180deg, var(--rs-toast-highlight), transparent 38%),
+    linear-gradient(135deg, var(--rs-toast-tint), transparent 34%),
+    var(--rs-toast-bg);
+  color: var(--rs-text);
+  box-shadow:
+    var(--rs-toast-shadow),
+    inset 0 1px 0 rgb(255 255 255 / 0.08);
+  backdrop-filter: blur(20px) saturate(150%);
+  -webkit-backdrop-filter: blur(20px) saturate(150%);
+  transition:
+    box-shadow var(--rs-transition-normal),
+    border-color var(--rs-transition-fast),
+    background var(--rs-transition-fast);
+}
+
+/* 带描述时顶对齐，图标与标题第一行光学对齐 */
+.rs-toast:has([data-description]) {
+  align-items: start;
+  padding-top: 0.875rem;
+  padding-bottom: 0.875rem;
+}
+.rs-toast:hover {
+  box-shadow:
+    0 18px 42px -20px rgb(0 0 0 / 0.34),
+    0 10px 24px -16px rgb(0 0 0 / 0.22),
+    0 0 0 0.5px rgb(255 255 255 / 0.1),
+    inset 0 1px 0 rgb(255 255 255 / 0.08);
+}
+.rs-toast[data-styled='true'] {
+  gap: 0;
+}
+.rs-toast [data-icon] {
+  position: relative;
+  z-index: 1;
+  grid-column: 1;
+  grid-row: 1;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  align-self: center;
+  width: 1.25rem;
+  height: 1.25rem;
+  margin: 0;
+  border-radius: 999px;
+  background: transparent;
+  color: var(--rs-info);
+  box-shadow: none;
+}
+.rs-toast [data-icon] svg {
+  width: 1.25rem;
+  height: 1.25rem;
+  flex-shrink: 0;
+}
+
+/* 多行内容时，图标略下移以对齐标题字面中线 */
+.rs-toast:has([data-description]) [data-icon] {
+  align-self: start;
+  margin-top: 0.125rem;
+}
+.rs-toast [data-content] {
+  position: relative;
+  z-index: 1;
+  grid-column: 2;
+  grid-row: 1;
+  display: grid;
+  gap: 0.1875rem;
+  min-width: 0;
+}
+.rs-toast [data-button] {
+  position: relative;
+  z-index: 1;
+  grid-column: 2;
+  margin-top: 0;
+}
+.rs-toast__title {
+  margin: 0;
+  color: var(--rs-text);
+  font-size: var(--rs-font-size-sm);
+  font-weight: var(--rs-font-weight-semibold);
+  line-height: var(--rs-line-height-tight);
+  letter-spacing: -0.012em;
+}
+.rs-toast__description {
+  margin: 0;
+  color: color-mix(in srgb, var(--rs-muted) 94%, var(--rs-text) 6%);
+  font-size: var(--rs-font-size-xs);
+  line-height: var(--rs-line-height-normal);
+}
+.rs-toast [data-close-button].rs-toast__close {
+  position: absolute;
+  top: 50%;
+  right: 0.625rem;
+  left: auto;
+  bottom: auto;
+  z-index: 2;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 1.25rem;
+  height: 1.25rem;
+  padding: 0;
+  border: 1px solid transparent;
+  border-radius: 999px;
+  background: transparent;
+  color: var(--rs-muted);
+  box-shadow: none;
+  cursor: pointer;
+  transform: translateY(-50%);
+  opacity: 0.72;
+  transition:
+    opacity var(--rs-transition-fast),
+    color var(--rs-transition-fast),
+    border-color var(--rs-transition-fast),
+    background var(--rs-transition-fast),
+    box-shadow var(--rs-transition-fast);
+}
+.rs-toast:has([data-description]) [data-close-button].rs-toast__close {
+  top: 0.75rem;
+  transform: none;
+}
+.rs-toast [data-close-button].rs-toast__close svg {
+  width: 0.75rem;
+  height: 0.75rem;
+  flex-shrink: 0;
+}
+.rs-toast [data-close-button].rs-toast__close:hover {
+  opacity: 0.96;
+  color: var(--rs-text);
+  border-color: color-mix(in srgb, var(--rs-border) 68%, transparent);
+  background: color-mix(in srgb, var(--rs-surface-hover) 70%, transparent);
+  box-shadow:
+    inset 0 1px 0 rgb(255 255 255 / 0.08),
+    0 1px 4px rgb(0 0 0 / 0.08);
+}
+.rs-toast [data-close-button].rs-toast__close:focus-visible {
+  outline: none;
+  box-shadow:
+    inset 0 1px 0 rgb(255 255 255 / 0.08),
+    0 0 0 var(--rs-focus-ring-width, 2px) var(--rs-focus-ring);
+}
+.rs-toast__action {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  min-width: 4.5rem;
+  min-height: 2rem;
+  padding: 0 0.75rem;
+  border: 1px solid transparent;
+  border-radius: 999px;
+  background: color-mix(in srgb, var(--rs-primary) 92%, white 8%);
+  color: var(--rs-primary-foreground);
+  font-size: var(--rs-font-size-xs);
+  font-weight: var(--rs-font-weight-semibold);
+  line-height: 1;
+  letter-spacing: 0.01em;
+  box-shadow:
+    inset 0 1px 0 rgb(255 255 255 / 0.16),
+    0 1px 2px rgb(0 0 0 / 0.08);
+  cursor: pointer;
+  transition:
+    transform var(--rs-transition-fast),
+    background var(--rs-transition-fast),
+    border-color var(--rs-transition-fast),
+    box-shadow var(--rs-transition-fast),
+    color var(--rs-transition-fast);
+}
+.rs-toast__action:hover {
+  transform: translateY(-0.5px);
+  background: color-mix(in srgb, var(--rs-primary-hover) 94%, white 6%);
+  box-shadow:
+    inset 0 1px 0 rgb(255 255 255 / 0.18),
+    0 4px 10px rgb(0 0 0 / 0.12);
+}
+.rs-toast__action:active {
+  transform: translateY(0);
+  box-shadow:
+    inset 0 1px 1px rgb(0 0 0 / 0.08),
+    0 1px 3px rgb(0 0 0 / 0.08);
+}
+.rs-toast__action:focus-visible {
+  outline: none;
+  box-shadow:
+    inset 0 1px 0 rgb(255 255 255 / 0.18),
+    0 0 0 var(--rs-focus-ring-width, 2px) var(--rs-focus-ring);
+}
+.rs-toast__action--secondary {
+  border-color: color-mix(in srgb, var(--rs-border) 72%, transparent);
+  background: color-mix(in srgb, var(--rs-surface) 82%, transparent);
+  color: var(--rs-text);
+  box-shadow:
+    inset 0 1px 0 rgb(255 255 255 / 0.08),
+    0 1px 2px rgb(0 0 0 / 0.04);
+}
+.rs-toast__action--secondary:hover {
+  background: color-mix(in srgb, var(--rs-surface-hover) 82%, transparent);
+  border-color: color-mix(in srgb, var(--rs-border) 88%, transparent);
+  box-shadow:
+    inset 0 1px 0 rgb(255 255 255 / 0.1),
+    0 3px 8px rgb(0 0 0 / 0.08);
+}
+.rs-toast[data-type='success'] {
+  --rs-toast-accent: color-mix(in srgb, var(--rs-success) 68%, transparent);
+  --rs-toast-tint: color-mix(in srgb, var(--rs-success) 7%, transparent);
+}
+.rs-toast[data-type='success'] [data-icon] {
+  color: var(--rs-success);
+}
+.rs-toast[data-type='error'] {
+  --rs-toast-accent: color-mix(in srgb, var(--rs-danger) 68%, transparent);
+  --rs-toast-tint: color-mix(in srgb, var(--rs-danger) 7%, transparent);
+}
+.rs-toast[data-type='error'] [data-icon] {
+  color: var(--rs-danger);
+}
+.rs-toast[data-type='warning'] {
+  --rs-toast-accent: color-mix(in srgb, var(--rs-warning) 72%, transparent);
+  --rs-toast-tint: color-mix(in srgb, var(--rs-warning) 8%, transparent);
+}
+.rs-toast[data-type='warning'] [data-icon] {
+  color: var(--rs-warning);
+}
+.rs-toast[data-type='info'],
+.rs-toast[data-type='default'] {
+  --rs-toast-accent: color-mix(in srgb, var(--rs-info) 68%, transparent);
+  --rs-toast-tint: color-mix(in srgb, var(--rs-info) 7%, transparent);
+}
+.rs-toast[data-type='loading'] {
+  --rs-toast-accent: color-mix(in srgb, var(--rs-primary) 68%, transparent);
+  --rs-toast-tint: color-mix(in srgb, var(--rs-primary) 7%, transparent);
+}
+.rs-toast[data-type='loading'] [data-icon] {
+  color: var(--rs-primary);
+}
+@media (max-width: 640px) {
+.rs-toast {
+    min-width: min(100%, 18.5rem);
+    max-width: calc(100vw - 1rem);
+    padding: 0.75rem 2.125rem 0.75rem 0.8125rem;
+    border-radius: 0.9375rem;
+}
+.rs-toast:has([data-description]) {
+    padding-top: 0.8125rem;
+    padding-bottom: 0.8125rem;
+}
+.rs-toast [data-close-button].rs-toast__close {
+    right: 0.5rem;
+    width: 1.25rem;
+    height: 1.25rem;
+}
+.rs-toast:has([data-description]) [data-close-button].rs-toast__close {
+    top: 0.625rem;
+}
+.rs-toast__action {
+    min-height: 1.875rem;
+    padding: 0 0.6875rem;
+}
+}
+@media (prefers-reduced-motion: reduce) {
+.rs-toast,
+  .rs-toast__action {
+    transition: none;
+}
+}

package/dist/components/RsToaster.d.ts

@@ -0,0 +1,17 @@
+import type { RsToastPosition } from './overlay-utils';
+type __VLS_Props = {
+    position?: RsToastPosition;
+    closeButton?: boolean;
+    richColors?: boolean;
+    expand?: boolean;
+    gap?: number;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    gap: number;
+    position: RsToastPosition;
+    closeButton: boolean;
+    richColors: boolean;
+    expand: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/RsToaster.impl.js

@@ -0,0 +1,67 @@
+import { rsConfigKey } from "../composables/useRsConfig.js";
+import { RS_TOAST_DEFAULT_POSITION } from "./overlay-utils.js";
+import { Teleport, computed, createBlock, createVNode, defineComponent, inject, openBlock, unref } from "vue";
+import { Toaster } from "vue-sonner";
+//#region src/components/RsToaster.vue?vue&type=script&setup=true&lang.ts
+var RsToaster_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	__name: "RsToaster",
+	props: {
+		position: { default: RS_TOAST_DEFAULT_POSITION },
+		closeButton: {
+			type: Boolean,
+			default: true
+		},
+		richColors: {
+			type: Boolean,
+			default: false
+		},
+		expand: {
+			type: Boolean,
+			default: true
+		},
+		gap: { default: 4 }
+	},
+	setup(__props) {
+		const config = inject(rsConfigKey, null);
+		const sonnerTheme = computed(() => {
+			if (config?.theme.value) return config.theme.value === "dark" ? "dark" : "light";
+			if (typeof document !== "undefined") {
+				const mode = document.documentElement.dataset.rsTheme;
+				if (mode === "dark" || mode === "light") return mode;
+			}
+			return "dark";
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(Teleport, { to: "body" }, [createVNode(unref(Toaster), {
+				theme: sonnerTheme.value,
+				position: __props.position,
+				"close-button": __props.closeButton,
+				expand: __props.expand,
+				gap: __props.gap,
+				"close-button-position": "top-right",
+				"rich-colors": __props.richColors,
+				class: "rs-toaster",
+				"toast-options": {
+					unstyled: true,
+					classes: {
+						toast: "rs-toast",
+						title: "rs-toast__title",
+						description: "rs-toast__description",
+						closeButton: "rs-toast__close",
+						actionButton: "rs-toast__action",
+						cancelButton: "rs-toast__action rs-toast__action--secondary"
+					}
+				}
+			}, null, 8, [
+				"theme",
+				"position",
+				"close-button",
+				"expand",
+				"gap",
+				"rich-colors"
+			])]);
+		};
+	}
+});
+//#endregion
+export { RsToaster_vue_vue_type_script_setup_true_lang_default as default };

package/dist/components/RsToaster.js

@@ -0,0 +1,7 @@
+import './RsToaster.css'
+import RsToaster_vue_vue_type_script_setup_true_lang_default from "./RsToaster.impl.js";
+
+//#region src/components/RsToaster.vue
+var RsToaster_default = RsToaster_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { RsToaster_default as default };

package/dist/components/RsToolbar.css

@@ -0,0 +1,61 @@
+
+.rs-toolbar {
+  display: flex;
+  align-items: center;
+  gap: var(--rs-space-sm);
+  box-sizing: border-box;
+  width: 100%;
+  min-width: 0;
+  flex-shrink: 0;
+  padding: 0 var(--rs-space-sm);
+  background: var(--rs-surface);
+  color: var(--rs-text);
+}
+.rs-toolbar--compact {
+  padding-inline: var(--rs-space-xs);
+  gap: var(--rs-space-xs);
+}
+.rs-toolbar--elevated {
+  background: var(--rs-surface-elevated);
+}
+.rs-toolbar--sm {
+  height: 2rem;
+}
+.rs-toolbar--md {
+  height: 2.25rem;
+}
+.rs-toolbar--lg {
+  height: 2.75rem;
+}
+.rs-toolbar--border-bottom {
+  border-bottom: 1px solid var(--rs-border-subtle);
+}
+.rs-toolbar--border-top {
+  border-top: 1px solid var(--rs-border-subtle);
+}
+.rs-toolbar--border-both {
+  border-top: 1px solid var(--rs-border-subtle);
+  border-bottom: 1px solid var(--rs-border-subtle);
+}
+.rs-toolbar--border-none {
+  border: none;
+}
+.rs-toolbar__start,
+.rs-toolbar__center,
+.rs-toolbar__end {
+  display: flex;
+  align-items: center;
+  gap: var(--rs-space-xs);
+  min-width: 0;
+}
+.rs-toolbar__start {
+  flex: 1 1 auto;
+  overflow: hidden;
+}
+.rs-toolbar__center {
+  flex: 0 0 auto;
+}
+.rs-toolbar__end {
+  flex: 0 0 auto;
+  margin-inline-start: auto;
+}