@sectile/vue 0.6.0 → 0.8.0

package/dist/year-range-picker.d.ts

@@ -1,7 +1,7 @@
-import type { DateRangePickerOptions } from '@sectile/dom/date-range-picker';
-import type { DateRange, DateValue } from '@sectile/dom/date-field';
-import { type PickerPartProps, type PickerRootSlotProps, type PickerYearCellSlotProps } from './internal/date-picker.js';
-export interface YearRangePickerRootProps {
+import type { DateRangePickerOptions } from '@sectile/dom/temporal/date-range-picker';
+import type { DateRange, DateValue } from '@sectile/dom/temporal/date-field';
+import { type PickerPartProps, type PickerPortalProps, type PickerPositionProps, type PickerRootSlotProps, type PickerYearCellSlotProps } from './internal/date-picker.js';
+export interface YearRangePickerRootProps extends PickerPartProps, PickerPositionProps {
     readonly modelValue?: DateRange | null;
     readonly defaultValue?: DateRange | null;
     readonly highlightedValue?: DateValue;
@@ -9,236 +9,53 @@ export interface YearRangePickerRootProps {
     readonly referenceDate?: DateValue;
     readonly open?: boolean;
     readonly defaultOpen?: boolean;
+    readonly defaultView?: PickerRootSlotProps['viewMode'];
     readonly disabled?: boolean;
     readonly?: boolean;
     readonly required?: boolean;
     readonly label?: string;
     readonly policies?: DateRangePickerOptions['policies'];
 }
-export declare const YearRangePickerRoot: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
-    modelValue: {
-        type: import("vue").PropType<import("./internal/date-picker.js").PickerValue>;
-        default: undefined;
-    };
-    defaultValue: {
-        type: import("vue").PropType<import("./internal/date-picker.js").PickerValue>;
-        default: null;
-    };
-    open: {
-        type: BooleanConstructor;
-        default: undefined;
-    };
-    defaultOpen: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    highlightedValue: {
-        type: import("vue").PropType<DateValue>;
-        default: undefined;
-    };
-    defaultHighlightedValue: {
-        type: import("vue").PropType<DateValue>;
-        default: undefined;
-    };
-    referenceDate: {
-        type: import("vue").PropType<DateValue>;
-        default: undefined;
-    };
-    defaultView: {
-        type: import("vue").PropType<import("@sectile/temporal").CalendarViewMode>;
-        default: import("@sectile/temporal").CalendarViewMode;
-    };
-    disabled: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    readonly: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    required: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    label: {
-        type: StringConstructor;
-        default: undefined;
-    };
-    policies: {
-        type: import("vue").PropType<Readonly<Record<string, unknown>>>;
-        default: undefined;
-    };
-    as: {
-        type: import("vue").PropType<import("./primitive.js").PrimitiveAs>;
-        default: string;
-    };
-    asChild: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-}>, () => import("vue").VNodeChild, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    'update:modelValue': (_value: import("./internal/date-picker.js").PickerValue) => boolean;
-    'update:open': (_value: boolean) => boolean;
-    'update:highlightedValue': (_value: DateValue) => boolean;
-}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
-    modelValue: {
-        type: import("vue").PropType<import("./internal/date-picker.js").PickerValue>;
-        default: undefined;
-    };
-    defaultValue: {
-        type: import("vue").PropType<import("./internal/date-picker.js").PickerValue>;
-        default: null;
-    };
-    open: {
-        type: BooleanConstructor;
-        default: undefined;
-    };
-    defaultOpen: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    highlightedValue: {
-        type: import("vue").PropType<DateValue>;
-        default: undefined;
-    };
-    defaultHighlightedValue: {
-        type: import("vue").PropType<DateValue>;
-        default: undefined;
-    };
-    referenceDate: {
-        type: import("vue").PropType<DateValue>;
-        default: undefined;
-    };
-    defaultView: {
-        type: import("vue").PropType<import("@sectile/temporal").CalendarViewMode>;
-        default: import("@sectile/temporal").CalendarViewMode;
-    };
-    disabled: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    readonly: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    required: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    label: {
-        type: StringConstructor;
-        default: undefined;
-    };
-    policies: {
-        type: import("vue").PropType<Readonly<Record<string, unknown>>>;
-        default: undefined;
-    };
-    as: {
-        type: import("vue").PropType<import("./primitive.js").PrimitiveAs>;
-        default: string;
-    };
-    asChild: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-}>> & Readonly<{
-    "onUpdate:highlightedValue"?: (_value: DateValue) => any;
-    "onUpdate:modelValue"?: (_value: import("./internal/date-picker.js").PickerValue) => any;
-    "onUpdate:open"?: (_value: boolean) => any;
-}>, {
-    modelValue: import("./internal/date-picker.js").PickerValue;
-    defaultValue: import("./internal/date-picker.js").PickerValue;
-    open: boolean;
-    defaultOpen: boolean;
-    highlightedValue: DateValue;
-    defaultHighlightedValue: DateValue;
-    referenceDate: DateValue;
-    defaultView: import("@sectile/temporal").CalendarViewMode;
-    disabled: boolean;
-    readonly: boolean;
-    required: boolean;
-    label: string;
-    policies: Readonly<Record<string, unknown>>;
-    as: import("./primitive.js").PrimitiveAs;
-    asChild: boolean;
-}, import("vue").SlotsType<{
-    default: (props: PickerRootSlotProps) => import("vue").VNodeChild;
-}>, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export declare const YearRangePickerRoot: import("./internal/date-picker.js").PickerRootComponent<"date-range">;
+export type YearRangePickerRootSlotProps = PickerRootSlotProps<DateRange | null>;
 export type YearRangePickerValueChangeHandler = NonNullable<InstanceType<typeof YearRangePickerRoot>['$props']['onUpdate:modelValue']>;
 export type YearRangePickerOpenChangeHandler = NonNullable<InstanceType<typeof YearRangePickerRoot>['$props']['onUpdate:open']>;
 export type YearRangePickerHighlightedValueChangeHandler = NonNullable<InstanceType<typeof YearRangePickerRoot>['$props']['onUpdate:highlightedValue']>;
