apptify 0.2.0 → 0.5.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (73) hide show
  1. package/README.md +40 -239
  2. package/dist/apptify.css +1 -1
  3. package/dist/apptify.js +4153 -2177
  4. package/dist/components/button.d.ts +1 -1
  5. package/dist/components/content.d.ts +73 -362
  6. package/dist/components/date-picker.d.ts +10 -0
  7. package/dist/components/forms.d.ts +77 -18
  8. package/dist/components/foundation.d.ts +2061 -111
  9. package/dist/components/gallery-scrollbar.d.ts +46 -0
  10. package/dist/components/mobile-image-viewer.d.ts +166 -0
  11. package/dist/components/navibar.d.ts +80 -0
  12. package/dist/components/overlays.d.ts +127 -158
  13. package/dist/components/tabs.d.ts +117 -0
  14. package/dist/core/context.d.ts +573 -9
  15. package/dist/core/desktop-image-enter.d.ts +6 -0
  16. package/dist/core/desktop-image-return.d.ts +1 -0
  17. package/dist/core/device.d.ts +5 -0
  18. package/dist/core/image-gallery-motion.d.ts +2 -0
  19. package/dist/core/image-geometry.d.ts +28 -0
  20. package/dist/core/image-motion.d.ts +18 -0
  21. package/dist/core/layers.d.ts +2 -0
  22. package/dist/core/motion.d.ts +2 -0
  23. package/dist/core/popup-motion.d.ts +12 -0
  24. package/dist/core/popup-placement.d.ts +31 -0
  25. package/dist/core/preview-navigation.d.ts +5 -0
  26. package/dist/index.d.ts +1214 -339
  27. package/docs/COMPONENTS.md +18 -16
  28. package/docs/PLAYGROUND-TEMPLATE.md +51 -0
  29. package/docs/VALIDATION.md +25 -1
  30. package/package.json +35 -7
  31. package/templates/playground/README.md +21 -0
  32. package/templates/playground/gitignore +3 -0
  33. package/templates/playground/index.html +26 -0
  34. package/templates/playground/package.json +26 -0
  35. package/templates/playground/playground/App.vue +73 -0
  36. package/templates/playground/playground/ComponentDemo.vue +234 -0
  37. package/templates/playground/playground/catalog.ts +80 -0
  38. package/templates/playground/playground/components/ComponentIndex.vue +62 -0
  39. package/templates/playground/playground/components/PageFooter.vue +3 -0
  40. package/templates/playground/playground/components/UserMenu.vue +132 -0
  41. package/templates/playground/playground/components/not-found-paper-scene.vue +210 -0
  42. package/templates/playground/playground/components/not-found-paper-story.ts +149 -0
  43. package/templates/playground/playground/env.d.ts +1 -0
  44. package/templates/playground/playground/main.ts +8 -0
  45. package/templates/playground/playground/router/index.ts +24 -0
  46. package/templates/playground/playground/style.css +228 -0
  47. package/templates/playground/playground/views/[...all].vue +68 -0
  48. package/templates/playground/playground/views/components.vue +126 -0
  49. package/templates/playground/playground/views/index.vue +75 -0
  50. package/templates/playground/playground/views/settings.vue +98 -0
  51. package/templates/playground/public/images/SOURCES.md +21 -0
  52. package/templates/playground/public/images/airpods-max-orange.jpg +0 -0
  53. package/templates/playground/public/images/architecture.jpg +0 -0
  54. package/templates/playground/public/images/city.jpg +0 -0
  55. package/templates/playground/public/images/coast.jpg +0 -0
  56. package/templates/playground/public/images/desert.jpg +0 -0
  57. package/templates/playground/public/images/food.jpg +0 -0
  58. package/templates/playground/public/images/forest.jpg +0 -0
  59. package/templates/playground/public/images/lake.jpg +0 -0
  60. package/templates/playground/public/images/mountains.jpg +0 -0
  61. package/templates/playground/public/images/snow.jpg +0 -0
  62. package/templates/playground/public/images/sunset.jpg +0 -0
  63. package/templates/playground/public/images/waterfall.jpg +0 -0
  64. package/templates/playground/source-snapshot.json +111 -0
  65. package/templates/playground/tsconfig.json +24 -0
  66. package/templates/playground/vite.config.ts +9 -0
  67. package/tooling/create-playground.mjs +35 -0
  68. package/tooling/prepare-package.mjs +35 -0
  69. package/tooling/prepare-playground.mjs +103 -0
  70. package/tooling/test-create-apptify.mjs +76 -0
  71. package/tooling/test-playground-package.mjs +188 -0
  72. package/tooling/vite.d.ts +5 -0
  73. package/tooling/vite.js +10 -0
