sard 1.0.0 → 1.0.2

package/components/stepper/stepper.js

@@ -0,0 +1,262 @@
+import { createBem } from "../../utils/bem.js";
+import { clamp } from "../../utils/number.js";
+import { isNullish } from "../../utils/is.js";
+import { usePointerDown } from "../../use/usePointerDown.js";
+import { useSimulatedPress } from "../../use/useSimulatedPress.js";
+import { useFormContext } from "../form/common.js";
+import input_default from "../input/input.js";
+import { defaultStepperProps } from "./common.js";
+import { computed, createElementBlock, createElementVNode, createVNode, defineComponent, mergeDefaults, normalizeClass, openBlock, ref, unref, useModel, watch } from "vue";
+import { Minus, Plus } from "@sard/icons";
+//#region packages/sard/components/stepper/stepper.vue
+var stepper_default = /*@__PURE__*/ defineComponent({
+	__name: "stepper",
+	props: /*@__PURE__*/ mergeDefaults({
+		modelValue: {
+			type: [
+				Number,
+				String,
+				null
+			],
+			required: false
+		},
+		min: {
+			type: Number,
+			required: false
+		},
+		max: {
+			type: Number,
+			required: false
+		},
+		valueOnClear: {
+			type: [Number, String],
+			required: false
+		},
+		step: {
+			type: Number,
+			required: false
+		},
+		precision: {
+			type: Number,
+			required: false
+		},
+		inputType: {
+			type: String,
+			required: false
+		},
+		placeholder: {
+			type: String,
+			required: false
+		},
+		disabled: {
+			type: Boolean,
+			required: false
+		},
+		readonly: {
+			type: Boolean,
+			required: false
+		},
+		press: {
+			type: Boolean,
+			required: false
+		},
+		pressTime: {
+			type: Number,
+			required: false
+		},
+		interval: {
+			type: Number,
+			required: false
+		},
+		validateEvent: {
+			type: Boolean,
+			required: false
+		},
+		size: {
+			type: String,
+			required: false
+		},
+		variant: {
+			type: String,
+			required: false
+		}
+	}, defaultStepperProps),
+	emits: [
+		"update:modelValue",
+		"change",
+		"focus",
+		"blur"
+	],
+	setup(__props, { emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		const bem = createBem("stepper");
+		const formContext = useFormContext();
+		const isDisabled = computed(() => {
+			return formContext?.disabled || props.disabled;
+		});
+		const isReadonly = computed(() => {
+			return formContext?.readonly || props.readonly;
+		});
+		const inputValue = ref(props.modelValue);
+		watch(() => props.modelValue, () => {
+			inputValue.value = props.modelValue;
+		});
+		const innerValue = useModel(props, "modelValue");
+		const setValue = (value) => {
+			inputValue.value = value;
+			innerValue.value = value;
+			emit("change", value);
+		};
+		const normalizedValue = (value) => {
+			if (isNaN(value)) return 0;
+			value = clamp(value, props.min, props.max);
+			if (props.precision !== void 0) value = +value.toFixed(props.precision);
+			return value;
+		};
+		const setValueByStep = (delta) => {
+			setValue(normalizedValue((Number(innerValue.value) || 0) + props.step * delta));
+		};
+		const onChange = (value) => {
+			if (value === "") setValue(getValueOnClear());
+			else setValue(normalizedValue(Number(value)));
+		};
+		const getValueOnClear = () => {
+			return props.valueOnClear === "min" ? props.min : props.valueOnClear === "max" ? props.max : props.valueOnClear;
+		};
+		const onBlur = (event) => {
+			emit("blur", event);
+		};
+		const onFocus = (event) => {
+			emit("focus", event);
+		};
+		const isMin = computed(() => {
+			return !isNullish(innerValue.value) && Number(innerValue.value) <= props.min;
+		});
+		const isMax = computed(() => {
+			return !isNullish(innerValue.value) && Number(innerValue.value) >= props.max;
+		});
+		const onButtonClick = (delta, arrived) => {
+			if (!isDisabled.value && !isReadonly.value && !arrived) setValueByStep(delta);
+		};
+		let pressDelta = 0;
+		const tick = () => {
+			if (pressDelta) {
+				setValueByStep(pressDelta);
+				setTimeout(() => {
+					tick();
+				}, props.interval);
+			}
+		};
+		const onPressStart = (delta) => {
+			if (!!pressDelta || !props.press || isDisabled.value || isReadonly.value || delta === -1 && isMin.value || delta === 1 && isMax.value) return;
+			pressDelta = delta;
+			tick();
+		};
+		const onPressEnd = () => {
+			pressDelta = 0;
+		};
+		const onDecTouchStart = (event) => {
+			onDecSimulatedPressTouchStart(event);
+		};
+		const onDecTouchMove = (event) => {
+			onDecSimulatedPressTouchMove(event);
+		};
+		const onDecTouchEnd = () => {
+			onDecSimulatedPressTouchEnd();
+		};
+		const onDecPointerDown = usePointerDown(onDecTouchStart, onDecTouchMove, onDecTouchEnd);
+		const [onDecSimulatedPressTouchStart, onDecSimulatedPressTouchMove, onDecSimulatedPressTouchEnd] = useSimulatedPress({
+			start: () => {
+				onPressStart(-1);
+			},
+			end: onPressEnd,
+			duration: props.pressTime
+		});
+		const onIncTouchStart = (event) => {
+			onIncSimulatedPressTouchStart(event);
+		};
+		const onIncTouchMove = (event) => {
+			onIncSimulatedPressTouchMove(event);
+		};
+		const onIncTouchEnd = () => {
+			onIncSimulatedPressTouchEnd();
+		};
+		const onIncPointerDown = usePointerDown(onIncTouchStart, onIncTouchMove, onIncTouchEnd);
+		const [onIncSimulatedPressTouchStart, onIncSimulatedPressTouchMove, onIncSimulatedPressTouchEnd] = useSimulatedPress({
+			start: () => {
+				onPressStart(1);
+			},
+			end: onPressEnd,
+			duration: props.pressTime
+		});
+		const stepperClass = computed(() => {
+			return [
+				bem.b(),
+				bem.m(props.size),
+				bem.m("disabled", isDisabled.value),
+				bem.m("readonly", isReadonly.value),
+				bem.m(props.variant)
+			];
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", { class: normalizeClass(stepperClass.value) }, [
+				createElementVNode("div", {
+					class: normalizeClass([
+						unref(bem).e("button"),
+						unref(bem).is("disabled", isDisabled.value || isMin.value),
+						unref(bem).is("readonly", isReadonly.value),
+						unref(bem).em("button", "decrease")
+					]),
+					onClick: _cache[0] || (_cache[0] = ($event) => onButtonClick(-1, isMin.value)),
+					onTouchstart: onDecTouchStart,
+					onTouchmove: onDecTouchMove,
+					onTouchend: onDecTouchEnd,
+					onTouchcancel: onDecTouchEnd,
+					onPointerdown: _cache[1] || (_cache[1] = (...args) => unref(onDecPointerDown) && unref(onDecPointerDown)(...args))
+				}, [createVNode(unref(Minus))], 34),
+				createVNode(input_default, {
+					modelValue: inputValue.value,
+					"onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => inputValue.value = $event),
+					class: normalizeClass(unref(bem).e("input")),
+					type: __props.inputType,
+					placeholder: __props.placeholder,
+					disabled: isDisabled.value || isReadonly.value,
+					"validate-event": __props.validateEvent,
+					precision: __props.precision,
+					min: __props.min,
+					max: __props.max,
+					onChange,
+					onBlur,
+					onFocus
+				}, null, 8, [
+					"modelValue",
+					"class",
+					"type",
+					"placeholder",
+					"disabled",
+					"validate-event",
+					"precision",
+					"min",
+					"max"
+				]),
+				createElementVNode("div", {
+					class: normalizeClass([
+						unref(bem).e("button"),
+						unref(bem).is("disabled", isDisabled.value || isMax.value),
+						unref(bem).is("readonly", isReadonly.value),
+						unref(bem).em("button", "increase")
+					]),
+					onClick: _cache[3] || (_cache[3] = ($event) => onButtonClick(1, isMax.value)),
+					onTouchstart: onIncTouchStart,
+					onTouchmove: onIncTouchMove,
+					onTouchend: onIncTouchEnd,
+					onTouchcancel: onIncTouchEnd,
+					onPointerdown: _cache[4] || (_cache[4] = (...args) => unref(onIncPointerDown) && unref(onIncPointerDown)(...args))
+				}, [createVNode(unref(Plus))], 34)
+			], 2);
+		};
+	}
+});
+//#endregion
+export { stepper_default as default };