-export declare const YearRangePickerTrigger: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
-    as: {
-        type: import("vue").PropType<import("./primitive.js").PrimitiveAs>;
-        default: string;
-    };
-    asChild: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-}>, () => import("vue").VNodeChild, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
-    as: {
-        type: import("vue").PropType<import("./primitive.js").PrimitiveAs>;
-        default: string;
+export declare const YearRangePickerTrigger: import("./internal/date-picker.js").PickerRootPartComponent<"date-range">;
+export declare const YearRangePickerAnchor: import("./internal/date-picker.js").PickerRootPartComponent<"date-range">;
+export declare const YearRangePickerPortal: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    to: {
+        type: import("vue").PropType<string | HTMLElement>;
+        default: undefined;
     };
-    asChild: {
+    disabled: {
         type: BooleanConstructor;
         default: boolean;
     };
-}>> & Readonly<{}>, {
-    as: import("./primitive.js").PrimitiveAs;
-    asChild: boolean;
-}, import("vue").SlotsType<{
-    default: (props: PickerRootSlotProps) => import("vue").VNodeChild;
-}>, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
-export declare const YearRangePickerContent: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
-    as: {
-        type: import("vue").PropType<import("./primitive.js").PrimitiveAs>;
-        default: string;
-    };
-    asChild: {
+    defer: {
         type: BooleanConstructor;
         default: boolean;
     };
 }>, () => import("vue").VNodeChild, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
-    as: {
-        type: import("vue").PropType<import("./primitive.js").PrimitiveAs>;
-        default: string;
-    };
-    asChild: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-}>> & Readonly<{}>, {
-    as: import("./primitive.js").PrimitiveAs;
-    asChild: boolean;
-}, import("vue").SlotsType<{
-    default: (props: PickerRootSlotProps) => import("vue").VNodeChild;
-}>, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
-export declare const YearRangePickerGrid: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
-    as: {
-        type: import("vue").PropType<import("./primitive.js").PrimitiveAs>;
-        default: string;
+    to: {
+        type: import("vue").PropType<string | HTMLElement>;
+        default: undefined;
     };
-    asChild: {
+    disabled: {
         type: BooleanConstructor;
         default: boolean;
     };
-}>, () => import("vue").VNodeChild, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
-    as: {
-        type: import("vue").PropType<import("./primitive.js").PrimitiveAs>;
-        default: string;
-    };
-    asChild: {
+    defer: {
         type: BooleanConstructor;
         default: boolean;
     };
 }>> & Readonly<{}>, {
-    as: import("./primitive.js").PrimitiveAs;
-    asChild: boolean;
-}, import("vue").SlotsType<{
-    default: (props: PickerRootSlotProps) => import("vue").VNodeChild;
-}>, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+    to: string | HTMLElement;
+    disabled: boolean;
+    defer: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export declare const YearRangePickerContent: import("./internal/date-picker.js").PickerRootPartComponent<"date-range">;
+export declare const YearRangePickerGrid: import("./internal/date-picker.js").PickerRootPartComponent<"date-range">;
 export declare const YearRangePickerCell: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
     value: {
         type: import("vue").PropType<import("./internal/date-picker.js").PickerYearValue>;
@@ -351,53 +168,6 @@ export declare const YearRangePickerEndInput: import("vue").DefineComponent<impo
     as: import("./primitive.js").PrimitiveAs;
     asChild: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
-export declare const YearRangePickerPreviousPage: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
-    as: {
-        type: import("vue").PropType<import("./primitive.js").PrimitiveAs>;
-        default: string;
-    };
-    asChild: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-}>, () => import("vue").VNodeChild, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
-    as: {
-        type: import("vue").PropType<import("./primitive.js").PrimitiveAs>;
-        default: string;
-    };
-    asChild: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-}>> & Readonly<{}>, {
-    as: import("./primitive.js").PrimitiveAs;
-    asChild: boolean;
-}, import("vue").SlotsType<{
-    default: (props: PickerRootSlotProps) => import("vue").VNodeChild;
-}>, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
-export declare const YearRangePickerNextPage: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
-    as: {
-        type: import("vue").PropType<import("./primitive.js").PrimitiveAs>;
-        default: string;
-    };
-    asChild: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-}>, () => import("vue").VNodeChild, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
-    as: {
-        type: import("vue").PropType<import("./primitive.js").PrimitiveAs>;
-        default: string;
-    };
-    asChild: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-}>> & Readonly<{}>, {
-    as: import("./primitive.js").PrimitiveAs;
-    asChild: boolean;
-}, import("vue").SlotsType<{
-    default: (props: PickerRootSlotProps) => import("vue").VNodeChild;
-}>, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
-export type { DateRange as YearRangePickerValue, DateValue as YearPickerValue, PickerPartProps as YearRangePickerPartProps, PickerRootSlotProps as YearRangePickerRootSlotProps, PickerYearCellSlotProps as YearRangePickerCellSlotProps, };
-//# sourceMappingURL=year-range-picker.d.ts.map
+export declare const YearRangePickerPreviousPage: import("./internal/date-picker.js").PickerRootPartComponent<"date-range">;
+export declare const YearRangePickerNextPage: import("./internal/date-picker.js").PickerRootPartComponent<"date-range">;
+export type { DateRange as YearRangePickerValue, DateValue as YearPickerValue, PickerPartProps as YearRangePickerPartProps, PickerPortalProps as YearRangePickerPortalProps, PickerYearCellSlotProps as YearRangePickerCellSlotProps, };