@@ -0,0 +1,46 @@
1
+ import { type PropType } from 'vue';
2
+ export declare const GalleryScrollbar: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
3
+ target: {
4
+ type: PropType<() => HTMLElement | undefined>;
5
+ required: true;
6
+ };
7
+ controls: {
8
+ type: StringConstructor;
9
+ required: true;
10
+ };
11
+ }>, {}, {
12
+ box: HTMLElement | null;
13
+ width: number;
14
+ total: number;
15
+ left: number;
16
+ observer: ResizeObserver | null;
17
+ mutations: MutationObserver | null;
18
+ drag: {
19
+ id: number;
20
+ x: number;
21
+ left: number;
22
+ snap: string;
23
+ } | null;
24
+ }, {
25
+ maximum(): number;
26
+ progress(): number;
27
+ }, {
28
+ observe(): void;
29
+ measure(): void;
30
+ scroll(left: number): void;
31
+ start(event: PointerEvent): void;
32
+ move(event: PointerEvent): void;
33
+ end(event?: PointerEvent): void;
34
+ key(event: KeyboardEvent): void;
35
+ }, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "interaction"[], "interaction", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
36
+ target: {
37
+ type: PropType<() => HTMLElement | undefined>;
38
+ required: true;
39
+ };
40
+ controls: {
41
+ type: StringConstructor;
42
+ required: true;
43
+ };
44
+ }>> & Readonly<{
45
+ onInteraction?: ((...args: any[]) => any) | undefined;
46
+ }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
@@ -0,0 +1,166 @@
1
+ import { type PropType } from 'vue';
2
+ import { type PhotoGeometry, type PhotoPoint, type PhotoSize } from '../core/image-geometry';
3
+ import type { AppleViewerImage } from './overlays';
4
+ type Phase = 'preparing' | 'opening' | 'open' | 'settling' | 'closing';
5
+ interface Gesture {
6
+ mode: 'pending' | 'pan' | 'pinch' | 'swipe' | 'dismiss' | 'blocked';
7
+ start: PhotoPoint;
8
+ pan: PhotoPoint;
9
+ scale: number;
10
+ distance: number;
11
+ anchor: PhotoPoint;
12
+ multiple: boolean;
13
+ moved: boolean;
14
+ lastY: number;
15
+ lastTime: number;
16
+ velocity: number;
17
+ swipe: number;
18
+ samples: Array<{
19
+ x: number;
20
+ time: number;
21
+ }>;
22
+ }
23
+ interface Mask {
24
+ image: HTMLImageElement;
25
+ parent: HTMLElement;
26
+ opacity: string;
27
+ background: string;
28
+ }
29
+ interface PhotoLayer {
30
+ element: HTMLElement;
31
+ restore: HTMLElement | null;
32
+ close: () => void;
33
+ top: (value: boolean, depth: number) => void;
34
+ modal: boolean;
35
+ trap: boolean;
36
+ persistent: () => boolean;
37
+ arrows?: (event: KeyboardEvent) => void;
38
+ }
39
+ interface Flight {
40
+ base: PhotoSize;
41
+ pose: Keyframe;
42
+ }
43
+ export declare function createMobileImageViewer(registerLayer: (layer: PhotoLayer) => () => void): import("vue").DefineComponent<import("vue").ExtractPropTypes<{
44
+ modelValue: BooleanConstructor;
45
+ index: {
46
+ type: NumberConstructor;
47
+ default: number;
48
+ };
49
+ loop: BooleanConstructor;
50
+ images: {
51
+ type: PropType<Array<string | AppleViewerImage>>;
52
+ default: () => never[];
53
+ };
54
+ origin: PropType<(index: number, reveal?: boolean) => HTMLImageElement | null>;
55
+ motion: {
56
+ type: PropType<import("..").ComponentMotion>;
57
+ default: string;
58
+ };
59
+ }>, {}, {
60
+ present: boolean;
61
+ current: number;
62
+ phase: Phase;
63
+ isTop: boolean;
64
+ depth: number;
65
+ viewport: PhotoSize;
66
+ viewportOrigin: PhotoPoint;
67
+ sizes: Record<number, PhotoSize>;
68
+ failures: Record<number, boolean>;
69
+ scale: number;
70
+ pan: PhotoPoint;
71
+ drag: PhotoPoint;
72
+ swipe: number;
73
+ paging: {
74
+ from: number;
75
+ direction: number;
76
+ } | null;
77
+ zooming: boolean;
78
+ flight: Flight | null;
79
+ background: number;
80
+ chrome: number;
81
+ pointers: import("vue").Raw<Map<number, PhotoPoint>>;
82
+ gesture: Gesture | null;
83
+ pendingTap: {
84
+ point: PhotoPoint;
85
+ time: number;
86
+ index: number;
87
+ } | null;
88
+ tapTimer: number | null;
89
+ masked: Mask | null;
90
+ animations: import("vue").Raw<Animation[]>;
91
+ epoch: number;
92
+ suppressClickUntil: number;
93
+ disposeLayer: (() => void) | null;
94
+ resizeObserver: ResizeObserver | null;
95
+ releaseNavigation: (() => void) | null;
96
+ }, {
97
+ resolvedMotion(): string;
98
+ pictures(): AppleViewerImage[];
99
+ loaded(): boolean;
100
+ fitted(): PhotoSize;
101
+ dragScale(): number;
102
+ backdropOpacity(): number;
103
+ }, {
104
+ clearTap(): void;
105
+ tap(point: PhotoPoint): void;
106
+ cancelAnimations(): void;
107
+ animate(entries: Array<{
108
+ element: HTMLElement;
109
+ from: Keyframe;
110
+ to: Keyframe;
111
+ }>, duration: number, curve?: string): Promise<boolean>;
112
+ measure(): void;
113
+ openViewer(): Promise<void>;
114
+ inspectImages(): Promise<void>;
115
+ imageLoaded(index: number, image: HTMLImageElement): void;
116
+ imageFailed(index: number, event: Event): void;
117
+ restoreThumbnail(): void;
118
+ maskThumbnail(reveal?: boolean): HTMLImageElement | null;
119
+ normalGeometry(): PhotoGeometry;
120
+ fly(from: PhotoGeometry, to: PhotoGeometry, opening: boolean): Promise<boolean>;
121
+ enter(): Promise<void>;
122
+ close(): void;
123
+ closeViewer(emit: boolean): Promise<void>;
124
+ select(index: number, velocity?: number): Promise<void>;
125
+ slideOffset(index: number): number;
126
+ atPageEdge(offset: number): boolean;
127
+ pageVelocity(gesture: Gesture): number;
128
+ point(event: MouseEvent): PhotoPoint;
129
+ startGesture(multiple?: boolean): void;
130
+ pointerDown(event: PointerEvent): void;
131
+ pointerMove(event: PointerEvent): void;
132
+ pointerUp(event: PointerEvent, cancelled?: boolean): void;
133
+ settlePose(): Promise<void>;
134
+ toggleZoom(point: PhotoPoint): Promise<void>;
135
+ zoom(event: WheelEvent): void;
136
+ }, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("change" | "close" | "error" | "update:modelValue" | "update:index" | "after-close")[], "change" | "close" | "error" | "update:modelValue" | "update:index" | "after-close", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
137
+ modelValue: BooleanConstructor;
138
+ index: {
139
+ type: NumberConstructor;
140
+ default: number;
141
+ };
142
+ loop: BooleanConstructor;
143
+ images: {
144
+ type: PropType<Array<string | AppleViewerImage>>;
145
+ default: () => never[];
146
+ };
147
+ origin: PropType<(index: number, reveal?: boolean) => HTMLImageElement | null>;
148
+ motion: {
149
+ type: PropType<import("..").ComponentMotion>;
150
+ default: string;
151
+ };
152
+ }>> & Readonly<{
153
+ onChange?: ((...args: any[]) => any) | undefined;
154
+ onClose?: ((...args: any[]) => any) | undefined;
155
+ onError?: ((...args: any[]) => any) | undefined;
156
+ "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
157
+ "onUpdate:index"?: ((...args: any[]) => any) | undefined;
158
+ "onAfter-close"?: ((...args: any[]) => any) | undefined;
159
+ }>, {
160
+ motion: import("..").ComponentMotion;
161
+ modelValue: boolean;
162
+ loop: boolean;
163
+ index: number;
164
+ images: (string | AppleViewerImage)[];
165
+ }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
166
+ export {};
@@ -22,6 +22,10 @@ export declare const AppleNavibar: import("vue").DefineComponent<import("vue").E
22
22
  type: BooleanConstructor;