package/components/steps/common.d.ts

@@ -0,0 +1,46 @@
+import { type InjectionKey } from 'vue';
+import { type DefaultProps } from '../config';
+export type StepsStatus = 'wait' | 'process' | 'error' | 'finish';
+export interface StepsItem {
+    status?: StepsStatus;
+    name?: string;
+    description?: string;
+}
+export interface StepsProps {
+    current?: number;
+    itemList?: StepsItem[];
+    center?: boolean;
+    direction?: 'vertical' | 'horizontal';
+    reverse?: boolean;
+    status?: StepsStatus;
+}
+export declare const defaultStepsProps: DefaultProps<StepsProps>;
+export interface StepsSlots {
+    default?(props: Record<string, never>): any;
+}
+export interface StepsContext {
+    current: number;
+    center?: boolean;
+    direction?: StepsProps['direction'];
+    status?: StepsStatus;
+    reverse?: boolean;
+}
+export declare const stepsContextKey: InjectionKey<StepsContext>;
+export interface StepProps {
+    status?: StepsStatus;
+    name?: string;
+    description?: string;
+    index: number;
+}
+export interface StepSlots {
+    default?(props: {
+        status: StepsStatus;
+    }): any;
+    icon?(props: {
+        status: StepsStatus;
+    }): any;
+}
+export interface StepEmits {
+}
+export interface StepExpose {
+}