package/dist/year-range-picker.js

@@ -1,11 +1,13 @@
-import { PickerContent, PickerGrid, PickerTrigger, createPickerInput, createPickerMove, createPickerYearCell, createPickerRoot, } from './internal/date-picker.js';
+import { PickerAnchor, PickerContent, PickerGrid, PickerPortal, PickerTrigger, createPickerInput, createPickerMove, createPickerYearCell, specializePickerRootPart, createPickerRoot, } from './internal/date-picker.js';
 export const YearRangePickerRoot = createPickerRoot('date-range', 'SectileYearRangePickerRoot', { scope: 'year-range-picker', granularity: 'year', defaultView: 'year' });
-export const YearRangePickerTrigger = PickerTrigger;
-export const YearRangePickerContent = PickerContent;
-export const YearRangePickerGrid = PickerGrid;
+export const YearRangePickerTrigger = specializePickerRootPart('date-range', PickerTrigger);
+export const YearRangePickerAnchor = specializePickerRootPart('date-range', PickerAnchor);
+export const YearRangePickerPortal = PickerPortal;
+export const YearRangePickerContent = specializePickerRootPart('date-range', PickerContent);
+export const YearRangePickerGrid = specializePickerRootPart('date-range', PickerGrid);
 export const YearRangePickerCell = createPickerYearCell('cell', 'SectileYearRangePickerCell');
 export const YearRangePickerStartInput = createPickerInput('start-input', 'SectileYearRangePickerStartInput');
 export const YearRangePickerEndInput = createPickerInput('end-input', 'SectileYearRangePickerEndInput');
-export const YearRangePickerPreviousPage = createPickerMove('year', -1, 'SectileYearRangePickerPreviousPage', 'previous-page');
-export const YearRangePickerNextPage = createPickerMove('year', 1, 'SectileYearRangePickerNextPage', 'next-page');
+export const YearRangePickerPreviousPage = specializePickerRootPart('date-range', createPickerMove('year', -1, 'SectileYearRangePickerPreviousPage', 'previous-page'));
+export const YearRangePickerNextPage = specializePickerRootPart('date-range', createPickerMove('year', 1, 'SectileYearRangePickerNextPage', 'next-page'));
 //# sourceMappingURL=year-range-picker.js.map

package/dist/year-range-picker.js.map