23
23
  default: boolean;
24
24
  };
25
+ hideOnPreview: {
26
+ type: BooleanConstructor;
27
+ default: undefined;
28
+ };
25
29
  breakpoint: {
26
30
  type: NumberConstructor;
27
31
  default: number;
@@ -31,15 +35,21 @@ export declare const AppleNavibar: import("vue").DefineComponent<import("vue").E
31
35
  default: string;
32
36
  };
33
37
  }>, {
38
+ previewRoot: import("vue").ShallowRef<HTMLElement | undefined, HTMLElement | undefined>;
39
+ previewActive: import("vue").Ref<boolean, boolean>;
34
40
  uid: string;
35
41
  }, {
36
42
  collapsed: boolean;
37
43
  open: boolean;
44
+ menuHeight: number;
38
45
  localValue: AppleValue | undefined;
39
46
  observer: ResizeObserver | null;
40
47
  }, {
41
48
  activeValue(): AppleValue | undefined;
49
+ previewHidden(): boolean;
42
50
  }, {
51
+ observeSize(): void;
52
+ measureMenu(): void;
43
53
  measure(): void;
44
54
  setOpen(value: boolean): void;
45
55
  close(restore?: boolean): void;
@@ -69,6 +79,10 @@ export declare const AppleNavibar: import("vue").DefineComponent<import("vue").E
69
79
  type: BooleanConstructor;
70
80
  default: boolean;
71
81
  };