package/components/steps/common.js

@@ -0,0 +1,10 @@
+//#region packages/sard/components/steps/common.ts
+const defaultStepsProps = {
+	current: 0,
+	center: false,
+	itemList: () => [],
+	direction: "horizontal"
+};
+const stepsContextKey = Symbol("stepsContext");
+//#endregion
+export { defaultStepsProps, stepsContextKey };

package/components/steps/index.css

@@ -0,0 +1 @@
+:root{--s-steps-step-font-size:var(--s-font-size);--s-steps-step-opacity-active:var(--s-opacity-active);--s-steps-step-min-height:36px;--s-steps-icon-color-finish:var(--s-color-primary);--s-steps-icon-color-process:var(--s-color-primary);--s-steps-icon-color-wait:var(--s-text-color-tertiary);--s-steps-icon-color-error:var(--s-color-danger);--s-steps-text-color-finish:var(--s-text-color-primary);--s-steps-text-color-process:var(--s-color-primary);--s-steps-text-color-wait:var(--s-text-color-tertiary);--s-steps-text-color-error:var(--s-color-danger);--s-steps-header-padding-y:var(--s-size-2xs);--s-steps-header-padding-x:var(--s-size-sm);--s-steps-header-top-vertical:4px;--s-steps-line-thickness:1px;--s-steps-line-margin:3px;--s-steps-line-color:var(--s-border-color);--s-steps-line-color-active:var(--s-color-primary);--s-steps-icon-font-size:var(--s-font-size);--s-steps-body-padding-x:var(--s-size-xs);--s-steps-body-padding-y:var(--s-size-2xs);--s-steps-name-font-size:var(--s-font-size);--s-steps-description-margin-top:var(--s-size-2xs);--s-steps-description-font-size:var(--s-font-size-sm);--s-steps-description-color:var(--s-text-color-tertiary)}.s-steps{display:flex;flex-wrap:nowrap;align-items:flex-start}.s-steps--vertical{flex-direction:column;align-items:stretch}.s-step{display:flex;flex-direction:column;flex:1;font-size:var(--s-steps-step-font-size)}.s-step:first-child .s-step__line-before{opacity:0}.s-step:last-child{flex:none;white-space:nowrap}.s-step:last-child .s-step__line{display:none}.s-step:last-child .s-step__line-after{opacity:0}.s-step--behind .s-step__line{background:var(--s-steps-line-color-active)}.s-step--self .s-step__line-before{background:var(--s-steps-line-color-active)}.s-step--finish .s-step__icon{color:var(--s-steps-icon-color-finish)}.s-step--finish .s-step__body{color:var(--s-steps-text-color-finish)}.s-step--process .s-step__icon{color:var(--s-steps-icon-color-process)}.s-step--process .s-step__body{color:var(--s-steps-text-color-process)}.s-step--wait .s-step__icon{color:var(--s-steps-icon-color-wait)}.s-step--wait .s-step__body{color:var(--s-steps-text-color-wait)}.s-step--error .s-step__icon{color:var(--s-steps-icon-color-error)}.s-step--error .s-step__body{color:var(--s-steps-text-color-error)}.s-step__header{position:relative;display:flex;align-items:center;padding-top:var(--s-steps-header-padding-y);padding-bottom:var(--s-steps-header-padding-y)}.s-step__line{height:var(--s-steps-line-thickness);width:0;flex-grow:1;flex-shrink:1;flex-basis:0;margin-inline-start:var(--s-steps-line-margin);margin-inline-end:var(--s-steps-line-margin);background:var(--s-steps-line-color)}.s-step__line-before{display:none}.s-step__icon{font-size:var(--s-steps-icon-font-size)}.s-step__body{display:flex;flex-direction:column}.s-step__name{font-size:var(--s-steps-name-font-size)}.s-step__description{margin-top:var(--s-steps-description-margin-top);font-size:var(--s-steps-description-font-size);color:var(--s-steps-description-color)}.s-step--vertical{flex-direction:row;min-height:var(--s-steps-step-min-height)}.s-step--vertical:last-child .s-step__line{white-space:unset}.s-step--vertical .s-step__header{top:calc(var(--s-steps-header-top-vertical) + var(--s-steps-body-padding-y));flex:none;flex-direction:column;padding-top:0;padding-bottom:0;padding-inline-start:var(--s-steps-header-padding-x);padding-inline-end:var(--s-steps-header-padding-x)}.s-step--vertical .s-step__line{width:var(--s-steps-line-thickness);height:0;margin-inline-start:0;margin-inline-end:0;margin-top:var(--s-steps-line-margin);margin-bottom:var(--s-steps-line-margin)}.s-step--vertical .s-step__body{flex:1;padding-top:var(--s-steps-body-padding-y);padding-bottom:var(--s-steps-body-padding-y)}.s-step--center{justify-content:center}.s-step--center:last-child{flex:1;white-space:unset}.s-step--center:last-child .s-step__line{display:flex}.s-step--center .s-step__line-before{display:flex;margin-inline-start:0}.s-step--center .s-step__line-after{margin-inline-end:0}.s-step--center .s-step__body{align-items:center}.s-step--center.s-step--vertical{justify-content:center;align-items:center}.s-step--center.s-step--vertical:last-child{flex:1;white-space:unset}.s-step--center.s-step--vertical .s-step__header{top:0;align-self:stretch}.s-step--center.s-step--vertical .s-step__line-before{margin-top:0}.s-step--center.s-step--vertical .s-step__line-after{margin-bottom:0}.s-step--center.s-step--vertical .s-step__body{justify-content:center;align-items:flex-start}.s-step--horizontal.s-step--reverse{flex-direction:column-reverse}

