@sectile/vue 0.6.0 → 0.8.0

package/dist/month-picker.d.ts

@@ -1,7 +1,7 @@
-import type { DatePickerOptions } from '@sectile/dom/date-picker';
-import type { DateValue } from '@sectile/dom/date-field';
-import { type PickerMonthCellSlotProps, type PickerPartProps, type PickerRootSlotProps } from './internal/date-picker.js';
-export interface MonthPickerRootProps {
+import type { DatePickerOptions } from '@sectile/dom/temporal/date-picker';
+import type { DateValue } from '@sectile/dom/temporal/date-field';
+import { type PickerMonthCellSlotProps, type PickerPartProps, type PickerPortalProps, type PickerPositionProps, type PickerRootSlotProps } from './internal/date-picker.js';
+export interface MonthPickerRootProps extends PickerPartProps, PickerPositionProps {
     readonly modelValue?: DateValue | null;
     readonly defaultValue?: DateValue | null;
     readonly highlightedValue?: DateValue;
@@ -9,236 +9,53 @@ export interface MonthPickerRootProps {
     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?: DatePickerOptions['policies'];
 }
-export declare const MonthPickerRoot: 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/calendar").CalendarViewMode>;
-        default: import("@sectile/temporal/calendar").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/calendar").CalendarViewMode>;
-        default: import("@sectile/temporal/calendar").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/calendar").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 MonthPickerRoot: import("./internal/date-picker.js").PickerRootComponent<"date">;
+export type MonthPickerRootSlotProps = PickerRootSlotProps<DateValue | null>;
 export type MonthPickerValueChangeHandler = NonNullable<InstanceType<typeof MonthPickerRoot>['$props']['onUpdate:modelValue']>;
 export type MonthPickerOpenChangeHandler = NonNullable<InstanceType<typeof MonthPickerRoot>['$props']['onUpdate:open']>;
 export type MonthPickerHighlightedValueChangeHandler = NonNullable<InstanceType<typeof MonthPickerRoot>['$props']['onUpdate:highlightedValue']>;
-export declare const MonthPickerTrigger: 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 MonthPickerTrigger: import("./internal/date-picker.js").PickerRootPartComponent<"date">;
+export declare const MonthPickerAnchor: import("./internal/date-picker.js").PickerRootPartComponent<"date">;
+export declare const MonthPickerPortal: 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 MonthPickerContent: 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 MonthPickerGrid: 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 MonthPickerContent: import("./internal/date-picker.js").PickerRootPartComponent<"date">;
+export declare const MonthPickerGrid: import("./internal/date-picker.js").PickerRootPartComponent<"date">;
 export declare const MonthPickerCell: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
     value: {
         type: import("vue").PropType<import("@sectile/temporal/calendar").CalendarMonthValue>;
@@ -311,53 +128,6 @@ export declare const MonthPickerInput: import("vue").DefineComponent<import("vue
     as: import("./primitive.js").PrimitiveAs;
     asChild: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
-export declare const MonthPickerPreviousYear: 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 MonthPickerNextYear: 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 { DateValue as MonthPickerValue, PickerMonthCellSlotProps as MonthPickerCellSlotProps, PickerPartProps as MonthPickerPartProps, PickerRootSlotProps as MonthPickerRootSlotProps, };
-//# sourceMappingURL=month-picker.d.ts.map
+export declare const MonthPickerPreviousYear: import("./internal/date-picker.js").PickerRootPartComponent<"date">;
+export declare const MonthPickerNextYear: import("./internal/date-picker.js").PickerRootPartComponent<"date">;
+export type { DateValue as MonthPickerValue, PickerMonthCellSlotProps as MonthPickerCellSlotProps, PickerPartProps as MonthPickerPartProps, PickerPortalProps as MonthPickerPortalProps, };

package/dist/month-picker.js

@@ -1,10 +1,12 @@
-import { PickerContent, PickerGrid, PickerTrigger, createPickerInput, createPickerMonthCell, createPickerMove, createPickerRoot, } from './internal/date-picker.js';
+import { PickerAnchor, PickerContent, PickerGrid, PickerPortal, PickerTrigger, createPickerInput, createPickerMonthCell, createPickerMove, specializePickerRootPart, createPickerRoot, } from './internal/date-picker.js';
 export const MonthPickerRoot = createPickerRoot('date', 'SectileMonthPickerRoot', { scope: 'month-picker', granularity: 'month', defaultView: 'year' });
-export const MonthPickerTrigger = PickerTrigger;
-export const MonthPickerContent = PickerContent;
-export const MonthPickerGrid = PickerGrid;
+export const MonthPickerTrigger = specializePickerRootPart('date', PickerTrigger);
+export const MonthPickerAnchor = specializePickerRootPart('date', PickerAnchor);
+export const MonthPickerPortal = PickerPortal;
+export const MonthPickerContent = specializePickerRootPart('date', PickerContent);
+export const MonthPickerGrid = specializePickerRootPart('date', PickerGrid);
 export const MonthPickerCell = createPickerMonthCell('cell', 'SectileMonthPickerCell');
 export const MonthPickerInput = createPickerInput('input', 'SectileMonthPickerInput');
-export const MonthPickerPreviousYear = createPickerMove('year', -1, 'SectileMonthPickerPreviousYear');
-export const MonthPickerNextYear = createPickerMove('year', 1, 'SectileMonthPickerNextYear');
+export const MonthPickerPreviousYear = specializePickerRootPart('date', createPickerMove('year', -1, 'SectileMonthPickerPreviousYear'));
+export const MonthPickerNextYear = specializePickerRootPart('date', createPickerMove('year', 1, 'SectileMonthPickerNextYear'));
 //# sourceMappingURL=month-picker.js.map

package/dist/month-picker.js.map

@@ -1 +1 @@
-{"version":3,"file":"month-picker.js","sourceRoot":"","sources":["../src/month-picker.ts"],"names":[],"mappings":"AAEA,OAAO,EACL,aAAa,EAAE,UAAU,EAAE,aAAa,EAAE,iBAAiB,EAAE,qBAAqB,EAAE,gBAAgB,EACpG,gBAAgB,GACjB,MAAM,2BAA2B,CAAC;AAgBnC,MAAM,CAAC,MAAM,eAAe,GAAG,gBAAgB,CAAC,MAAM,EAAE,wBAAwB,EAAE,EAAE,KAAK,EAAE,cAAc,EAAE,WAAW,EAAE,OAAO,EAAE,WAAW,EAAE,MAAM,EAAE,CAAC,CAAC;AAIxJ,MAAM,CAAC,MAAM,kBAAkB,GAAG,aAAa,CAAC;AAChD,MAAM,CAAC,MAAM,kBAAkB,GAAG,aAAa,CAAC;AAChD,MAAM,CAAC,MAAM,eAAe,GAAG,UAAU,CAAC;AAC1C,MAAM,CAAC,MAAM,eAAe,GAAG,qBAAqB,CAAC,MAAM,EAAE,wBAAwB,CAAC,CAAC;AACvF,MAAM,CAAC,MAAM,gBAAgB,GAAG,iBAAiB,CAAC,OAAO,EAAE,yBAAyB,CAAC,CAAC;AACtF,MAAM,CAAC,MAAM,uBAAuB,GAAG,gBAAgB,CAAC,MAAM,EAAE,CAAC,CAAC,EAAE,gCAAgC,CAAC,CAAC;AACtG,MAAM,CAAC,MAAM,mBAAmB,GAAG,gBAAgB,CAAC,MAAM,EAAE,CAAC,EAAE,4BAA4B,CAAC,CAAC"}
+{"version":3,"file":"month-picker.js","sourceRoot":"","sources":["../src/month-picker.ts"],"names":[],"mappings":"AAEA,OAAO,EACL,YAAY,EAAE,aAAa,EAAE,UAAU,EAAE,YAAY,EAAE,aAAa,EAAE,iBAAiB,EAAE,qBAAqB,EAAE,gBAAgB,EAAE,wBAAwB,EAC1J,gBAAgB,GACjB,MAAM,2BAA2B,CAAC;AAiBnC,MAAM,CAAC,MAAM,eAAe,GAAG,gBAAgB,CAAC,MAAM,EAAE,wBAAwB,EAAE,EAAE,KAAK,EAAE,cAAc,EAAE,WAAW,EAAE,OAAO,EAAE,WAAW,EAAE,MAAM,EAAE,CAAC,CAAC;AAKxJ,MAAM,CAAC,MAAM,kBAAkB,GAAG,wBAAwB,CAAC,MAAM,EAAE,aAAa,CAAC,CAAC;AAClF,MAAM,CAAC,MAAM,iBAAiB,GAAG,wBAAwB,CAAC,MAAM,EAAE,YAAY,CAAC,CAAC;AAChF,MAAM,CAAC,MAAM,iBAAiB,GAAG,YAAY,CAAC;AAC9C,MAAM,CAAC,MAAM,kBAAkB,GAAG,wBAAwB,CAAC,MAAM,EAAE,aAAa,CAAC,CAAC;AAClF,MAAM,CAAC,MAAM,eAAe,GAAG,wBAAwB,CAAC,MAAM,EAAE,UAAU,CAAC,CAAC;AAC5E,MAAM,CAAC,MAAM,eAAe,GAAG,qBAAqB,CAAC,MAAM,EAAE,wBAAwB,CAAC,CAAC;AACvF,MAAM,CAAC,MAAM,gBAAgB,GAAG,iBAAiB,CAAC,OAAO,EAAE,yBAAyB,CAAC,CAAC;AACtF,MAAM,CAAC,MAAM,uBAAuB,GAAG,wBAAwB,CAAC,MAAM,EAAE,gBAAgB,CAAC,MAAM,EAAE,CAAC,CAAC,EAAE,gCAAgC,CAAC,CAAC,CAAC;AACxI,MAAM,CAAC,MAAM,mBAAmB,GAAG,wBAAwB,CAAC,MAAM,EAAE,gBAAgB,CAAC,MAAM,EAAE,CAAC,EAAE,4BAA4B,CAAC,CAAC,CAAC"}