@swiftwc/ui 0.0.0-dev.5 → 0.0.0-dev.51
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.
- package/README.md +15 -0
- package/generated/buses/alert-dialog.d.ts +2 -0
- package/generated/buses/alert-dialog.js +1 -0
- package/generated/buses/confirmation-dialog.d.ts +2 -0
- package/generated/buses/confirmation-dialog.js +1 -0
- package/generated/buses/index.d.ts +6 -0
- package/generated/buses/index.js +6 -0
- package/generated/buses/lifecycle-observer.d.ts +2 -0
- package/generated/buses/lifecycle-observer.js +1 -0
- package/generated/client/index.d.ts +22 -4
- package/generated/client/index.js +219 -181
- package/generated/components/alert-dialog.d.ts +8 -0
- package/generated/components/alert-dialog.js +99 -0
- package/generated/components/body-view.js +5 -2
- package/generated/components/bordered-button.d.ts +17 -0
- package/generated/components/bordered-button.js +56 -0
- package/generated/components/bordered-prominent-button.d.ts +17 -0
- package/generated/components/bordered-prominent-button.js +56 -0
- package/generated/components/borderless-button.d.ts +12 -4
- package/generated/components/borderless-button.js +47 -16
- package/generated/components/confirmation-dialog.d.ts +9 -0
- package/generated/components/confirmation-dialog.js +113 -0
- package/generated/components/content-unavailable-view.d.ts +24 -0
- package/generated/components/content-unavailable-view.js +81 -0
- package/generated/components/date-picker.d.ts +36 -0
- package/generated/components/date-picker.js +461 -0
- package/generated/components/disclosure-group.d.ts +9 -7
- package/generated/components/disclosure-group.js +51 -65
- package/generated/components/fine-tooltip.d.ts +7 -0
- package/generated/components/fine-tooltip.js +107 -0
- package/generated/components/form-view.d.ts +9 -0
- package/generated/components/form-view.js +63 -0
- package/generated/components/glass-button.d.ts +16 -0
- package/generated/components/glass-button.js +53 -0
- package/generated/components/glass-prominent-button.d.ts +16 -0
- package/generated/components/glass-prominent-button.js +53 -0
- package/generated/components/h-stack.d.ts +10 -0
- package/generated/components/h-stack.js +19 -0
- package/generated/components/image-view.d.ts +9 -0
- package/generated/components/image-view.js +46 -0
- package/generated/components/index.d.ts +40 -10
- package/generated/components/index.js +40 -15
- package/generated/components/label-view.d.ts +9 -0
- package/generated/components/label-view.js +51 -0
- package/generated/components/list-view.d.ts +8 -0
- package/generated/components/list-view.js +32 -0
- package/generated/components/menu-view.d.ts +12 -0
- package/generated/components/menu-view.js +142 -0
- package/generated/components/navigation-large-title.d.ts +6 -0
- package/generated/components/navigation-large-title.js +181 -0
- package/generated/components/navigation-link.d.ts +10 -0
- package/generated/components/navigation-link.js +25 -0
- package/generated/components/navigation-split-view.d.ts +7 -2
- package/generated/components/navigation-split-view.js +19 -3
- package/generated/components/navigation-stack.d.ts +6 -2
- package/generated/components/navigation-stack.js +23 -59
- package/generated/components/navigation-title.d.ts +8 -0
- package/generated/components/navigation-title.js +50 -0
- package/generated/components/picker-view.d.ts +31 -0
- package/generated/components/picker-view.js +764 -0
- package/generated/components/plain-button.d.ts +7 -0
- package/generated/components/plain-button.js +22 -0
- package/generated/components/progress-view.d.ts +13 -0
- package/generated/components/progress-view.js +120 -0
- package/generated/components/screen-view.d.ts +1 -1
- package/generated/components/screen-view.js +4 -2
- package/generated/components/scroll-view-proxy.d.ts +8 -0
- package/generated/components/scroll-view-proxy.js +17 -0
- package/generated/components/scroll-view.d.ts +4 -2
- package/generated/components/scroll-view.js +179 -64
- package/generated/components/search-view.d.ts +7 -0
- package/generated/components/search-view.js +30 -0
- package/generated/components/section-view.d.ts +9 -0
- package/generated/components/section-view.js +85 -0
- package/generated/components/sheet-view.d.ts +3 -4
- package/generated/components/sheet-view.js +53 -17
- package/generated/components/sidebar-toggle.d.ts +1 -1
- package/generated/components/sidebar-toggle.js +76 -72
- package/generated/components/sidebar-view.d.ts +2 -4
- package/generated/components/sidebar-view.js +25 -17
- package/generated/components/sticky-container.d.ts +6 -0
- package/generated/components/sticky-container.js +26 -0
- package/generated/components/tab-bar.d.ts +5 -4
- package/generated/components/tab-bar.js +34 -17
- package/generated/components/tab-item.d.ts +4 -3
- package/generated/components/tab-item.js +125 -29
- package/generated/components/tab-view.d.ts +17 -2
- package/generated/components/tab-view.js +252 -17
- package/generated/components/table-view.d.ts +12 -0
- package/generated/components/table-view.js +153 -0
- package/generated/components/text-field.d.ts +29 -0
- package/generated/components/text-field.js +496 -0
- package/generated/components/tool-bar-item-group.d.ts +5 -0
- package/generated/components/tool-bar-item-group.js +28 -0
- package/generated/components/tool-bar-item.d.ts +8 -0
- package/generated/components/tool-bar-item.js +66 -0
- package/generated/components/tool-bar.d.ts +19 -0
- package/generated/components/tool-bar.js +93 -0
- package/generated/components/v-keyboard.d.ts +4 -0
- package/generated/components/v-keyboard.js +72 -67
- package/generated/components/v-stack.d.ts +13 -0
- package/generated/components/v-stack.js +22 -0
- package/generated/css/index.css +8548 -0
- package/generated/events/alert-dialog.d.ts +8 -0
- package/generated/events/confirmation-dialog.d.ts +9 -0
- package/generated/events/confirmation-dialog.js +1 -0
- package/generated/events/date-picker.d.ts +8 -0
- package/generated/events/date-picker.js +1 -0
- package/generated/events/index.d.ts +8 -0
- package/generated/events/index.js +8 -0
- package/generated/events/lifecycle-observer.d.ts +10 -0
- package/generated/events/lifecycle-observer.js +1 -0
- package/generated/events/picker-view.d.ts +15 -0
- package/generated/events/picker-view.js +1 -0
- package/generated/events/scroll-view.d.ts +10 -0
- package/generated/events/scroll-view.js +1 -0
- package/generated/events/tab-view.d.ts +28 -0
- package/generated/events/tab-view.js +1 -0
- package/generated/events/text-field.d.ts +8 -0
- package/generated/events/text-field.js +1 -0
- package/generated/i18n/index.d.ts +34 -0
- package/generated/i18n/index.js +167 -0
- package/generated/i18n/locales/el.d.ts +16 -0
- package/generated/i18n/locales/el.js +16 -0
- package/generated/i18n/locales/en.d.ts +16 -0
- package/generated/i18n/locales/en.js +16 -0
- package/generated/i18n/locales/index.d.ts +4 -0
- package/generated/i18n/locales/index.js +4 -0
- package/generated/internal/class/cleanup-registry.d.ts +5 -0
- package/generated/internal/class/cleanup-registry.js +38 -0
- package/generated/internal/class/css-style-observer.d.ts +8 -0
- package/generated/internal/class/css-style-observer.js +26 -0
- package/generated/internal/class/form-associated-base.d.ts +16 -0
- package/generated/internal/class/form-associated-base.js +78 -0
- package/generated/internal/class/mutation-observer-set.d.ts +9 -0
- package/generated/internal/class/mutation-observer-set.js +42 -0
- package/generated/internal/class/mutation-observer-singleton.d.ts +10 -0
- package/generated/internal/class/mutation-observer-singleton.js +64 -0
- package/generated/internal/class/navigation-path.d.ts +15 -0
- package/generated/internal/class/navigation-path.js +84 -0
- package/generated/internal/class/navigation-view.d.ts +8 -0
- package/generated/internal/class/navigation-view.js +72 -0
- package/generated/internal/class/resize-observer-singleton.d.ts +7 -0
- package/generated/internal/class/resize-observer-singleton.js +22 -0
- package/generated/internal/decorators/adaptive-slot.d.ts +1 -0
- package/generated/internal/decorators/adaptive-slot.js +50 -0
- package/generated/internal/decorators/custom-element.d.ts +5 -0
- package/generated/internal/decorators/custom-element.js +5 -0
- package/generated/internal/decorators/index.d.ts +6 -0
- package/generated/internal/decorators/index.js +6 -0
- package/generated/internal/decorators/microtask-on-connected.d.ts +39 -0
- package/generated/internal/decorators/microtask-on-connected.js +67 -0
- package/generated/internal/privateNamespace.d.ts +14 -0
- package/generated/internal/privateNamespace.js +168 -0
- package/generated/internal/utils/add.d.ts +1 -0
- package/generated/internal/utils/add.js +7 -0
- package/generated/internal/utils/cash/ancestors.d.ts +1 -0
- package/generated/internal/utils/cash/ancestors.js +27 -0
- package/generated/internal/utils/cash/index.d.ts +23 -0
- package/generated/internal/utils/cash/index.js +25 -0
- package/generated/internal/utils/cash/next-all.d.ts +1 -0
- package/generated/internal/utils/cash/next-all.js +10 -0
- package/generated/internal/utils/cash/next.d.ts +1 -0
- package/generated/internal/utils/cash/next.js +9 -0
- package/generated/internal/utils/cash/prev-all.d.ts +1 -0
- package/generated/internal/utils/cash/prev-all.js +10 -0
- package/generated/internal/utils/cash/prev.d.ts +1 -0
- package/generated/internal/utils/cash/prev.js +9 -0
- package/generated/internal/utils/cash/prop.d.ts +18 -0
- package/generated/internal/utils/cash/prop.js +30 -0
- package/generated/internal/utils/cash/siblings.d.ts +1 -0
- package/generated/internal/utils/cash/siblings.js +10 -0
- package/generated/internal/utils/clamp.d.ts +1 -0
- package/generated/internal/utils/clamp.js +4 -0
- package/generated/internal/utils/compare-big-decimals.d.ts +1 -0
- package/generated/internal/utils/compare-big-decimals.js +90 -0
- package/generated/internal/utils/debounce.d.ts +1 -0
- package/generated/internal/utils/debounce.js +13 -0
- package/generated/internal/utils/dev-flags.d.ts +3 -0
- package/generated/internal/utils/dev-flags.js +5 -0
- package/generated/internal/utils/ensure-placeholder.d.ts +1 -0
- package/generated/internal/utils/ensure-placeholder.js +55 -0
- package/generated/internal/utils/frame.d.ts +1 -0
- package/generated/internal/utils/frame.js +6 -0
- package/generated/internal/utils/index.d.ts +21 -1
- package/generated/internal/utils/index.js +24 -1
- package/generated/internal/utils/is-inside.d.ts +1 -0
- package/generated/internal/utils/is-inside.js +4 -0
- package/generated/internal/utils/kebab-case.d.ts +1 -1
- package/generated/internal/utils/list-active.d.ts +7 -0
- package/generated/internal/utils/list-active.js +83 -0
- package/generated/internal/utils/microtask.d.ts +1 -0
- package/generated/internal/utils/microtask.js +3 -0
- package/generated/internal/utils/onoff.d.ts +45 -0
- package/generated/internal/utils/onoff.js +31 -0
- package/generated/internal/utils/render-label-icon.d.ts +2 -0
- package/generated/internal/utils/render-label-icon.js +19 -0
- package/generated/internal/utils/render-label-title.d.ts +2 -0
- package/generated/internal/utils/render-label-title.js +16 -0
- package/generated/internal/utils/render-label.d.ts +1 -0
- package/generated/internal/utils/render-label.js +19 -0
- package/generated/internal/utils/set.d.ts +1 -0
- package/generated/internal/utils/set.js +7 -0
- package/generated/internal/utils/sleep.d.ts +1 -0
- package/generated/internal/utils/sleep.js +3 -0
- package/generated/internal/utils/slow-hide-show.d.ts +1 -0
- package/generated/internal/utils/slow-hide-show.js +16 -0
- package/generated/internal/utils/timeout.d.ts +5 -0
- package/generated/internal/utils/timeout.js +16 -0
- package/generated/internal/utils/touch-glass.d.ts +7 -0
- package/generated/internal/utils/touch-glass.js +19 -0
- package/generated/namespace-browser/base.d.ts +45 -0
- package/generated/namespace-browser/base.js +115 -0
- package/generated/namespace-browser/index.d.ts +7 -0
- package/generated/namespace-browser/index.js +1 -0
- package/generated/snapshot/index.d.ts +4 -11
- package/generated/snapshot/index.js +55 -145
- package/package.json +33 -9
- package/scss/_components.scss +60 -13
- package/scss/_final.scss +1 -0
- package/scss/_functions.scss +10 -0
- package/scss/_mixins.scss +4 -169
- package/scss/_placeholders.scss +3 -0
- package/scss/_transitions.scss +22 -1
- package/scss/_utils.scss +9 -0
- package/scss/_vars.scss +143 -23
- package/scss/base/_layout.scss +40 -16
- package/scss/base/_reboot.scss +151 -15
- package/scss/base/_root.scss +348 -25
- package/scss/colors/_index.scss +788 -70
- package/scss/components/_alert-dialog.scss +111 -0
- package/scss/components/_body-view.scss +12 -3
- package/scss/components/_bordered-button.scss +57 -0
- package/scss/components/_bordered-prominent-button.scss +64 -0
- package/scss/components/_borderless-button.scss +36 -6
- package/scss/components/_confirmation-dialog.scss +102 -0
- package/scss/components/_content-unavailable-view.scss +54 -0
- package/scss/components/_date-picker.scss +30 -0
- package/scss/components/_detail-placeholder.scss +153 -0
- package/scss/components/_disclosure-group.scss +143 -48
- package/scss/components/_fine-tooltip.scss +84 -0
- package/scss/components/_form-view.scss +233 -0
- package/scss/components/_full-screen.scss +7 -5
- package/scss/components/_glass-button.scss +59 -0
- package/scss/components/_glass-prominent-button.scss +70 -0
- package/scss/components/_h-divider.scss +13 -0
- package/scss/components/_h-flex-stack.scss +23 -0
- package/scss/components/_h-stack.scss +29 -0
- package/scss/components/_image-view.scss +9 -0
- package/scss/components/_index.scss +235 -7
- package/scss/components/_label-view copy.scss.txt +420 -0
- package/scss/components/_label-view.scss +367 -0
- package/scss/components/_label-view.scss.txt +536 -0
- package/scss/components/_labeled-content.scss +9 -0
- package/scss/components/_list-view.scss +269 -0
- package/scss/components/_menu-view.scss +215 -0
- package/scss/components/_navigation-large-title.scss +27 -0
- package/scss/components/_navigation-split-view.scss +329 -269
- package/scss/components/_navigation-stack.scss +6 -6
- package/scss/components/_navigation-title.scss +10 -0
- package/scss/components/_picker-view.scss +131 -0
- package/scss/components/_plain-button.scss +18 -0
- package/scss/components/_progress-view.scss +98 -0
- package/scss/components/_scroll-view-proxy.scss +79 -0
- package/scss/components/_scroll-view-toolbars.scss +126 -0
- package/scss/components/_scroll-view.scss +114 -66
- package/scss/components/_search-view.scss +22 -0
- package/scss/components/_section-view.scss +119 -0
- package/scss/components/_sheet-view.scss +78 -35
- package/scss/components/_sidebar-toggle.scss +87 -27
- package/scss/components/_sidebar-view.scss +30 -40
- package/scss/components/_sticky-container.scss +42 -0
- package/scss/components/_tab-bar.scss +207 -84
- package/scss/components/_tab-item.scss +25 -0
- package/scss/components/_tab-view.scss +270 -126
- package/scss/components/_table-column.scss +54 -0
- package/scss/components/_table-row.scss +209 -0
- package/scss/components/_table-view.scss +226 -0
- package/scss/components/_text-field.scss +37 -0
- package/scss/components/_tool-bar-item-group.scss +30 -19
- package/scss/components/_tool-bar-item.scss +81 -71
- package/scss/components/_tool-bar.scss +126 -63
- package/scss/components/_v-divider.scss +13 -0
- package/scss/components/_v-flex-stack.scss +29 -0
- package/scss/components/_v-keyboard.scss +6 -4
- package/scss/components/_v-stack.scss +15 -9
- package/scss/final/_touch-glass.scss +91 -0
- package/scss/index.scss +6 -2
- package/scss/mixins/_button.scss +44 -0
- package/scss/mixins/_color.scss +16 -0
- package/scss/mixins/_dialog.scss +89 -0
- package/scss/mixins/_index.scss +453 -0
- package/scss/placeholders/_buttons.scss +117 -0
- package/scss/placeholders/_lists.scss +594 -0
- package/scss/transitions/_alert-dialog.scss +18 -0
- package/scss/transitions/_bwd.navbar.scss +3 -13
- package/scss/transitions/_bwd.scss +4 -20
- package/scss/transitions/_confirmation-dialog.scss +27 -0
- package/scss/transitions/_disclosure-group.scss +35 -0
- package/scss/transitions/_fine-tooltip.scss +21 -0
- package/scss/transitions/_fwd.navbar.scss +4 -9
- package/scss/transitions/_fwd.scss +4 -34
- package/scss/transitions/_glass-button.scss +12 -0
- package/scss/transitions/_glass-prominent-button.scss +12 -0
- package/scss/transitions/_index.scss +35 -143
- package/scss/transitions/_menu-view.scss +26 -0
- package/scss/transitions/_navigation-split-view.scss +23 -0
- package/scss/transitions/_progress-view.scss +23 -0
- package/scss/transitions/_sheet-view.scss +30 -0
- package/scss/transitions/_sidebar-view.scss +36 -0
- package/scss/transitions/_tab-bar.scss +20 -0
- package/scss/utils/_frame.scss +91 -0
- package/scss/utils/_index.scss +78 -0
- package/scss/utils/_scroll-view.scss +14 -0
- package/scss/utils/_spacing.scss +25 -0
- package/scss/utils/_stacks.scss +210 -0
- package/web-components.html-data/en.json +637 -0
- package/generated/components/bottom-bar.d.ts +0 -10
- package/generated/components/bottom-bar.js +0 -73
- package/generated/components/navigation-bar.d.ts +0 -10
- package/generated/components/navigation-bar.js +0 -80
- package/generated/internal/class.d.ts +0 -18
- package/generated/internal/class.js +0 -18
- package/generated/namespace/index.d.ts +0 -6
- package/generated/styles.css +0 -1305
- package/scss/_dev.scss +0 -68
- package/scss/components/_tab-bar-stack.scss +0 -101
- package/scss/components/_toolbars.scss +0 -100
- package/scss/transitions/_dialog.scss +0 -32
- /package/generated/{namespace/index.js → events/alert-dialog.js} +0 -0
|
@@ -1,150 +1,60 @@
|
|
|
1
|
-
|
|
2
|
-
if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a getter");
|
|
3
|
-
if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
|
|
4
|
-
return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
|
|
5
|
-
};
|
|
6
|
-
var __classPrivateFieldSet = (this && this.__classPrivateFieldSet) || function (receiver, state, value, kind, f) {
|
|
7
|
-
if (kind === "m") throw new TypeError("Private method is not writable");
|
|
8
|
-
if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a setter");
|
|
9
|
-
if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot write private member to an object whose class did not declare it");
|
|
10
|
-
return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
|
|
11
|
-
};
|
|
12
|
-
var _a, _Snapshot_config, _Snapshot_getOwnConfig, _Snapshot_parent, _Snapshot_leaf, _Snapshot_root, _Snapshot_parentContainer, _Snapshot_container, _Snapshot_leafContainer, _Snapshot_parentToolbarItems, _Snapshot_toolbarItems, _Snapshot_leafToolbarItems, _Snapshot_queryScrollViewRels;
|
|
1
|
+
import { devFlags, onoff } from '../internal/utils';
|
|
13
2
|
export class Snapshot {
|
|
3
|
+
static #readyCalled = false;
|
|
4
|
+
static #config;
|
|
5
|
+
static #listeners;
|
|
6
|
+
static #breakpoints;
|
|
7
|
+
static get breakpoints() {
|
|
8
|
+
return this.#breakpoints;
|
|
9
|
+
}
|
|
10
|
+
static on = new EventTarget();
|
|
11
|
+
static waitReady = Promise.all([
|
|
12
|
+
'complete' === document.readyState ? Promise.resolve() : new Promise((r) => self.addEventListener('load', () => r(), { once: true })),
|
|
13
|
+
(async () => {
|
|
14
|
+
if (!this.#readyCalled)
|
|
15
|
+
await this.setOwnConfig();
|
|
16
|
+
})(), // Lazy config read promise, triggered on first access
|
|
17
|
+
]);
|
|
18
|
+
static async waitReadyFor(element) {
|
|
19
|
+
if (!element.isConnected)
|
|
20
|
+
return null;
|
|
21
|
+
await this.waitReady;
|
|
22
|
+
return element.isConnected ? element : null;
|
|
23
|
+
}
|
|
14
24
|
static get config() {
|
|
15
|
-
return
|
|
25
|
+
return this.#config;
|
|
16
26
|
}
|
|
17
27
|
static async setOwnConfig() {
|
|
18
|
-
if (
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
}
|
|
41
|
-
static
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
}
|
|
50
|
-
static getSnapshot(scrollView) {
|
|
51
|
-
console.debug(`${_a.name} ⚡️ getSnapshot`);
|
|
52
|
-
// root
|
|
53
|
-
for (let e = scrollView; e; e = e.parentElement)
|
|
54
|
-
e.matches('navigation-stack,navigation-split-view') && (__classPrivateFieldSet(this, _a, e, "f", _Snapshot_root));
|
|
55
|
-
// current
|
|
56
|
-
const { frame, toolbarElements: toolbarItems } = __classPrivateFieldGet(this, _a, "f", _Snapshot_queryScrollViewRels).call(this, scrollView);
|
|
57
|
-
__classPrivateFieldSet(this, _a, frame, "f", _Snapshot_container);
|
|
58
|
-
__classPrivateFieldSet(this, _a, toolbarItems, "f", _Snapshot_toolbarItems);
|
|
59
|
-
// parent
|
|
60
|
-
const possibleParent = __classPrivateFieldGet(this, _a, "f", _Snapshot_container)?.parentElement;
|
|
61
|
-
__classPrivateFieldSet(this, _a, possibleParent?.querySelector(`:scope > scroll-view,:scope > [is=sidebar-view] > scroll-view`) ?? undefined, "f", _Snapshot_parent); //const sv2 = pr.parentElement.querySelector(`:scope > scroll-view`) //pr.previousElementSibling
|
|
62
|
-
const { frame: parentFrame, toolbarElements: parentToolbarItems } = __classPrivateFieldGet(this, _a, "f", _Snapshot_queryScrollViewRels).call(this, __classPrivateFieldGet(this, _a, "f", _Snapshot_parent));
|
|
63
|
-
__classPrivateFieldSet(this, _a, parentFrame, "f", _Snapshot_parentContainer);
|
|
64
|
-
__classPrivateFieldSet(this, _a, parentToolbarItems, "f", _Snapshot_parentToolbarItems);
|
|
65
|
-
// const possibleParent =
|
|
66
|
-
// this.#container?.parentElement?.querySelector<HTMLElement>(
|
|
67
|
-
// `:scope > scroll-view,:scope > [is=sidebar-view] > scroll-view`
|
|
68
|
-
// ) ?? undefined, //const sv2 = pr.parentElement.querySelector(`:scope > scroll-view`) //pr.previousElementSibling
|
|
69
|
-
// {
|
|
70
|
-
// landmark: parentLm,
|
|
71
|
-
// frame: parentFrame,
|
|
72
|
-
// toolbarElements: parentToolbarItems,
|
|
73
|
-
// } = this.#queryScrollViewRels(possibleParent)
|
|
74
|
-
// this.#parent = parentLm
|
|
75
|
-
// this.#parentContainer = parentFrame
|
|
76
|
-
// this.#parentToolbarItems = parentToolbarItems
|
|
77
|
-
// detect children
|
|
78
|
-
let possibleNest = scrollView?.nextElementSibling;
|
|
79
|
-
if ('NAVIGATION-SPLIT-VIEW' === __classPrivateFieldGet(this, _a, "f", _Snapshot_root)?.tagName)
|
|
80
|
-
if (scrollView?.matches(`navigation-split-view > scroll-view${null !== __classPrivateFieldGet(this, _a, "f", _Snapshot_root).querySelector(':scope > [is=sidebar-view]') ? ',navigation-split-view > [is=sidebar-view] > scroll-view,navigation-split-view > body-view > scroll-view' : ''}`))
|
|
81
|
-
possibleNest = (scrollView?.parentElement?.matches('dialog[is=sidebar-view]')
|
|
82
|
-
? scrollView?.parentElement
|
|
83
|
-
: scrollView)?.previousElementSibling; // look for prev sibling instead
|
|
84
|
-
// const possibleNest = scrollView?.nextElementSibling as HTMLElement | null
|
|
85
|
-
__classPrivateFieldSet(this, _a, [
|
|
86
|
-
...(possibleNest?.querySelectorAll('scroll-view:not(navigation-stack[hidden] scroll-view,navigation-split-view[hidden] scroll-view)') ?? []),
|
|
87
|
-
]?.pop?.(), "f", _Snapshot_leaf); //'navigation-stack:not([hidden]) scroll-view'
|
|
88
|
-
const { frame: leafFrame, toolbarElements: leafToolbarItems } = __classPrivateFieldGet(this, _a, "f", _Snapshot_queryScrollViewRels).call(this, __classPrivateFieldGet(this, _a, "f", _Snapshot_leaf));
|
|
89
|
-
__classPrivateFieldSet(this, _a, leafFrame, "f", _Snapshot_leafContainer);
|
|
90
|
-
__classPrivateFieldSet(this, _a, leafToolbarItems, "f", _Snapshot_leafToolbarItems);
|
|
91
|
-
// const {
|
|
92
|
-
// landmark: leafLm,
|
|
93
|
-
// frame: leafFrame,
|
|
94
|
-
// toolbarElements: leafToolbarItems,
|
|
95
|
-
// } = this.#queryScrollViewRels(
|
|
96
|
-
// [
|
|
97
|
-
// ...(possibleNest?.querySelectorAll<Components.ScrollView>(
|
|
98
|
-
// 'scroll-view:not(navigation-stack[hidden] scroll-view,navigation-split-view[hidden] scroll-view)'
|
|
99
|
-
// ) ?? []),
|
|
100
|
-
// ]?.pop?.()
|
|
101
|
-
// ) //'navigation-stack:not([hidden]) scroll-view'
|
|
102
|
-
// this.#leaf = leafLm
|
|
103
|
-
// this.#leafContainer = leafFrame
|
|
104
|
-
// this.#leafToolbarItems = leafToolbarItems
|
|
105
|
-
console.debug(`${__classPrivateFieldGet(this, _a, "f", _Snapshot_root)?.tagName}
|
|
106
|
-
/ \\
|
|
107
|
-
B ${__classPrivateFieldGet(this, _a, "f", _Snapshot_parentContainer)?.tagName}
|
|
108
|
-
/ \\
|
|
109
|
-
D ${__classPrivateFieldGet(this, _a, "f", _Snapshot_container)?.tagName}
|
|
110
|
-
/ \\
|
|
111
|
-
H ${__classPrivateFieldGet(this, _a, "f", _Snapshot_leafContainer)?.tagName}
|
|
112
|
-
`);
|
|
113
|
-
// this.#childFrame = ['BODY-VIEW', 'NAVIGATION-STACK'].includes(
|
|
114
|
-
// possibleNest?.tagName ?? ''
|
|
115
|
-
// )
|
|
116
|
-
// ? (possibleNest ?? undefined)
|
|
117
|
-
// : undefined
|
|
118
|
-
// this.#childToolbarItems = this.#childFrame?.querySelectorAll(
|
|
119
|
-
// `:scope > navigation-bar > tool-bar-item,:scope > bottom-bar > tool-bar-item`
|
|
120
|
-
// )
|
|
121
|
-
}
|
|
28
|
+
if (!this.#readyCalled)
|
|
29
|
+
this.#readyCalled = true;
|
|
30
|
+
if ('complete' !== document.readyState)
|
|
31
|
+
await new Promise((r) => self.addEventListener('load', r, { once: true }));
|
|
32
|
+
this.#getOwnConfig();
|
|
33
|
+
}
|
|
34
|
+
static #getOwnConfig() {
|
|
35
|
+
const style = self.getComputedStyle(document.documentElement, '::before'), content = style.getPropertyValue('content'), unquoted = content.replace(/^"(.*)"$/, '$1'); // Remove quotes around the content
|
|
36
|
+
try {
|
|
37
|
+
this.#config = Object.fromEntries(new URLSearchParams(unquoted).entries()); // {"none": ""}
|
|
38
|
+
}
|
|
39
|
+
catch {
|
|
40
|
+
console.error('could-not-parse-config');
|
|
41
|
+
}
|
|
42
|
+
for (const off of this.#listeners ?? [])
|
|
43
|
+
off?.();
|
|
44
|
+
this.#listeners = new Set();
|
|
45
|
+
const mediaQueryList = self.matchMedia(`(pointer: fine) and (min-width: ${this.#config['ipad-sheet-view-inline-size']}) and (min-height: ${this.#config['ipad-sheet-view-height']})`);
|
|
46
|
+
this.#breakpoints = new Map([['fine_dialog_sheet', mediaQueryList.matches]]);
|
|
47
|
+
this.#listeners.add(onoff('change', (evt) => this.#handleMediaChange(evt, 'fine_dialog_sheet:change'), mediaQueryList).on());
|
|
48
|
+
if (devFlags.debug)
|
|
49
|
+
console.debug(this.#config);
|
|
50
|
+
}
|
|
51
|
+
static #handleMediaChange = ({ type, matches, media }, kind) => {
|
|
52
|
+
if (devFlags.debug)
|
|
53
|
+
console.debug(`${Snapshot.name} ⚡️ ${type}`);
|
|
54
|
+
this.#breakpoints?.set('fine_dialog_sheet', matches);
|
|
55
|
+
this.on.dispatchEvent(new MediaQueryListEvent(kind, {
|
|
56
|
+
matches,
|
|
57
|
+
media,
|
|
58
|
+
}));
|
|
59
|
+
};
|
|
122
60
|
}
|
|
123
|
-
_a = Snapshot, _Snapshot_getOwnConfig = function _Snapshot_getOwnConfig() {
|
|
124
|
-
const style = getComputedStyle(document.documentElement, '::before'), content = style.getPropertyValue('content'), unquoted = content.replace(/^"(.*)"$/, '$1'); // Remove quotes around the content
|
|
125
|
-
try {
|
|
126
|
-
__classPrivateFieldSet(this, _a, Object.fromEntries(new URLSearchParams(unquoted).entries()), "f", _Snapshot_config); // {"none": ""}
|
|
127
|
-
}
|
|
128
|
-
catch {
|
|
129
|
-
console.error('could-not-parse-config');
|
|
130
|
-
}
|
|
131
|
-
console.debug(__classPrivateFieldGet(this, _a, "f", _Snapshot_config));
|
|
132
|
-
};
|
|
133
|
-
_Snapshot_config = { value: void 0 };
|
|
134
|
-
//////
|
|
135
|
-
_Snapshot_parent = { value: void 0 };
|
|
136
|
-
_Snapshot_leaf = { value: void 0 };
|
|
137
|
-
_Snapshot_root = { value: void 0 };
|
|
138
|
-
_Snapshot_parentContainer = { value: void 0 };
|
|
139
|
-
_Snapshot_container = { value: void 0 };
|
|
140
|
-
_Snapshot_leafContainer = { value: void 0 };
|
|
141
|
-
_Snapshot_parentToolbarItems = { value: void 0 };
|
|
142
|
-
_Snapshot_toolbarItems = { value: void 0 };
|
|
143
|
-
_Snapshot_leafToolbarItems = { value: void 0 };
|
|
144
|
-
_Snapshot_queryScrollViewRels = { value: (sv) => {
|
|
145
|
-
const isSidebarWrapped = sv?.parentElement?.matches('dialog[is=sidebar-view]');
|
|
146
|
-
return {
|
|
147
|
-
frame: (isSidebarWrapped ? sv?.parentElement : sv)?.parentElement ?? undefined,
|
|
148
|
-
toolbarElements: sv?.parentElement?.querySelectorAll(`:scope > navigation-bar > tool-bar-item,:scope > bottom-bar > tool-bar-item,:scope > navigation-bar > tool-bar-item-group,:scope > bottom-bar > tool-bar-item-group`),
|
|
149
|
-
};
|
|
150
|
-
} };
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@swiftwc/ui",
|
|
3
|
-
"version": "0.0.0-dev.
|
|
3
|
+
"version": "0.0.0-dev.51",
|
|
4
4
|
"description": "Elegant SwiftUI-inspired web components for standalone web apps and web extensions.",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"access": "public"
|
|
@@ -20,7 +20,8 @@
|
|
|
20
20
|
},
|
|
21
21
|
"files": [
|
|
22
22
|
"generated",
|
|
23
|
-
"scss"
|
|
23
|
+
"scss",
|
|
24
|
+
"web-components.html-data"
|
|
24
25
|
],
|
|
25
26
|
"sass": "scss/index.scss",
|
|
26
27
|
"keywords": [
|
|
@@ -42,23 +43,46 @@
|
|
|
42
43
|
"types": "./generated/client/index.d.ts",
|
|
43
44
|
"default": "./generated/client/index.js"
|
|
44
45
|
},
|
|
45
|
-
"./
|
|
46
|
+
"./events": {
|
|
47
|
+
"types": "./generated/events/index.d.ts",
|
|
48
|
+
"default": "./generated/events/index.js"
|
|
49
|
+
},
|
|
50
|
+
"./css": "./generated/css/index.css",
|
|
46
51
|
"./scss": "./scss/index.scss",
|
|
47
|
-
"./scss/*": "./scss/*.scss"
|
|
52
|
+
"./scss/*": "./scss/*.scss",
|
|
53
|
+
"./customElements/en": "./custom-elements/en.json"
|
|
48
54
|
},
|
|
49
55
|
"bin": {
|
|
50
56
|
"swiftwc": "./generated/index.js"
|
|
51
57
|
},
|
|
52
58
|
"scripts": {
|
|
53
59
|
"prebuild": "rm -rf generated",
|
|
54
|
-
"build": "npm run build:ts && npm run build:scss",
|
|
60
|
+
"build": "npm run build:ts && npm run build:scss && npm run build:manifest && npm run build:barrels",
|
|
61
|
+
"postbuild": "npm run format:write",
|
|
55
62
|
"build:ts:watch": "npm run prebuild && tsc --watch",
|
|
56
63
|
"build:ts": "tsc",
|
|
57
|
-
"build:scss": "sass --no-source-map scss/index.scss generated/
|
|
64
|
+
"build:scss": "sass --style=expanded --no-source-map scss/index.scss generated/css/index.css",
|
|
65
|
+
"build:manifest": "tsx scripts/make-manifest.ts",
|
|
66
|
+
"build:barrels": "npm run build:barrels:components && npm run build:barrels:events && npm run build:barrels:buses && npm run build:barrels:i18n",
|
|
67
|
+
"build:barrels:components": "barrelsby --noHeader --delete --singleQuotes --noSemicolon --directory ./js/components --exclude \".\\.test\\.ts\"",
|
|
68
|
+
"build:barrels:events": "barrelsby --noHeader --delete --singleQuotes --noSemicolon --directory ./js/events --exclude \".\\.test\\.ts\"",
|
|
69
|
+
"build:barrels:buses": "barrelsby --noHeader --delete --singleQuotes --noSemicolon --exportDefault --directory ./js/buses",
|
|
70
|
+
"build:barrels:i18n": "barrelsby --noHeader --delete --singleQuotes --noSemicolon --exportDefault --fullPathname --directory ./js/i18n/locales",
|
|
71
|
+
"build:barrels:decorators": "barrelsby --noHeader --delete --singleQuotes --noSemicolon --exportDefault --directory ./js/internal/decorators",
|
|
58
72
|
"format:check": "prettier . --check",
|
|
59
|
-
"format:write": "prettier . --write"
|
|
73
|
+
"format:write": "prettier . --write",
|
|
74
|
+
"test": "vitest --dom",
|
|
75
|
+
"prepackage": "rm -rf generated",
|
|
76
|
+
"package": "npm run build:ts && npm run build:scss",
|
|
77
|
+
"version:pkg": "npm version $npm_config_bump --no-git-tag-version --preid=dev"
|
|
60
78
|
},
|
|
61
79
|
"devDependencies": {
|
|
62
|
-
"
|
|
63
|
-
|
|
80
|
+
"doctrine": "^3.0.0",
|
|
81
|
+
"happy-dom": "^20.7.0",
|
|
82
|
+
"sass": "^1.98.0",
|
|
83
|
+
"ts-morph": "^28.0.0",
|
|
84
|
+
"tsx": "^4.21.0",
|
|
85
|
+
"vitest": "^4.0.18"
|
|
86
|
+
},
|
|
87
|
+
"customElements": "custom-elements/en.json"
|
|
64
88
|
}
|
package/scss/_components.scss
CHANGED
|
@@ -4,36 +4,83 @@
|
|
|
4
4
|
|
|
5
5
|
@forward 'components/disclosure-group';
|
|
6
6
|
|
|
7
|
-
@forward 'components/
|
|
7
|
+
@forward 'components/image-view';
|
|
8
8
|
|
|
9
|
-
@forward 'components/
|
|
9
|
+
@forward 'components/h-divider';
|
|
10
|
+
@forward 'components/v-divider';
|
|
10
11
|
|
|
11
|
-
@forward 'components/
|
|
12
|
+
@forward 'components/full-screen';
|
|
12
13
|
|
|
13
|
-
@forward 'components/
|
|
14
|
+
@forward 'components/detail-placeholder';
|
|
15
|
+
@forward 'components/progress-view';
|
|
14
16
|
|
|
15
|
-
@forward 'components/
|
|
17
|
+
@forward 'components/fine-tooltip';
|
|
16
18
|
|
|
17
|
-
@forward 'components/
|
|
19
|
+
@forward 'components/sticky-container';
|
|
18
20
|
|
|
19
21
|
@forward 'components/sheet-view';
|
|
20
22
|
|
|
21
|
-
@forward 'components/
|
|
22
|
-
|
|
23
|
-
@forward 'components/navigation-split-view';
|
|
23
|
+
@forward 'components/content-unavailable-view';
|
|
24
24
|
|
|
25
|
-
@forward 'components/
|
|
26
|
-
|
|
27
|
-
@forward 'components/sidebar-view';
|
|
25
|
+
@forward 'components/confirmation-dialog';
|
|
26
|
+
@forward 'components/alert-dialog';
|
|
28
27
|
|
|
29
28
|
@forward 'components/scroll-view';
|
|
29
|
+
@forward 'components/scroll-view-proxy';
|
|
30
30
|
|
|
31
|
+
@forward 'components/h-stack';
|
|
31
32
|
@forward 'components/v-stack';
|
|
33
|
+
@forward 'components/h-flex-stack';
|
|
34
|
+
@forward 'components/v-flex-stack';
|
|
32
35
|
|
|
33
|
-
@forward 'components/
|
|
36
|
+
@forward 'components/scroll-view-toolbars';
|
|
34
37
|
|
|
35
38
|
@forward 'components/tool-bar-item';
|
|
36
39
|
|
|
37
40
|
@forward 'components/tool-bar-item-group';
|
|
38
41
|
|
|
42
|
+
@forward 'components/plain-button';
|
|
39
43
|
@forward 'components/borderless-button';
|
|
44
|
+
@forward 'components/bordered-button';
|
|
45
|
+
@forward 'components/bordered-prominent-button';
|
|
46
|
+
@forward 'components/glass-button';
|
|
47
|
+
@forward 'components/glass-prominent-button';
|
|
48
|
+
|
|
49
|
+
@forward 'components/search-view';
|
|
50
|
+
|
|
51
|
+
@forward 'components/tool-bar';
|
|
52
|
+
|
|
53
|
+
@forward 'components/label-view';
|
|
54
|
+
|
|
55
|
+
@forward 'components/labeled-content';
|
|
56
|
+
|
|
57
|
+
// @forward 'components/button-view';
|
|
58
|
+
|
|
59
|
+
@forward 'components/body-view';
|
|
60
|
+
|
|
61
|
+
@forward 'components/navigation-large-title';
|
|
62
|
+
@forward 'components/navigation-title';
|
|
63
|
+
|
|
64
|
+
@forward 'components/sidebar-toggle';
|
|
65
|
+
|
|
66
|
+
@forward 'components/menu-view';
|
|
67
|
+
|
|
68
|
+
@forward 'components/sidebar-view';
|
|
69
|
+
|
|
70
|
+
@forward 'components/list-view';
|
|
71
|
+
@forward 'components/form-view';
|
|
72
|
+
@forward 'components/section-view';
|
|
73
|
+
@forward 'components/table-view';
|
|
74
|
+
@forward 'components/table-row';
|
|
75
|
+
@forward 'components/table-column';
|
|
76
|
+
|
|
77
|
+
@forward 'components/text-field';
|
|
78
|
+
@forward 'components/date-picker';
|
|
79
|
+
@forward 'components/picker-view';
|
|
80
|
+
|
|
81
|
+
@forward 'components/navigation-stack';
|
|
82
|
+
@forward 'components/navigation-split-view';
|
|
83
|
+
|
|
84
|
+
@forward 'components/tab-view';
|
|
85
|
+
@forward 'components/tab-bar';
|
|
86
|
+
@forward 'components/tab-item';
|
package/scss/_final.scss
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
@forward 'final/touch-glass';
|
package/scss/_functions.scss
CHANGED
|
@@ -19,3 +19,13 @@
|
|
|
19
19
|
}
|
|
20
20
|
@return string.slice($parts, 2);
|
|
21
21
|
}
|
|
22
|
+
|
|
23
|
+
@function str-replace($string, $search, $replace: '') {
|
|
24
|
+
$index: string.index($string, $search);
|
|
25
|
+
|
|
26
|
+
@if $index {
|
|
27
|
+
@return string.slice($string, 1, $index - 1) + $replace + str-replace(string.slice($string, $index + string.length($search)), $search, $replace);
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
@return $string;
|
|
31
|
+
}
|
package/scss/_mixins.scss
CHANGED
|
@@ -1,172 +1,7 @@
|
|
|
1
|
-
@
|
|
1
|
+
@forward 'mixins/index';
|
|
2
2
|
|
|
3
|
-
@
|
|
4
|
-
grid-column: 1 / -1; // span all columns
|
|
5
|
-
grid-row: 1 / -1; // span all rows
|
|
6
|
-
}
|
|
3
|
+
@forward 'mixins/dialog';
|
|
7
4
|
|
|
8
|
-
@
|
|
9
|
-
& > * {
|
|
10
|
-
@include span-all;
|
|
11
|
-
// grid-column: 1 / -1; // span all columns
|
|
12
|
-
// grid-row: 1 / -1; // span all rows
|
|
13
|
-
}
|
|
5
|
+
@forward 'mixins/button';
|
|
14
6
|
|
|
15
|
-
|
|
16
|
-
@include span-all;
|
|
17
|
-
// grid-column: 1 / -1; // span all columns
|
|
18
|
-
// grid-row: 1 / -1; // span all rows
|
|
19
|
-
content: '';
|
|
20
|
-
display: block;
|
|
21
|
-
height: calc(100% + 1px); /* creates overflow */
|
|
22
|
-
// background-color: red;
|
|
23
|
-
z-index: -1;
|
|
24
|
-
pointer-events: none;
|
|
25
|
-
}
|
|
26
|
-
}
|
|
27
|
-
|
|
28
|
-
@mixin contain-overscroll() {
|
|
29
|
-
overscroll-behavior: contain;
|
|
30
|
-
-webkit-overflow-scrolling: touch;
|
|
31
|
-
}
|
|
32
|
-
|
|
33
|
-
@mixin reset-dialog {
|
|
34
|
-
// position: absolute;
|
|
35
|
-
inset-inline: 0px;
|
|
36
|
-
inset-block: 0px; //inset-inline-start: 0px;
|
|
37
|
-
// width: fit-content;
|
|
38
|
-
// height: fit-content;
|
|
39
|
-
margin: 0px; //margin-top: auto;
|
|
40
|
-
border: none; //border-top-style: solid;border-right-style: solid;border-bottom-style: solid;border-left-style: solid;
|
|
41
|
-
padding: 0px; //padding-top: 1em;
|
|
42
|
-
background-color: transparent; //background-color: canvas;
|
|
43
|
-
color: var(--primary-text); //color: canvastext;
|
|
44
|
-
// display: none;
|
|
45
|
-
|
|
46
|
-
// dialog:modal {
|
|
47
|
-
// position: fixed;
|
|
48
|
-
// overflow-x: auto;
|
|
49
|
-
// overflow-y: auto;
|
|
50
|
-
// inset-block-start: 0px;
|
|
51
|
-
max-width: 100lvw; //max-width: calc(100% - 2em - 6px);
|
|
52
|
-
max-height: 100lvh; //max-height: calc(100% - 2em - 6px);
|
|
53
|
-
// visibility: visible;
|
|
54
|
-
// }
|
|
55
|
-
|
|
56
|
-
outline: none;
|
|
57
|
-
}
|
|
58
|
-
|
|
59
|
-
@mixin make-navbar($dir: bottom) {
|
|
60
|
-
&:before,
|
|
61
|
-
&:after {
|
|
62
|
-
backface-visibility: hidden;
|
|
63
|
-
|
|
64
|
-
content: '';
|
|
65
|
-
inset: 0;
|
|
66
|
-
position: absolute;
|
|
67
|
-
pointer-events: none;
|
|
68
|
-
|
|
69
|
-
z-index: -1;
|
|
70
|
-
}
|
|
71
|
-
|
|
72
|
-
&:before {
|
|
73
|
-
backdrop-filter: blur(2px);
|
|
74
|
-
mask-image: linear-gradient(to #{$dir}, #000 50%, #0000 100%);
|
|
75
|
-
}
|
|
76
|
-
|
|
77
|
-
&:after {
|
|
78
|
-
background-image: linear-gradient(
|
|
79
|
-
to #{$dir},
|
|
80
|
-
var(--canvas-bg) 0,
|
|
81
|
-
#0000 100%
|
|
82
|
-
);
|
|
83
|
-
}
|
|
84
|
-
}
|
|
85
|
-
|
|
86
|
-
@mixin vt-toolbar-item-offscreen-keyframe($important: false) {
|
|
87
|
-
@if $important {
|
|
88
|
-
transform: scale(
|
|
89
|
-
var(--view-transition-toolbar-cell-offscreen-scale)
|
|
90
|
-
) !important;
|
|
91
|
-
filter: blur(10px) !important;
|
|
92
|
-
opacity: 0 !important;
|
|
93
|
-
} @else {
|
|
94
|
-
transform: scale(var(--view-transition-toolbar-cell-offscreen-scale));
|
|
95
|
-
filter: blur(10px);
|
|
96
|
-
opacity: 0;
|
|
97
|
-
}
|
|
98
|
-
}
|
|
99
|
-
|
|
100
|
-
@mixin vt-toolbar-item-onscreen-keyframe($important: false) {
|
|
101
|
-
@if $important {
|
|
102
|
-
transform: scale(
|
|
103
|
-
var(--view-transition-toolbar-cell-onscreen-scale)
|
|
104
|
-
) !important;
|
|
105
|
-
filter: none !important;
|
|
106
|
-
opacity: 1 !important;
|
|
107
|
-
} @else {
|
|
108
|
-
transform: scale(var(--view-transition-toolbar-cell-onscreen-scale));
|
|
109
|
-
filter: none;
|
|
110
|
-
opacity: 1;
|
|
111
|
-
}
|
|
112
|
-
}
|
|
113
|
-
|
|
114
|
-
@mixin toolbar-item-vt-state($transform, $filter, $opacity) {
|
|
115
|
-
transform: $transform;
|
|
116
|
-
filter: $filter;
|
|
117
|
-
opacity: $opacity;
|
|
118
|
-
}
|
|
119
|
-
|
|
120
|
-
@mixin if-iphone-landscape {
|
|
121
|
-
@media (max-width: #{vars.$ipad-landscape-bp-max}) and (orientation: landscape) {
|
|
122
|
-
@content;
|
|
123
|
-
}
|
|
124
|
-
}
|
|
125
|
-
|
|
126
|
-
@mixin if-iphone-portrait {
|
|
127
|
-
@media (max-width: #{vars.$ipad-portrait-bp-max}) and (orientation: portrait) {
|
|
128
|
-
@content;
|
|
129
|
-
}
|
|
130
|
-
}
|
|
131
|
-
|
|
132
|
-
@mixin if-ipad-landscape {
|
|
133
|
-
@media (min-width: #{vars.$ipad-landscape-bp-min}) and (orientation: landscape) {
|
|
134
|
-
@content;
|
|
135
|
-
}
|
|
136
|
-
}
|
|
137
|
-
|
|
138
|
-
@mixin if-ipad-portrait {
|
|
139
|
-
@media (min-width: #{vars.$ipad-portrait-bp-min}) and (orientation: portrait) {
|
|
140
|
-
@content;
|
|
141
|
-
}
|
|
142
|
-
}
|
|
143
|
-
|
|
144
|
-
@mixin if-ipad-sheet-fits {
|
|
145
|
-
@media (min-width: #{vars.$ipad-sheet-view-width}) and (min-height: #{vars.$ipad-sheet-view-height}) {
|
|
146
|
-
@content;
|
|
147
|
-
}
|
|
148
|
-
}
|
|
149
|
-
|
|
150
|
-
@mixin if-2col-split-view-fits {
|
|
151
|
-
@media (min-width: #{vars.$nav-split-view-2col-bp-min}) {
|
|
152
|
-
@content;
|
|
153
|
-
}
|
|
154
|
-
}
|
|
155
|
-
|
|
156
|
-
@mixin if-3col-split-view-fits {
|
|
157
|
-
@media (min-width: #{vars.$nav-split-view-3col-bp-min}) {
|
|
158
|
-
@content;
|
|
159
|
-
}
|
|
160
|
-
}
|
|
161
|
-
|
|
162
|
-
@mixin ifnot-2col-split-view-fits {
|
|
163
|
-
@media (max-width: #{vars.$nav-split-view-2col-bp-max}) {
|
|
164
|
-
@content;
|
|
165
|
-
}
|
|
166
|
-
}
|
|
167
|
-
|
|
168
|
-
@mixin ifnot-3col-split-view-fits {
|
|
169
|
-
@media (max-width: #{vars.$nav-split-view-3col-bp-max}) {
|
|
170
|
-
@content;
|
|
171
|
-
}
|
|
172
|
-
}
|
|
7
|
+
@forward 'mixins/color';
|
package/scss/_transitions.scss
CHANGED
|
@@ -8,4 +8,25 @@
|
|
|
8
8
|
|
|
9
9
|
@forward 'transitions/bwd.navbar';
|
|
10
10
|
|
|
11
|
-
@forward 'transitions/
|
|
11
|
+
@forward 'transitions/sheet-view';
|
|
12
|
+
|
|
13
|
+
@forward 'transitions/fine-tooltip';
|
|
14
|
+
|
|
15
|
+
@forward 'transitions/menu-view';
|
|
16
|
+
|
|
17
|
+
@forward 'transitions/progress-view';
|
|
18
|
+
|
|
19
|
+
@forward 'transitions/glass-button';
|
|
20
|
+
|
|
21
|
+
@forward 'transitions/glass-prominent-button';
|
|
22
|
+
|
|
23
|
+
@forward 'transitions/confirmation-dialog';
|
|
24
|
+
@forward 'transitions/alert-dialog';
|
|
25
|
+
|
|
26
|
+
@forward 'transitions/navigation-split-view';
|
|
27
|
+
|
|
28
|
+
@forward 'transitions/disclosure-group';
|
|
29
|
+
|
|
30
|
+
@forward 'transitions/sidebar-view';
|
|
31
|
+
|
|
32
|
+
@forward 'transitions/tab-bar';
|