package/components/steps/index.d.ts

@@ -0,0 +1,7 @@
+import { type EnhancedComponent } from '../../utils';
+import _Steps from './steps.vue';
+import _Step from './step.vue';
+export declare const Steps: EnhancedComponent<typeof _Steps>;
+export declare const Step: EnhancedComponent<typeof _Step>;
+export default Steps;
+export type { StepsProps, StepsSlots, StepsContext, StepsStatus, StepsItem, StepProps, StepSlots, StepEmits, StepExpose, } from './common';

package/components/steps/index.js

@@ -0,0 +1,8 @@
+import { enhanceComponent } from "../../utils/component.js";
+import step_default from "./step.js";
+import steps_default from "./steps.js";
+//#region packages/sard/components/steps/index.ts
+const Steps = enhanceComponent(steps_default);
+const Step = enhanceComponent(step_default);
+//#endregion
+export { Step, Steps, Steps as default };

package/components/steps/step.d.ts

@@ -0,0 +1,11 @@
+import { type StepProps, type StepSlots, type StepExpose } from './common';
+type __VLS_Slots = StepSlots;
+declare const __VLS_base: import("vue").DefineComponent<StepProps, StepExpose, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<StepProps> & Readonly<{}>, {}, {}, {}, {}, 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/components/steps/step.js

