@uzum-tech/ui 0.1.0 → 0.1.2

package/es/anchor/src/AnchorAdapter.d.ts

@@ -0,0 +1,285 @@
+import type { ExtractPublicPropTypes } from '../../_utils';
+export interface AnchorInst {
+    scrollTo: (href: string) => void;
+}
+export declare const anchorProps: {
+    readonly type: {
+        readonly type: import("vue").PropType<"block" | "rail">;
+        readonly default: "rail";
+    };
+    readonly showRail: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
+    readonly showBackground: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
+    readonly bound: {
+        readonly type: NumberConstructor;
+        readonly default: 12;
+    };
+    readonly top: {
+        readonly type: NumberConstructor;
+        readonly default: 0;
+    };
+    readonly internalScrollable: BooleanConstructor;
+    readonly ignoreGap: BooleanConstructor;
+    readonly offsetTarget: import("vue").PropType<string | import("./utils").OffsetTarget | (() => HTMLElement)>;
+    readonly listenTo: import("vue").PropType<string | import("../../affix/src/utils").ScrollTarget | (() => HTMLElement) | undefined>;
+    readonly bottom: NumberConstructor;
+    readonly triggerTop: NumberConstructor;
+    readonly triggerBottom: NumberConstructor;
+    readonly position: {
+        readonly type: import("vue").PropType<"absolute" | "fix">;
+        readonly default: "fix";
+    };
+    readonly offsetTop: {
+        readonly type: import("vue").PropType<number | undefined>;
+        readonly validator: () => boolean;
+        readonly default: undefined;
+    };
+    readonly offsetBottom: {
+        readonly type: import("vue").PropType<number | undefined>;
+        readonly validator: () => boolean;
+        readonly default: undefined;
+    };
+    readonly target: {
+        readonly type: import("vue").PropType<(() => HTMLElement) | undefined>;
+        readonly validator: () => boolean;
+        readonly default: undefined;
+    };
+    readonly affix: BooleanConstructor;
+    readonly theme: import("vue").PropType<import("../../_mixins").Theme<"Anchor", {
+        borderRadius: string;
+        railColor: string;
+        railColorActive: string;
+        linkColor: string;
+        linkTextColor: string;
+        linkTextColorHover: string;
+        linkTextColorPressed: string;
+        linkTextColorActive: string;
+        linkFontSize: string;
+        linkPadding: string;
+        railWidth: string;
+    }, any>>;
+    readonly themeOverrides: import("vue").PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Anchor", {
+        borderRadius: string;
+        railColor: string;
+        railColorActive: string;
+        linkColor: string;
+        linkTextColor: string;
+        linkTextColorHover: string;
+        linkTextColorPressed: string;
+        linkTextColorActive: string;
+        linkFontSize: string;
+        linkPadding: string;
+        railWidth: string;
+    }, any>>>;
+    readonly builtinThemeOverrides: import("vue").PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Anchor", {
+        borderRadius: string;
+        railColor: string;
+        railColorActive: string;
+        linkColor: string;
+        linkTextColor: string;
+        linkTextColorHover: string;
+        linkTextColorPressed: string;
+        linkTextColorActive: string;
+        linkFontSize: string;
+        linkPadding: string;
+        railWidth: string;
+    }, any>>>;
+};
+export type AnchorProps = ExtractPublicPropTypes<typeof anchorProps>;
+declare const _default: import("vue").DefineComponent<{
+    readonly type: {
+        readonly type: import("vue").PropType<"block" | "rail">;
+        readonly default: "rail";
+    };
+    readonly showRail: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
+    readonly showBackground: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
+    readonly bound: {
+        readonly type: NumberConstructor;
+        readonly default: 12;
+    };
+    readonly top: {
+        readonly type: NumberConstructor;
+        readonly default: 0;
+    };
+    readonly internalScrollable: BooleanConstructor;
+    readonly ignoreGap: BooleanConstructor;
+    readonly offsetTarget: import("vue").PropType<string | import("./utils").OffsetTarget | (() => HTMLElement)>;
+    readonly listenTo: import("vue").PropType<string | import("../../affix/src/utils").ScrollTarget | (() => HTMLElement) | undefined>;
+    readonly bottom: NumberConstructor;
+    readonly triggerTop: NumberConstructor;
+    readonly triggerBottom: NumberConstructor;
+    readonly position: {
+        readonly type: import("vue").PropType<"absolute" | "fix">;
+        readonly default: "fix";
+    };
+    readonly offsetTop: {
+        readonly type: import("vue").PropType<number | undefined>;
+        readonly validator: () => boolean;
+        readonly default: undefined;
+    };
+    readonly offsetBottom: {
+        readonly type: import("vue").PropType<number | undefined>;
+        readonly validator: () => boolean;
+        readonly default: undefined;
+    };
+    readonly target: {
+        readonly type: import("vue").PropType<(() => HTMLElement) | undefined>;
+        readonly validator: () => boolean;
+        readonly default: undefined;
+    };
+    readonly affix: BooleanConstructor;
+    readonly theme: import("vue").PropType<import("../../_mixins").Theme<"Anchor", {
+        borderRadius: string;
+        railColor: string;
+        railColorActive: string;
+        linkColor: string;
+        linkTextColor: string;
+        linkTextColorHover: string;
+        linkTextColorPressed: string;
+        linkTextColorActive: string;
+        linkFontSize: string;
+        linkPadding: string;
+        railWidth: string;
+    }, any>>;
+    readonly themeOverrides: import("vue").PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Anchor", {
+        borderRadius: string;
+        railColor: string;
+        railColorActive: string;
+        linkColor: string;
+        linkTextColor: string;
+        linkTextColorHover: string;
+        linkTextColorPressed: string;
+        linkTextColorActive: string;
+        linkFontSize: string;
+        linkPadding: string;
+        railWidth: string;
+    }, any>>>;
+    readonly builtinThemeOverrides: import("vue").PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Anchor", {
+        borderRadius: string;
+        railColor: string;
+        railColorActive: string;
+        linkColor: string;
+        linkTextColor: string;
+        linkTextColorHover: string;
+        linkTextColorPressed: string;
+        linkTextColorActive: string;
+        linkFontSize: string;
+        linkPadding: string;
+        railWidth: string;
+    }, any>>>;
+}, {
+    scrollTo(href: string): void;
+    renderAnchor: () => JSX.Element;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    readonly type: {
+        readonly type: import("vue").PropType<"block" | "rail">;
+        readonly default: "rail";
+    };
+    readonly showRail: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
+    readonly showBackground: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
+    readonly bound: {
+        readonly type: NumberConstructor;
+        readonly default: 12;
+    };
+    readonly top: {
+        readonly type: NumberConstructor;
+        readonly default: 0;
+    };
+    readonly internalScrollable: BooleanConstructor;
+    readonly ignoreGap: BooleanConstructor;
+    readonly offsetTarget: import("vue").PropType<string | import("./utils").OffsetTarget | (() => HTMLElement)>;
+    readonly listenTo: import("vue").PropType<string | import("../../affix/src/utils").ScrollTarget | (() => HTMLElement) | undefined>;
+    readonly bottom: NumberConstructor;
+    readonly triggerTop: NumberConstructor;
+    readonly triggerBottom: NumberConstructor;
+    readonly position: {
+        readonly type: import("vue").PropType<"absolute" | "fix">;
+        readonly default: "fix";
+    };
+    readonly offsetTop: {
+        readonly type: import("vue").PropType<number | undefined>;
+        readonly validator: () => boolean;
+        readonly default: undefined;
+    };
+    readonly offsetBottom: {
+        readonly type: import("vue").PropType<number | undefined>;
+        readonly validator: () => boolean;
+        readonly default: undefined;
+    };
+    readonly target: {
+        readonly type: import("vue").PropType<(() => HTMLElement) | undefined>;
+        readonly validator: () => boolean;
+        readonly default: undefined;
+    };
+    readonly affix: BooleanConstructor;
+    readonly theme: import("vue").PropType<import("../../_mixins").Theme<"Anchor", {
+        borderRadius: string;
+        railColor: string;
+        railColorActive: string;
+        linkColor: string;
+        linkTextColor: string;
+        linkTextColorHover: string;
+        linkTextColorPressed: string;
+        linkTextColorActive: string;
+        linkFontSize: string;
+        linkPadding: string;
+        railWidth: string;
+    }, any>>;
+    readonly themeOverrides: import("vue").PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Anchor", {
+        borderRadius: string;
+        railColor: string;
+        railColorActive: string;
+        linkColor: string;
+        linkTextColor: string;
+        linkTextColorHover: string;
+        linkTextColorPressed: string;
+        linkTextColorActive: string;
+        linkFontSize: string;
+        linkPadding: string;
+        railWidth: string;
+    }, any>>>;
+    readonly builtinThemeOverrides: import("vue").PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Anchor", {
+        borderRadius: string;
+        railColor: string;
+        railColorActive: string;
+        linkColor: string;
+        linkTextColor: string;
+        linkTextColorHover: string;
+        linkTextColorPressed: string;
+        linkTextColorActive: string;
+        linkFontSize: string;
+        linkPadding: string;
+        railWidth: string;
+    }, any>>>;
+}>>, {
+    readonly type: "block" | "rail";
+    readonly bound: number;
+    readonly top: number;
+    readonly position: "absolute" | "fix";
+    readonly target: (() => HTMLElement) | undefined;
+    readonly affix: boolean;
+    readonly offsetTop: number | undefined;
+    readonly offsetBottom: number | undefined;
+    readonly showRail: boolean;
+    readonly showBackground: boolean;
+    readonly internalScrollable: boolean;
+    readonly ignoreGap: boolean;
+}, {}>;
+export default _default;

