@bridge-ui/vue 0.0.0

package/dist/Components/Card/card.types.d.ts

@@ -0,0 +1,124 @@
+import { HTMLAttributes, Slot } from 'vue';
+import { CardPadding, CardRounded, CardShadow, CardVariant, MergeHtmlProps, MergeProps } from '@bridge-ui/core';
+export interface CardShadowOverrides {}
+export interface CardPaddingOverrides {}
+export interface CardRoundedOverrides {}
+export interface CardVariantOverrides {}
+export interface CardClasses {
+    /**
+     * The classes to apply to the body.
+     */
+    body?: string;
+    /**
+     * The classes to apply to the footer.
+     */
+    footer?: string;
+    /**
+     * The classes to apply to the header.
+     */
+    header?: string;
+    /**
+     * The classes to apply to the root.
+     */
+    root?: string;
+    /**
+     * The classes to apply to the title.
+     */
+    title?: string;
+}
+export interface CardCustomProps {
+    /**
+     * Props forwarded to the default body container.
+     */
+    body?: HTMLAttributes;
+    /**
+     * Props forwarded to the footer container.
+     */
+    footer?: HTMLAttributes;
+    /**
+     * Props forwarded to the default title row container.
+     */
+    header?: HTMLAttributes;
+    /**
+     * Props forwarded to the root container.
+     */
+    root?: HTMLAttributes;
+    /**
+     * Props forwarded to the title container.
+     */
+    title?: HTMLAttributes;
+}
+export interface CardOwnProps {
+    /**
+     * Removes header and footer borders.
+     *
+     * @default false
+     */
+    borderless?: boolean;
+    /**
+     * The classes to apply to the card.
+     *
+     * @default undefined
+     */
+    classes?: CardClasses;
+    /**
+     * Extra props for internal parts (`header`, `title`, `body`, `footer`, etc.).
+     * Root HTML attributes stay on the component top level.
+     *
+     * @default undefined
+     */
+    customProps?: CardCustomProps;
+    /**
+     * Padding for header, body, and footer (horizontal alignment is shared).
+     *
+     * @default "medium"
+     */
+    padding?: MergeProps<CardPadding, CardPaddingOverrides>;
+    /**
+     * The roundedness of the card.
+     *
+     * @default "sm"
+     */
+    rounded?: MergeProps<CardRounded, CardRoundedOverrides>;
+    /**
+     * Shadow size. Only applied when `variant` is `elevated`.
+     *
+     * @default "sm"
+     */
+    shadow?: MergeProps<CardShadow, CardShadowOverrides>;
+    /**
+     * The title to apply to the card.
+     *
+     * @default undefined
+     */
+    title?: string;
+    /**
+     * Visual style of the card.
+     *
+     * @default "elevated"
+     */
+    variant?: MergeProps<CardVariant, CardVariantOverrides>;
+}
+export interface CardSlots {
+    /**
+     * Content aligned to the right of the title row (e.g. actions or menu).
+     */
+    action?: Slot<undefined>;
+    /**
+     * Main body content of the card.
+     */
+    default?: Slot<undefined>;
+    /**
+     * The footer content of the card.
+     */
+    footer?: Slot<undefined>;
+    /**
+     * Replaces the entire card header area (title row and action).
+     */
+    header?: Slot<undefined>;
+    /**
+     * The title of the card.
+     */
+    title?: Slot<undefined>;
+}
+export type CardProps = MergeHtmlProps<CardOwnProps, HTMLAttributes>;

package/dist/Components/Card/composables/useCard.d.ts