@@ -0,0 +1,61 @@
+import { createBem } from "../../utils/bem.js";
+import { stepsContextKey } from "./common.js";
+import { computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, defineComponent, inject, normalizeClass, openBlock, renderSlot, toDisplayString, unref } from "vue";
+import { CheckCircleFill, Circle, XCircle } from "@sard/icons";
+//#region packages/sard/components/steps/step.vue
+var step_default = /*@__PURE__*/ defineComponent({
+	__name: "step",
+	props: {
+		status: {
+			type: String,
+			required: false
+		},
+		name: {
+			type: String,
+			required: false
+		},
+		description: {
+			type: String,
+			required: false
+		},
+		index: {
+			type: Number,
+			required: true
+		}
+	},
+	setup(__props, { expose: __expose }) {
+		const props = __props;
+		__expose({});
+		const bem = createBem("step");
+		const context = inject(stepsContextKey);
+		if (!context) throw new Error("Step must be included in Steps.");
+		const currentStatus = computed(() => {
+			return props.status ?? (props.index < context.current ? "finish" : props.index === context.current ? context.status ?? "process" : "wait");
+		});
+		const position = computed(() => {
+			return props.index < context.current ? "behind" : context.current === props.index ? "self" : "front";
+		});
+		const stepClass = computed(() => {
+			return [
+				bem.b(),
+				bem.m("center", context.center),
+				bem.m(currentStatus.value),
+				bem.m(position.value),
+				bem.m(context.direction),
+				bem.m("reverse", context.reverse)
+			];
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", { class: normalizeClass(stepClass.value) }, [createElementVNode("div", { class: normalizeClass(unref(bem).e("header")) }, [
+				createElementVNode("div", { class: normalizeClass([unref(bem).e("line"), unref(bem).e("line-before")]) }, null, 2),
+				createElementVNode("div", { class: normalizeClass(unref(bem).e("icon")) }, [renderSlot(_ctx.$slots, "icon", { status: currentStatus.value }, () => [currentStatus.value === "finish" ? (openBlock(), createBlock(unref(CheckCircleFill), { key: 0 })) : currentStatus.value === "process" ? (openBlock(), createBlock(unref(Circle), { key: 1 })) : currentStatus.value === "wait" ? (openBlock(), createBlock(unref(Circle), { key: 2 })) : currentStatus.value === "error" ? (openBlock(), createBlock(unref(XCircle), { key: 3 })) : createCommentVNode("v-if", true)])], 2),
+				createElementVNode("div", { class: normalizeClass([unref(bem).e("line"), unref(bem).e("line-after")]) }, null, 2)
+			], 2), createElementVNode("div", { class: normalizeClass(unref(bem).e("body")) }, [renderSlot(_ctx.$slots, "default", { status: currentStatus.value }, () => [createElementVNode("div", { class: normalizeClass(unref(bem).e("name")) }, toDisplayString(__props.name), 3), __props.description ? (openBlock(), createElementBlock("div", {
+				key: 0,
+				class: normalizeClass(unref(bem).e("description"))
+			}, toDisplayString(__props.description), 3)) : createCommentVNode("v-if", true)])], 2)], 2);
+		};
+	}
+});
+//#endregion
+export { step_default as default };

package/components/steps/steps.d.ts

@@ -0,0 +1,18 @@
+import { type StepsProps, type StepsSlots } from './common';
+type __VLS_Slots = StepsSlots;
+declare const __VLS_base: import("vue").DefineComponent<StepsProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<StepsProps> & Readonly<{}>, {
+    reverse: boolean;
+    center: boolean;
+    direction: "vertical" | "horizontal";
+    itemList: import("./common").StepsItem[];
+    status: import("./common").StepsStatus;
+    current: number;
+}, {}, {}, {}, 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/components/steps/steps.js

@@ -0,0 +1,66 @@
+import { createBem } from "../../utils/bem.js";
+import { defaultStepsProps, stepsContextKey } from "./common.js";
+import step_default from "./step.js";
+import { Fragment, computed, createBlock, createElementBlock, defineComponent, mergeDefaults, normalizeClass, openBlock, provide, reactive, renderList, renderSlot, toRef } from "vue";
+//#region packages/sard/components/steps/steps.vue
+var steps_default = /*@__PURE__*/ defineComponent({
+	__name: "steps",
+	props: /*@__PURE__*/ mergeDefaults({
+		current: {
+			type: Number,
+			required: false
+		},
+		itemList: {
+			type: Array,
+			required: false
+		},
+		center: {
+			type: Boolean,
+			required: false
+		},
+		direction: {
+			type: String,
+			required: false
+		},
+		reverse: {
+			type: Boolean,
+			required: false
+		},
+		status: {
+			type: String,
+			required: false
+		}
+	}, defaultStepsProps),
+	setup(__props) {
+		const props = __props;
+		const bem = createBem("steps");
+		provide(stepsContextKey, reactive({
+			current: toRef(() => props.current),
+			direction: toRef(() => props.direction),
+			center: toRef(() => props.center),
+			status: toRef(() => props.status),
+			reverse: toRef(() => props.reverse)
+		}));
+		const stepsClass = computed(() => {
+			return [bem.b(), bem.m(props.direction)];
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", { class: normalizeClass(stepsClass.value) }, [renderSlot(_ctx.$slots, "default", {}, () => [(openBlock(true), createElementBlock(Fragment, null, renderList(__props.itemList, (item, i) => {
+				return openBlock(), createBlock(step_default, {
+					key: i,
+					index: i,
+					status: item.status,
+					name: item.name,
+					description: item.description
+				}, null, 8, [
+					"index",
+					"status",
+					"name",
+					"description"
+				]);
+			}), 128))])], 2);
+		};
+	}
+});
+//#endregion
+export { steps_default as default };