package/es/anchor/src/AnchorAdapter.js

@@ -0,0 +1,53 @@
+import { h, defineComponent, computed, ref } from 'vue';
+import { UAffix } from '../../affix';
+import { affixProps, affixPropKeys } from '../../affix/src/Affix';
+import { useConfig, useTheme, useThemeClass } from '../../_mixins';
+import { keep } from '../../_utils';
+import { anchorLight } from '../styles';
+import style from './styles/index.cssr';
+import UBaseAnchor, { baseAnchorProps, baseAnchorPropKeys } from './BaseAnchor';
+export const anchorProps = Object.assign(Object.assign(Object.assign(Object.assign({}, useTheme.props), { affix: Boolean }), affixProps), baseAnchorProps);
+export default defineComponent({
+    name: 'Anchor',
+    props: anchorProps,
+    setup(props, { slots }) {
+        const { mergedClsPrefixRef, inlineThemeDisabled } = useConfig(props);
+        const themeRef = useTheme('Anchor', '-anchor', style, anchorLight, props, mergedClsPrefixRef);
+        const anchorRef = ref(null);
+        const cssVarsRef = computed(() => {
+            const { self: { railColor, linkColor, railColorActive, linkTextColor, linkTextColorHover, linkTextColorPressed, linkTextColorActive, linkFontSize, railWidth, linkPadding, borderRadius }, common: { cubicBezierEaseInOut } } = themeRef.value;
+            return {
+                '--u-link-border-radius': borderRadius,
+                '--u-link-color': linkColor,
+                '--u-link-font-size': linkFontSize,
+                '--u-link-text-color': linkTextColor,
+                '--u-link-text-color-hover': linkTextColorHover,
+                '--u-link-text-color-active': linkTextColorActive,
+                '--u-link-text-color-pressed': linkTextColorPressed,
+                '--u-link-padding': linkPadding,
+                '--u-bezier': cubicBezierEaseInOut,
+                '--u-rail-color': railColor,
+                '--u-rail-color-active': railColorActive,
+                '--u-rail-width': railWidth
+            };
+        });
+        const themeClassHandle = inlineThemeDisabled
+            ? useThemeClass('anchor', undefined, cssVarsRef, props)
+            : undefined;
+        return {
+            scrollTo(href) {
+                var _a;
+                (_a = anchorRef.value) === null || _a === void 0 ? void 0 : _a.setActiveHref(href);
+            },
+            renderAnchor: () => {
+                themeClassHandle === null || themeClassHandle === void 0 ? void 0 : themeClassHandle.onRender();
+                return (h(UBaseAnchor, Object.assign({ ref: anchorRef, style: inlineThemeDisabled
+                        ? undefined
+                        : cssVarsRef.value, class: themeClassHandle === null || themeClassHandle === void 0 ? void 0 : themeClassHandle.themeClass.value }, keep(props, baseAnchorPropKeys), { mergedClsPrefix: mergedClsPrefixRef.value }), slots));
+            }
+        };
+    },
+    render() {
+        return !this.affix ? (this.renderAnchor()) : (h(UAffix, Object.assign({}, keep(this, affixPropKeys)), { default: this.renderAnchor }));
+    }
+});