@@ -0,0 +1,18 @@
+import { LibDefaultsShape, MergeLibDefaults } from '@bridge-ui/core';
+import { CardOwnProps, CardProps } from '../card.types';
+type CardLibDefaults = LibDefaultsShape<CardOwnProps, "shadow" | "padding" | "rounded" | "variant">;
+type CardMerged = MergeLibDefaults<CardOwnProps, CardLibDefaults>;
+export declare function useCard(props: CardOwnProps, libDefaults: CardLibDefaults): {
+    slots: Readonly<{
+        [name: string]: import('vue').Slot<any> | undefined;
+    }>;
+    merged: import('vue').ComputedRef<CardMerged>;
+    bodyBind: import('vue').ComputedRef<import('@bridge-ui/core').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, {}>>;
+    rootBind: import('vue').ComputedRef<import('@bridge-ui/core').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, Omit<CardProps, "classes" | "customProps" | "title" | "padding" | "rounded" | "shadow" | "variant" | "borderless">>>;
+    hasFooter: import('vue').ComputedRef<boolean>;
+    titleBind: import('vue').ComputedRef<import('@bridge-ui/core').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, {}>>;
+    footerBind: import('vue').ComputedRef<import('@bridge-ui/core').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, {}>>;
+    headerBind: import('vue').ComputedRef<import('@bridge-ui/core').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, {}>>;
+    hasDefaultBody: import('vue').ComputedRef<boolean>;
+};
+export {};

package/dist/Components/Card/composables/useCard.js

@@ -0,0 +1,80 @@
+import { hasNamedSlot as e } from "../../../Utils/slotOrProp.js";
+import { mergePartBind as t, useBridgeUIComponent as n, useBridgeUIMergedRegistryClasses as r } from "../../../Utils/index.js";
+import { computed as i, useAttrs as a, useSlots as o } from "vue";
+import { get as s } from "es-toolkit/compat";
+import { cn as c, mergeBridgeUILayeredClasses as l, splitComponentProps as u } from "@bridge-ui/core";
+import { paddingProps as d, roundedProps as f, shadowProps as p, variantProps as m } from "@bridge-ui/core/Components/Card";
+//#region src/Components/Card/composables/useCard.ts
+var h = [
+	"title",
+	"shadow",
+	"classes",
+	"padding",
+	"rounded",
+	"variant",
+	"borderless",
+	"customProps"
+];
+function g(g, _) {
+	let v = a(), y = o(), b = i(() => u({
+		bridgeKeys: h,
+		props: {
+			...v,
+			...g
+		}
+	})), { merged: x, entry: S } = n({
+		libDefaults: _,
+		componentName: "Card",
+		props: () => b.value.componentProps
+	}), C = i(() => x.value.customProps), w = r({
+		entry: S,
+		props: () => b.value.componentProps
+	}), T = i(() => {
+		let e = y.default?.();
+		return !!(e && e.length > 0);
+	}), E = i(() => e(y, "footer")), D = i(() => s(l(m, S.value?.customProps?.variant), x.value.variant)), O = i(() => x.value.borderless ? !1 : !!s(D.value, "border")), k = i(() => {
+		if (x.value.variant === "elevated") return s(l(p, S.value?.customProps?.shadow), x.value.shadow);
+	}), A = i(() => s(l(d, S.value?.customProps?.padding), x.value.padding)), j = i(() => s(l(f, S.value?.customProps?.rounded), x.value.rounded)), M = i(() => t(C.value?.body, {}, c({
+		grow: !0,
+		[s(A.value, "body") ?? ""]: !0,
+		[s(D.value, "text") ?? ""]: !0,
+		[s(w.value, "body") ?? ""]: !0
+	}))), N = i(() => t(C.value?.footer, {}, c({
+		"border-t": O.value,
+		[s(A.value, "footer") ?? ""]: !0,
+		[s(D.value, "border") ?? ""]: O.value,
+		[s(D.value, "footer") ?? ""]: !0,
+		[s(j.value, "footer") ?? ""]: !0,
+		[s(w.value, "footer") ?? ""]: !0
+	}))), P = i(() => t(C.value?.header, {}, c({
+		"flex items-center justify-between": !0,
+		"border-b": O.value,
+		[s(A.value, "header") ?? ""]: !0,
+		[s(D.value, "border") ?? ""]: O.value,
+		[s(j.value, "header") ?? ""]: !0,
+		[s(w.value, "header") ?? ""]: !0
+	})));
+	return {
+		slots: y,
+		merged: x,
+		bodyBind: M,
+		rootBind: i(() => t(C.value?.root, b.value.inheritedAttrs, c({
+			"flex w-full flex-col": !0,
+			[k.value ?? ""]: !0,
+			[s(j.value, "root") ?? ""]: !0,
+			[s(D.value, "root") ?? ""]: !0,
+			[s(w.value, "root") ?? ""]: !0
+		}))),
+		hasFooter: E,
+		titleBind: i(() => t(C.value?.title, {}, c({
+			"text-base font-medium whitespace-normal": !0,
+			[s(D.value, "text") ?? ""]: !0,
+			[s(w.value, "title") ?? ""]: !0
+		}))),
+		footerBind: N,
+		headerBind: P,
+		hasDefaultBody: T
+	};
+}
+//#endregion
+export { g as useCard };