package/components/sticky/common.d.ts

@@ -0,0 +1,25 @@
+import type { InjectionKey, MaybeRefOrGetter } from 'vue';
+export interface StickyProps {
+    marginTop?: number;
+    marginBottom?: number;
+    zIndex?: number | string;
+}
+export interface StickySlots {
+    default?(props: Record<string, never>): any;
+}
+export interface StickyEmits {
+}
+export interface StickyExpose {
+}
+export interface StickyBoxProps {
+}
+export interface StickyBoxSlots {
+    default?(props: Record<string, never>): any;
+}
+export interface StickyBoxEmits {
+}
+export interface StickyBoxExpose {
+}
+export declare const stickyContextKey: InjectionKey<{
+    box: MaybeRefOrGetter<HTMLElement | null>;
+}>;

package/components/sticky/common.js

@@ -0,0 +1,4 @@
+//#region packages/sard/components/sticky/common.ts
+const stickyContextKey = Symbol("stickyContext");
+//#endregion
+export { stickyContextKey };

package/components/sticky/index.css

@@ -0,0 +1 @@
+.s-sticky{display:block}.s-sticky__fixation{position:relative;z-index:1}.s-sticky-box{position:relative}

package/components/sticky/index.d.ts

@@ -0,0 +1,7 @@
+import { type EnhancedComponent } from '../../utils';
+import _Sticky from './sticky.vue';
+import _StickyBox from './sticky-box.vue';
+export declare const Sticky: EnhancedComponent<typeof _Sticky>;
+export declare const StickyBox: EnhancedComponent<typeof _StickyBox>;
+export default Sticky;
+export type { StickyProps, StickySlots, StickyEmits, StickyExpose, StickyBoxProps, StickyBoxSlots, StickyBoxEmits, StickyBoxExpose, } from './common';

package/components/sticky/index.js

@@ -0,0 +1,8 @@
+import { enhanceComponent } from "../../utils/component.js";
+import sticky_default from "./sticky.js";
+import sticky_box_default from "./sticky-box.js";
+//#region packages/sard/components/sticky/index.ts
+const Sticky = enhanceComponent(sticky_default);
+const StickyBox = enhanceComponent(sticky_box_default);
+//#endregion
+export { Sticky, Sticky as default, StickyBox };

package/components/sticky/sticky-box.d.ts

@@ -0,0 +1,11 @@
+import { type StickyBoxProps, type StickyBoxSlots, type StickyBoxExpose } from './common';
+type __VLS_Slots = StickyBoxSlots;
+declare const __VLS_base: import("vue").DefineComponent<StickyBoxProps, StickyBoxExpose, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<StickyBoxProps> & Readonly<{}>, {}, {}, {}, {}, 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/components/sticky/sticky-box.js

@@ -0,0 +1,20 @@
+import { createBem } from "../../utils/bem.js";
+import { stickyContextKey } from "./common.js";
+import { createElementBlock, defineComponent, normalizeClass, openBlock, provide, renderSlot, unref, useTemplateRef } from "vue";
+//#region packages/sard/components/sticky/sticky-box.vue
+var sticky_box_default = /*@__PURE__*/ defineComponent({
+	__name: "sticky-box",
+	setup(__props, { expose: __expose }) {
+		const bem = createBem("sticky-box");
+		provide(stickyContextKey, { box: useTemplateRef("box") });
+		__expose({});
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", {
+				ref: "box",
+				class: normalizeClass(unref(bem).b())
+			}, [renderSlot(_ctx.$slots, "default")], 2);
+		};
+	}
+});
+//#endregion
+export { sticky_box_default as default };

package/components/sticky/sticky.d.ts

@@ -0,0 +1,11 @@
+import { type StickyProps, type StickySlots, type StickyExpose } from './common';
+type __VLS_Slots = StickySlots;
+declare const __VLS_base: import("vue").DefineComponent<StickyProps, StickyExpose, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<StickyProps> & Readonly<{}>, {}, {}, {}, {}, 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;
+    };
+};