package/es/anchor/src/BaseAnchor.d.ts

@@ -0,0 +1,105 @@
+import { type PropType } from 'vue';
+import type { OffsetTarget } from './utils';
+export interface BaseAnchorInst {
+    setActiveHref: (href: string) => void;
+}
+export declare const baseAnchorProps: {
+    readonly type: {
+        readonly type: PropType<"block" | "rail">;
+        readonly default: "rail";
+    };
+    readonly showRail: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
+    readonly showBackground: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
+    readonly bound: {
+        readonly type: NumberConstructor;
+        readonly default: 12;
+    };
+    readonly top: {
+        readonly type: NumberConstructor;
+        readonly default: 0;
+    };
+    readonly internalScrollable: BooleanConstructor;
+    readonly ignoreGap: BooleanConstructor;
+    readonly offsetTarget: PropType<string | OffsetTarget | (() => HTMLElement)>;
+};
+export declare const baseAnchorPropKeys: ("type" | "bound" | "top" | "showRail" | "showBackground" | "internalScrollable" | "ignoreGap" | "offsetTarget")[];
+declare const _default: import("vue").DefineComponent<{
+    mergedClsPrefix: {
+        type: StringConstructor;
+        required: true;
+    };
+    type: {
+        readonly type: PropType<"block" | "rail">;
+        readonly default: "rail";
+    };
+    showRail: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
+    showBackground: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
+    bound: {
+        readonly type: NumberConstructor;
+        readonly default: 12;
+    };
+    top: {
+        readonly type: NumberConstructor;
+        readonly default: 0;
+    };
+    internalScrollable: BooleanConstructor;
+    ignoreGap: BooleanConstructor;
+    offsetTarget: PropType<string | OffsetTarget | (() => HTMLElement)>;
+}, {
+    selfRef: import("vue").Ref<HTMLElement | null>;
+    barRef: import("vue").Ref<HTMLElement | null>;
+    slotRef: import("vue").Ref<HTMLElement | null>;
+    setActiveHref: (href: string, transition?: boolean) => void;
+    activeHref: import("vue").Ref<string | null>;
+    isBlockType: import("vue").ComputedRef<boolean>;
+    mergedShowRail: import("vue").ComputedRef<boolean>;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    mergedClsPrefix: {
+        type: StringConstructor;
+        required: true;
+    };
+    type: {
+        readonly type: PropType<"block" | "rail">;
+        readonly default: "rail";
+    };
+    showRail: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
+    showBackground: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
+    bound: {
+        readonly type: NumberConstructor;
+        readonly default: 12;
+    };
+    top: {
+        readonly type: NumberConstructor;
+        readonly default: 0;
+    };
+    internalScrollable: BooleanConstructor;
+    ignoreGap: BooleanConstructor;
+    offsetTarget: PropType<string | OffsetTarget | (() => HTMLElement)>;
+}>>, {
+    type: "block" | "rail";
+    bound: number;
+    top: number;
+    showRail: boolean;
+    showBackground: boolean;
+    internalScrollable: boolean;
+    ignoreGap: boolean;
+}, {}>;
+export default _default;