@@ -1 +1 @@
-{"version":3,"file":"year-range-picker.js","sourceRoot":"","sources":["../src/year-range-picker.ts"],"names":[],"mappings":"AAEA,OAAO,EACL,aAAa,EAAE,UAAU,EAAE,aAAa,EAAE,iBAAiB,EAAE,gBAAgB,EAAE,oBAAoB,EACnG,gBAAgB,GACjB,MAAM,2BAA2B,CAAC;AAgBnC,MAAM,CAAC,MAAM,mBAAmB,GAAG,gBAAgB,CAAC,YAAY,EAAE,4BAA4B,EAAE,EAAE,KAAK,EAAE,mBAAmB,EAAE,WAAW,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,EAAE,CAAC,CAAC;AAI1K,MAAM,CAAC,MAAM,sBAAsB,GAAG,aAAa,CAAC;AACpD,MAAM,CAAC,MAAM,sBAAsB,GAAG,aAAa,CAAC;AACpD,MAAM,CAAC,MAAM,mBAAmB,GAAG,UAAU,CAAC;AAC9C,MAAM,CAAC,MAAM,mBAAmB,GAAG,oBAAoB,CAAC,MAAM,EAAE,4BAA4B,CAAC,CAAC;AAC9F,MAAM,CAAC,MAAM,yBAAyB,GAAG,iBAAiB,CAAC,aAAa,EAAE,kCAAkC,CAAC,CAAC;AAC9G,MAAM,CAAC,MAAM,uBAAuB,GAAG,iBAAiB,CAAC,WAAW,EAAE,gCAAgC,CAAC,CAAC;AACxG,MAAM,CAAC,MAAM,2BAA2B,GAAG,gBAAgB,CAAC,MAAM,EAAE,CAAC,CAAC,EAAE,oCAAoC,EAAE,eAAe,CAAC,CAAC;AAC/H,MAAM,CAAC,MAAM,uBAAuB,GAAG,gBAAgB,CAAC,MAAM,EAAE,CAAC,EAAE,gCAAgC,EAAE,WAAW,CAAC,CAAC"}
+{"version":3,"file":"year-range-picker.js","sourceRoot":"","sources":["../src/year-range-picker.ts"],"names":[],"mappings":"AAEA,OAAO,EACL,YAAY,EAAE,aAAa,EAAE,UAAU,EAAE,YAAY,EAAE,aAAa,EAAE,iBAAiB,EAAE,gBAAgB,EAAE,oBAAoB,EAAE,wBAAwB,EACzJ,gBAAgB,GACjB,MAAM,2BAA2B,CAAC;AAiBnC,MAAM,CAAC,MAAM,mBAAmB,GAAG,gBAAgB,CAAC,YAAY,EAAE,4BAA4B,EAAE,EAAE,KAAK,EAAE,mBAAmB,EAAE,WAAW,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,EAAE,CAAC,CAAC;AAK1K,MAAM,CAAC,MAAM,sBAAsB,GAAG,wBAAwB,CAAC,YAAY,EAAE,aAAa,CAAC,CAAC;AAC5F,MAAM,CAAC,MAAM,qBAAqB,GAAG,wBAAwB,CAAC,YAAY,EAAE,YAAY,CAAC,CAAC;AAC1F,MAAM,CAAC,MAAM,qBAAqB,GAAG,YAAY,CAAC;AAClD,MAAM,CAAC,MAAM,sBAAsB,GAAG,wBAAwB,CAAC,YAAY,EAAE,aAAa,CAAC,CAAC;AAC5F,MAAM,CAAC,MAAM,mBAAmB,GAAG,wBAAwB,CAAC,YAAY,EAAE,UAAU,CAAC,CAAC;AACtF,MAAM,CAAC,MAAM,mBAAmB,GAAG,oBAAoB,CAAC,MAAM,EAAE,4BAA4B,CAAC,CAAC;AAC9F,MAAM,CAAC,MAAM,yBAAyB,GAAG,iBAAiB,CAAC,aAAa,EAAE,kCAAkC,CAAC,CAAC;AAC9G,MAAM,CAAC,MAAM,uBAAuB,GAAG,iBAAiB,CAAC,WAAW,EAAE,gCAAgC,CAAC,CAAC;AACxG,MAAM,CAAC,MAAM,2BAA2B,GAAG,wBAAwB,CAAC,YAAY,EAAE,gBAAgB,CAAC,MAAM,EAAE,CAAC,CAAC,EAAE,oCAAoC,EAAE,eAAe,CAAC,CAAC,CAAC;AACvK,MAAM,CAAC,MAAM,uBAAuB,GAAG,wBAAwB,CAAC,YAAY,EAAE,gBAAgB,CAAC,MAAM,EAAE,CAAC,EAAE,gCAAgC,EAAE,WAAW,CAAC,CAAC,CAAC"}