package/dist/Components/Card/index.d.ts

@@ -0,0 +1,3 @@
+export type { CardClasses, CardCustomProps, CardOwnProps, CardPaddingOverrides, CardProps, CardRoundedOverrides, CardShadowOverrides, CardSlots, CardVariantOverrides, } from './card.types';
+export { default as Card } from './Card.vue';
+export { useCard } from './composables/useCard';

package/dist/Components/Card/index.js

@@ -0,0 +1,3 @@
+import { useCard as e } from "./composables/useCard.js";
+import t from "./Card.js";
+export { t as Card, e as useCard };

package/dist/Components/Checkbox/Checkbox.js

@@ -0,0 +1,5 @@
+import e from "./Checkbox.vue_vue_type_script_setup_true_lang.js";
+//#region src/Components/Checkbox/Checkbox.vue
+var t = e;
+//#endregion
+export { t as default };

package/dist/Components/Checkbox/Checkbox.vue.d.ts

@@ -0,0 +1,20 @@
+import { CheckboxOwnProps, CheckboxSlots } from './checkbox.types';
+type __VLS_Slots = CheckboxSlots;
+type __VLS_Props = CheckboxOwnProps;
+type __VLS_ModelProps = {
+    modelValue?: boolean;
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare const __VLS_base: import('vue').DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "update:modelValue": (value: boolean) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/Components/Checkbox/Checkbox.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,70 @@
+import e from "../FormControl/FormControl.js";
+import { useCheckbox as t } from "./composables/useCheckbox.js";
+import { computed as n, createBlock as r, createCommentVNode as i, createElementBlock as a, createElementVNode as o, defineComponent as s, guardReactiveProps as c, mergeModels as l, mergeProps as u, normalizeClass as d, normalizeProps as f, openBlock as p, unref as m, useAttrs as h, useModel as g, withCtx as _ } from "vue";
+import { cn as v } from "@bridge-ui/core";
+import { Check as y } from "lucide-vue-next";
+//#region src/Components/Checkbox/Checkbox.vue?vue&type=script&setup=true&lang.ts
+var b = ["for"], x = ["checked"], S = {
+	key: 1,
+	class: "block h-0.5 w-[55%] rounded-full bg-white"
+}, C = /* @__PURE__ */ s({
+	inheritAttrs: !1,
+	__name: "Checkbox",
+	props: /* @__PURE__ */ l({
+		checked: { type: Boolean },
+		classes: {},
+		color: {},
+		customProps: {},
+		indeterminate: { type: Boolean },
+		rounded: {},
+		size: {},
+		slots: {},
+		controlId: {},
+		description: {},
+		disabled: { type: Boolean },
+		endLabel: {},
+		error: { type: Boolean },
+		errorMessage: {},
+		mainLabel: {},
+		readonly: { type: Boolean },
+		required: { type: Boolean },
+		startLabel: {},
+		withoutErrorMessage: { type: Boolean }
+	}, {
+		modelValue: {
+			type: Boolean,
+			default: !1
+		},
+		modelModifiers: {}
+	}),
+	emits: ["update:modelValue"],
+	setup(s) {
+		let l = h(), C = s, w = g(s, "modelValue"), { merged: T, iconBind: E, inputRef: D, fieldBind: O, inputBind: k, isChecked: A, formControl: j, controlBind: M } = t(() => ({
+			...l,
+			...C
+		}), {
+			size: "md",
+			rounded: "sm",
+			color: "primary"
+		}, n(() => w.value));
+		function N(e) {
+			w.value = e.target.checked;
+		}
+		return (t, n) => (p(), r(m(e), { field: m(j) }, {
+			default: _(() => [o("label", u(m(O), { for: m(j).controlId.value }), [o("input", u({
+				ref_key: "inputRef",
+				ref: D
+			}, m(k), {
+				checked: m(A),
+				onChange: N
+			}), null, 16, x), o("span", f(c(m(M))), [m(A) && !m(T).indeterminate ? (p(), r(m(y), {
+				key: 0,
+				"stroke-width": 3,
+				class: d(m(v)("h-[65%] w-[65%]", m(E).class))
+			}, null, 8, ["class"])) : m(T).indeterminate ? (p(), a("span", S)) : i("", !0)], 16)], 16, b)]),
+			_: 1
+		}, 8, ["field"]));
+	}
+});
+//#endregion
+export { C as default };

package/dist/Components/Checkbox/checkbox.types.d.ts

@@ -0,0 +1,98 @@
+import { InputHTMLAttributes } from 'vue';
+import { CheckboxColor, CheckboxRounded, CheckboxSize, MergeHtmlProps, MergeProps } from '@bridge-ui/core';
+import { FormControlClasses, FormControlCustomProps, FormControlOwnProps, FormControlSlots } from '../FormControl/formControl.types';
+export interface CheckboxSizeOverrides {}
+export interface CheckboxColorOverrides {}
+export interface CheckboxRoundedOverrides {}
+export interface CheckboxClasses extends FormControlClasses {
+    /**
+     * The classes to apply to the custom control box.
+     */
+    control?: string;
+    /**
+     * The classes to apply to the check icon.
+     */
+    icon?: string;
+    /**
+     * The classes to apply to the native input (visually hidden).
+     */
+    input?: string;
+}
+export interface CheckboxCustomProps extends FormControlCustomProps {
+    /**
+     * Props forwarded to the custom control box.
+     */
+    control?: InputHTMLAttributes;
+    /**
+     * Props forwarded to the check icon wrapper.
+     */
+    icon?: InputHTMLAttributes;
+    /**
+     * Props forwarded to the native input.
+     */
+    input?: Partial<InputHTMLAttributes>;
+}
+export interface CheckboxEmits {
+    /**
+     * Emitted when `v-model` should update.
+     */
+    "update:modelValue": [value: boolean];
+}
+export interface CheckboxOwnProps extends Omit<FormControlOwnProps, "field" | "slots" | "classes" | "customProps"> {
+    /**
+     * Whether the checkbox is checked.
+     *
+     * @default undefined
+     */
+    checked?: boolean;
+    /**
+     * Classes for the form control chrome and the checkbox control.
+     *
+     * @default undefined
+     */
+    classes?: CheckboxClasses;
+    /**
+     * The color to apply to the checkbox.
+     *
+     * @default "primary"
+     */
+    color?: MergeProps<CheckboxColor, CheckboxColorOverrides>;
+    /**
+     * Extra props for internal parts.
+     *
+     * @default undefined
+     */
+    customProps?: CheckboxCustomProps;
+    /**
+     * Whether the checkbox is in an indeterminate state.
+     *
+     * @default false
+     */
+    indeterminate?: boolean;
+    /**
+     * The roundedness of the checkbox control.
+     *
+     * @default "sm"
+     */
+    rounded?: MergeProps<CheckboxRounded, CheckboxRoundedOverrides>;
+    /**
+     * Size of the control and of form control labels (`2xs` … `2xl`, same scale as
+     * `FormField`).
+     *
+     * @default "md"
+     */
+    size?: MergeProps<CheckboxSize, CheckboxSizeOverrides>;
+    /**
+     * Chrome slots and the control slot.
+     *
+     * @default undefined
+     */
+    slots?: CheckboxSlots;
+}
+export interface CheckboxSlots extends FormControlSlots {}
+export type CheckboxProps = MergeHtmlProps<CheckboxOwnProps, Omit<InputHTMLAttributes, "size" | "color" | "rounded">> & {
+    /**
+     * Bound with `v-model` on the component (`defineModel` internally).
+     */
+    modelValue?: boolean;
+};