82
+ hideOnPreview: {
83
+ type: BooleanConstructor;
84
+ default: undefined;
85
+ };
72
86
  breakpoint: {
73
87
  type: NumberConstructor;
74
88
  default: number;
@@ -88,8 +102,34 @@ export declare const AppleNavibar: import("vue").DefineComponent<import("vue").E
88
102
  items: AppleItem[];
89
103
  brand: string;
90
104
  brandHref: string;
105
+ hideOnPreview: boolean;
91
106
  breakpoint: number;
92
107
  }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
108
+ export declare const AppleAside: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
109
+ hideOnPreview: {
110
+ type: BooleanConstructor;
111
+ default: boolean;
112
+ };
113
+ motion: {
114
+ type: PropType<import("..").ComponentMotion>;
115
+ default: string;
116
+ };
117
+ }>, {
118
+ previewRoot: import("vue").ShallowRef<HTMLElement | undefined, HTMLElement | undefined>;
119
+ previewActive: import("vue").Ref<boolean, boolean>;
120
+ }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
121
+ hideOnPreview: {
122
+ type: BooleanConstructor;
123
+ default: boolean;
124
+ };
125
+ motion: {
126
+ type: PropType<import("..").ComponentMotion>;
127
+ default: string;
128
+ };
129
+ }>> & Readonly<{}>, {
130
+ motion: import("..").ComponentMotion;
131
+ hideOnPreview: boolean;
132
+ }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
93
133
  export declare const navigationComponents: {
94
134
  AppleNavibar: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
95
135
  items: {
@@ -113,6 +153,10 @@ export declare const navigationComponents: {
113
153
  type: BooleanConstructor;
114
154
  default: boolean;
115
155
  };
156
+ hideOnPreview: {
157
+ type: BooleanConstructor;
158
+ default: undefined;
159
+ };
116
160
  breakpoint: {
117
161
  type: NumberConstructor;
118
162
  default: number;
@@ -122,15 +166,21 @@ export declare const navigationComponents: {
122
166
  default: string;
123
167
  };
124
168
  }>, {
169
+ previewRoot: import("vue").ShallowRef<HTMLElement | undefined, HTMLElement | undefined>;
170
+ previewActive: import("vue").Ref<boolean, boolean>;
125
171
  uid: string;
126
172
  }, {
127
173
  collapsed: boolean;
128
174
  open: boolean;
175
+ menuHeight: number;
129
176
  localValue: AppleValue | undefined;
130
177
  observer: ResizeObserver | null;
131
178
  }, {
132
179
  activeValue(): AppleValue | undefined;
180
+ previewHidden(): boolean;
133
181
  }, {
182
+ observeSize(): void;
183
+ measureMenu(): void;
134
184
  measure(): void;
135
185
  setOpen(value: boolean): void;
136
186
  close(restore?: boolean): void;
@@ -160,6 +210,10 @@ export declare const navigationComponents: {
160
210
  type: BooleanConstructor;
161
211
  default: boolean;
162
212
  };
213
+ hideOnPreview: {
214
+ type: BooleanConstructor;
215
+ default: undefined;
216
+ };
163
217
  breakpoint: {
164
218
  type: NumberConstructor;
165
219
  default: number;
@@ -179,6 +233,32 @@ export declare const navigationComponents: {
179
233
  items: AppleItem[];
180
234
  brand: string;
181
235
  brandHref: string;
236
+ hideOnPreview: boolean;
182
237
  breakpoint: number;
183
238
  }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
239
+ AppleAside: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
240
+ hideOnPreview: {
241
+ type: BooleanConstructor;
242
+ default: boolean;
243
+ };
244
+ motion: {
245
+ type: PropType<import("..").ComponentMotion>;
246
+ default: string;
247
+ };
248
+ }>, {
249
+ previewRoot: import("vue").ShallowRef<HTMLElement | undefined, HTMLElement | undefined>;
250
+ previewActive: import("vue").Ref<boolean, boolean>;
251
+ }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
252
+ hideOnPreview: {
253
+ type: BooleanConstructor;
254
+ default: boolean;
255
+ };
256
+ motion: {
257
+ type: PropType<import("..").ComponentMotion>;
258
+ default: string;
259
+ };
260
+ }>> & Readonly<{}>, {
261
+ motion: import("..").ComponentMotion;
262
+ hideOnPreview: boolean;
263
+ }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
184
264
  };