@vectoriox/iox-ui 5.37.0 → 5.38.0
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/actions-core/index.d.ts +6 -1
- package/composite-core/index.d.ts +294 -14
- package/design-core/index.d.ts +130 -3
- package/fesm2022/vectoriox-iox-ui-actions-core.mjs +9 -3
- package/fesm2022/vectoriox-iox-ui-actions-core.mjs.map +1 -1
- package/fesm2022/vectoriox-iox-ui-composite-core.mjs +694 -59
- package/fesm2022/vectoriox-iox-ui-composite-core.mjs.map +1 -1
- package/fesm2022/vectoriox-iox-ui-design-core.mjs +172 -3
- package/fesm2022/vectoriox-iox-ui-design-core.mjs.map +1 -1
- package/fesm2022/vectoriox-iox-ui-generation-core.mjs +410 -10
- package/fesm2022/vectoriox-iox-ui-generation-core.mjs.map +1 -1
- package/fesm2022/vectoriox-iox-ui-media-core.mjs +571 -0
- package/fesm2022/vectoriox-iox-ui-media-core.mjs.map +1 -0
- package/fesm2022/vectoriox-iox-ui.mjs +478 -118
- package/fesm2022/vectoriox-iox-ui.mjs.map +1 -1
- package/generation-core/index.d.ts +167 -4
- package/index.d.ts +206 -24
- package/media-core/index.d.ts +277 -0
- package/media-core/package.json +3 -0
- package/package.json +5 -1
- package/src/actions-core/element-actions.ts +9 -2
- package/src/composite-core/composite-node.ts +4 -0
- package/src/composite-core/lightbox.ts +192 -0
- package/src/composite-core/public-api.ts +3 -0
- package/src/composite-core/slider-runtime.ts +180 -0
- package/src/composite-core/slider.ts +378 -0
- package/src/composite-core/structure.ts +17 -4
- package/src/design-core/element-styles.ts +27 -0
- package/src/design-core/flavor-spec.generated.ts +146 -2
- package/src/generation-core/baseline-roles.ts +2 -0
- package/src/generation-core/compose-site.ts +80 -4
- package/src/generation-core/node-baselines.generated.ts +148 -4
- package/src/generation-core/patterns.ts +17 -0
- package/src/generation-core/site-spec.generated.ts +164 -0
- package/src/media-core/public-api.ts +9 -0
- package/src/media-core/video-runtime.ts +239 -0
- package/src/media-core/video.ts +443 -0
- package/styles/iox-design.css +96 -0
package/actions-core/index.d.ts
CHANGED
|
@@ -113,6 +113,11 @@ declare const BEHAVIOUR_ACTION_TYPES: ReadonlySet<string>;
|
|
|
113
113
|
* DIALOG/BEHAVIOUR, and composite-core `runCompositeItemAction` runs it on the target item's own runtime. */
|
|
114
114
|
declare const ITEM_ACTION_TYPES: Readonly<Record<string, CompositeItemAction>>;
|
|
115
115
|
/** The item action an action type runs, or null when it is not one. */
|
|
116
|
+
/** True when an `openDialog` action opens its dialog at the clicked row's slide (CC3 "Open at the clicked item"). */
|
|
117
|
+
declare function opensAtClickedItem(action: {
|
|
118
|
+
type?: string;
|
|
119
|
+
params?: Record<string, unknown> | null;
|
|
120
|
+
} | null | undefined): boolean;
|
|
116
121
|
declare function itemActionOf(type: string | null | undefined): CompositeItemAction | null;
|
|
117
122
|
/** The consent actions' dispatch set (C3) — the engines branch on it beside DIALOG/BEHAVIOUR.
|
|
118
123
|
* `openConsentPreferences` is dialog-opening by nature and included so ONE branch owns consent. */
|
|
@@ -175,5 +180,5 @@ declare function dialogOpenerAttributes(node: OpenerNodeLike | null | undefined,
|
|
|
175
180
|
/** The selector of every opener of one dialog (by its DOM id) — what a runtime updates on open/close. */
|
|
176
181
|
declare function dialogOpenersSelector(dialogDomIdValue: string): string;
|
|
177
182
|
|
|
178
|
-
export { BEHAVIOUR_ACTION_TYPES, CONSENT_ACTION_TYPES, DIALOG_ACTION_TYPE_SET, DIALOG_OPENER_ACTION_TYPES, DIALOG_OPENER_TRIGGER, DIALOG_SELECTOR, ELEMENT_ACTION_DESCRIPTORS, ELEMENT_ACTION_GROUP_ORDER, FORM_SUBMIT_ACTION_DESCRIPTORS, ITEM_ACTION_TYPES, OpenerAttribute, SERVER_ELEMENT_ACTION_TYPES, addableActions, dialogDomId, dialogOpenerAttributes, dialogOpenersSelector, groupedElementActions, itemActionOf, nodeIdOfDialogDomId, openedDialogId, resolveActionAvailability };
|
|
183
|
+
export { BEHAVIOUR_ACTION_TYPES, CONSENT_ACTION_TYPES, DIALOG_ACTION_TYPE_SET, DIALOG_OPENER_ACTION_TYPES, DIALOG_OPENER_TRIGGER, DIALOG_SELECTOR, ELEMENT_ACTION_DESCRIPTORS, ELEMENT_ACTION_GROUP_ORDER, FORM_SUBMIT_ACTION_DESCRIPTORS, ITEM_ACTION_TYPES, OpenerAttribute, SERVER_ELEMENT_ACTION_TYPES, addableActions, dialogDomId, dialogOpenerAttributes, dialogOpenersSelector, groupedElementActions, itemActionOf, nodeIdOfDialogDomId, openedDialogId, opensAtClickedItem, resolveActionAvailability };
|
|
179
184
|
export type { ActionAvailability, ActionAvailabilityContext, ActionAvailabilityState, ActionDescriptor, ActionGroup, ActionKind, ActionParamSpec, ActionTargetSpec, BuilderBehaviour, OpenerActionLike, OpenerInteractionLike, OpenerNodeLike };
|
|
@@ -34,6 +34,9 @@ interface CompositeNode extends ElementStyleTarget {
|
|
|
34
34
|
* (the builder's `createConfig`, generation-core's `createSerializedNode`), with these props and this
|
|
35
35
|
* element style. `key` is stable per recipe node — a consumer that needs deterministic ids builds them
|
|
36
36
|
* from it (generation-core: `<root id>-<key>`). */
|
|
37
|
+
/** `elementStyle: NO_ELEMENT_STYLE` asks for a node that wears NO element style (undefined / null = the type's default,
|
|
38
|
+
* as both node factories have always read it): a migrated slider's bare chevrons, a lightbox's slide (CC3). */
|
|
39
|
+
declare const NO_ELEMENT_STYLE = "";
|
|
37
40
|
interface CompositeNodeSpec {
|
|
38
41
|
key: string;
|
|
39
42
|
type: string;
|
|
@@ -101,7 +104,7 @@ declare enum DisclosureRole {
|
|
|
101
104
|
Icon = "disclosure.icon",
|
|
102
105
|
Panel = "disclosure.panel"
|
|
103
106
|
}
|
|
104
|
-
interface RoleLike$
|
|
107
|
+
interface RoleLike$2 {
|
|
105
108
|
role?: string | null;
|
|
106
109
|
}
|
|
107
110
|
/** The roles each kind plays in the shared runtime. */
|
|
@@ -116,22 +119,22 @@ declare const COMPOSITE_KIND_ROLES: Readonly<Record<CompositeKind, CompositeKind
|
|
|
116
119
|
/** The kind a role belongs to (`disclosure.panel` → Disclosure), or null for any other role. */
|
|
117
120
|
declare function compositeKindOfRole(role: string | null | undefined): CompositeKind | null;
|
|
118
121
|
/** A root that runs the open/close runtime (an Accordion or a Disclosure). */
|
|
119
|
-
declare function isCompositeRoot(node: RoleLike$
|
|
122
|
+
declare function isCompositeRoot(node: RoleLike$2 | null | undefined): boolean;
|
|
120
123
|
/** An ITEM — an accordion's item, or a disclosure (its own item). */
|
|
121
|
-
declare function isCompositeItem(node: RoleLike$
|
|
124
|
+
declare function isCompositeItem(node: RoleLike$2 | null | undefined): boolean;
|
|
122
125
|
/** A trigger — rendered as a `<button>` that opens its item, never a link. */
|
|
123
|
-
declare function isCompositeTrigger(node: RoleLike$
|
|
126
|
+
declare function isCompositeTrigger(node: RoleLike$2 | null | undefined): boolean;
|
|
124
127
|
/** A panel — rendered inside the track + region the one hiding rule collapses. */
|
|
125
|
-
declare function isCompositePanel(node: RoleLike$
|
|
126
|
-
declare function isDisclosureRoot(node: RoleLike$
|
|
128
|
+
declare function isCompositePanel(node: RoleLike$2 | null | undefined): boolean;
|
|
129
|
+
declare function isDisclosureRoot(node: RoleLike$2 | null | undefined): boolean;
|
|
127
130
|
/** True for any part of a disclosure (its root included). */
|
|
128
|
-
declare function isDisclosurePart(node: RoleLike$
|
|
131
|
+
declare function isDisclosurePart(node: RoleLike$2 | null | undefined): boolean;
|
|
129
132
|
/** The composite root a node belongs to: the nearest ancestor (or the node itself) that is one. `path` = the
|
|
130
133
|
* node's ancestors, root first. */
|
|
131
|
-
declare function compositeRootOf<T extends RoleLike$
|
|
134
|
+
declare function compositeRootOf<T extends RoleLike$2>(node: T, path: ReadonlyArray<T>): T | null;
|
|
132
135
|
/** The item a node sits in — the nearest item of either kind (itself when it is one) — or null. An accordion
|
|
133
136
|
* root ends the walk (its items are below it). */
|
|
134
|
-
declare function compositeItemOf<T extends RoleLike$
|
|
137
|
+
declare function compositeItemOf<T extends RoleLike$2>(node: T, path: ReadonlyArray<T>): T | null;
|
|
135
138
|
|
|
136
139
|
/**
|
|
137
140
|
* ACCORDION (CC2 — composite K1; complex-components boards 3, 4 and 9, APPROVED 2026-10-20). Not a
|
|
@@ -740,7 +743,11 @@ declare function setCardLinked(card: CompositeNode, on: boolean): boolean;
|
|
|
740
743
|
interface CompositeRoleSpec {
|
|
741
744
|
/** The role of the part's parent; null for a composite root. */
|
|
742
745
|
readonly parent: string | null;
|
|
746
|
+
/** The TYPE of the part's parent, for a part whose parent carries no role (a Slider's controls). */
|
|
747
|
+
readonly parentType?: string;
|
|
743
748
|
readonly locked?: boolean;
|
|
749
|
+
/** May be deleted, but never moved out of its parent (a Slider's controls work only as its direct children). */
|
|
750
|
+
readonly pinned?: boolean;
|
|
744
751
|
readonly part?: CardPart;
|
|
745
752
|
}
|
|
746
753
|
declare const COMPOSITE_ROLE_SPECS: Readonly<Record<string, CompositeRoleSpec>>;
|
|
@@ -755,17 +762,290 @@ declare enum StructureRefusal {
|
|
|
755
762
|
/** A locked part can only live directly inside its own parent role. */
|
|
756
763
|
LockedPlacement = "locked-placement"
|
|
757
764
|
}
|
|
758
|
-
interface RoleLike {
|
|
765
|
+
interface RoleLike$1 {
|
|
759
766
|
role?: string | null;
|
|
767
|
+
type?: string;
|
|
760
768
|
}
|
|
761
769
|
/**
|
|
762
770
|
* Why the structure guard refuses `edit` on `node`, or null when it is allowed. `ancestors` (Move only) =
|
|
763
771
|
* the new parent chain, root first, the direct parent last.
|
|
764
772
|
*/
|
|
765
|
-
declare function structureRefusal(node: RoleLike | null | undefined, edit: StructureEdit, ancestors?: ReadonlyArray<RoleLike>): StructureRefusal | null;
|
|
773
|
+
declare function structureRefusal(node: RoleLike$1 | null | undefined, edit: StructureEdit, ancestors?: ReadonlyArray<RoleLike$1>): StructureRefusal | null;
|
|
766
774
|
/** True when `node` is a locked part (shown with a lock and no delete in the layer tree). Deleting a whole
|
|
767
775
|
* composite is always allowed — only its locked parts are refused. */
|
|
768
|
-
declare function isLockedPart(node: RoleLike | null | undefined): boolean;
|
|
776
|
+
declare function isLockedPart(node: RoleLike$1 | null | undefined): boolean;
|
|
777
|
+
|
|
778
|
+
/**
|
|
779
|
+
* THE ACCESSIBLE CAROUSEL (CC3 — complex-components plan §7c, board 6; board 9 Q13). The Slider's controls are no
|
|
780
|
+
* longer drawn by Swiper: Previous, Next, Pause and Pagination are REAL nodes with roles — selectable on the canvas,
|
|
781
|
+
* in the layer tree and the breadcrumb, and styled on their own (R2) — handed to Swiper as its navigation and
|
|
782
|
+
* pagination elements.
|
|
783
|
+
*
|
|
784
|
+
* SliderContainer (.swiper)
|
|
785
|
+
* ├─ ButtonBlock `button-secondary` role slider.pause FIRST focus stop; present while Autoplay is on, locked
|
|
786
|
+
* ├─ ButtonBlock `button-secondary` role slider.prev › Icon caret (points the reading way in RTL)
|
|
787
|
+
* ├─ ButtonBlock `button-secondary` role slider.next › Icon caret
|
|
788
|
+
* ├─ (the slides — `.swiper-wrapper` › SliderSlide …)
|
|
789
|
+
* └─ Container role slider.pagination Swiper draws the dots (or "3 / 6") inside it
|
|
790
|
+
*
|
|
791
|
+
* The parts render INSIDE the `.swiper` element, never inside `.swiper-wrapper` (slider.md: a `.swiper-slide` must be
|
|
792
|
+
* the wrapper's direct child): the parts that come before the first slide in the tree render before the wrapper, the
|
|
793
|
+
* rest after it. By default they sit over the slides like Swiper's own controls (the shared CSS, iox-design.css, at
|
|
794
|
+
* zero specificity — a part's own styles win), so a saved slider migrated from Swiper-drawn controls keeps its look.
|
|
795
|
+
*
|
|
796
|
+
* The Bindings switches stay the source of truth: Navigation arrows ⇔ Previous + Next, Pagination ⇔ Pagination,
|
|
797
|
+
* Autoplay ⇔ Pause (WCAG 2.2.2 — "added while Autoplay is on, cannot be removed"). `syncSliderParts` is the one edit.
|
|
798
|
+
*/
|
|
799
|
+
declare enum SliderRole {
|
|
800
|
+
Pause = "slider.pause",
|
|
801
|
+
Prev = "slider.prev",
|
|
802
|
+
Next = "slider.next",
|
|
803
|
+
Pagination = "slider.pagination"
|
|
804
|
+
}
|
|
805
|
+
/** Parts in the order they are stamped: the pause control first (APG: the first focus stop), the dots last. */
|
|
806
|
+
declare const SLIDER_PART_ROLES: ReadonlyArray<SliderRole>;
|
|
807
|
+
declare const SLIDER_TYPE = "SliderContainer";
|
|
808
|
+
declare const SLIDE_TYPE = "SliderSlide";
|
|
809
|
+
/** The Bindings switches that own the parts. */
|
|
810
|
+
declare enum SliderFlag {
|
|
811
|
+
Navigation = "enableNavigation",
|
|
812
|
+
Pagination = "enablePagination",
|
|
813
|
+
Autoplay = "enableAutoplay"
|
|
814
|
+
}
|
|
815
|
+
/** The trait that names the carousel (Slider ▸ Accessibility ▸ Carousel name) — the A11y trait every named part uses. */
|
|
816
|
+
declare const SLIDER_NAME_TRAIT = "ariaLabel";
|
|
817
|
+
interface RoleLike {
|
|
818
|
+
role?: string | null;
|
|
819
|
+
type?: string;
|
|
820
|
+
}
|
|
821
|
+
declare function isSliderPart(node: RoleLike | null | undefined): boolean;
|
|
822
|
+
declare function isSlider(node: RoleLike | null | undefined): boolean;
|
|
823
|
+
/** The slider's own part playing `role` (a direct child), or undefined. */
|
|
824
|
+
declare function sliderPart<T extends RoleLike>(slider: {
|
|
825
|
+
children?: T[] | null;
|
|
826
|
+
}, role: SliderRole): T | undefined;
|
|
827
|
+
/** True when the slider's controls are parts (it was created or migrated in CC3) — Swiper then draws none of its own. */
|
|
828
|
+
declare function hasSliderParts(slider: {
|
|
829
|
+
children?: ReadonlyArray<RoleLike> | null;
|
|
830
|
+
}): boolean;
|
|
831
|
+
/** A slider's children split as they render: parts before the first slide, the slides (into `.swiper-wrapper`), and
|
|
832
|
+
* the parts after it. */
|
|
833
|
+
declare function splitSliderChildren<T extends RoleLike>(children: ReadonlyArray<T> | null | undefined): {
|
|
834
|
+
lead: T[];
|
|
835
|
+
slides: T[];
|
|
836
|
+
trail: T[];
|
|
837
|
+
};
|
|
838
|
+
/** The slides only (the template slide of a bound slider is `sliderSlides(children)[0]`). */
|
|
839
|
+
declare function sliderSlides<T extends RoleLike>(children: ReadonlyArray<T> | null | undefined): T[];
|
|
840
|
+
/** Each part's glyph (Phosphor) and its default accessible name. */
|
|
841
|
+
declare const SLIDER_PART_GLYPH: Readonly<Record<Exclude<SliderRole, SliderRole.Pagination>, string>>;
|
|
842
|
+
declare const SLIDER_PLAY_GLYPH = "ph-fill ph-play";
|
|
843
|
+
/**
|
|
844
|
+
* What a saved slider drew through Swiper before CC3, carried into its parts by the migration so it looks the same:
|
|
845
|
+
* bare chevrons in the author's arrow colour and size, the dots in the author's colour. Swiper's own default colour
|
|
846
|
+
* is its theme blue — what the live site drew, because the engine never applied the colour traits.
|
|
847
|
+
*/
|
|
848
|
+
interface LegacySliderLook {
|
|
849
|
+
navigationColor?: string;
|
|
850
|
+
navigationSize?: number;
|
|
851
|
+
paginationColor?: string;
|
|
852
|
+
}
|
|
853
|
+
declare const SWIPER_THEME_COLOR = "#007aff";
|
|
854
|
+
/** One part, from the recipe (board 6: `button-secondary` controls, token dots) or in a migrated slider's legacy look. */
|
|
855
|
+
declare function buildSliderPart(create: CompositeNodeFactory, role: SliderRole, legacy?: LegacySliderLook): CompositeNode;
|
|
856
|
+
/** The parts the slider's switches call for, in stamping order. */
|
|
857
|
+
declare function wantedSliderParts(slider: CompositeNode): SliderRole[];
|
|
858
|
+
interface SliderPartsChange {
|
|
859
|
+
added: CompositeNode[];
|
|
860
|
+
removed: CompositeNode[];
|
|
861
|
+
}
|
|
862
|
+
/**
|
|
863
|
+
* Make the slider's parts match its switches — ONE edit (a palette switch, the migration, the composer). Missing
|
|
864
|
+
* parts are stamped from the recipe (or, `legacy`, in the migrated look) at their place: the pause control, Previous
|
|
865
|
+
* and Next before the first slide, the pagination after the last; parts whose switch is off are removed. Everything
|
|
866
|
+
* else (the slides, the author's edits to an existing part) is kept.
|
|
867
|
+
*/
|
|
868
|
+
declare function syncSliderParts(slider: CompositeNode, create: CompositeNodeFactory, legacy?: LegacySliderLook): SliderPartsChange;
|
|
869
|
+
/** True when a saved slider still relies on Swiper-drawn controls: a switch is on and no part exists yet. */
|
|
870
|
+
declare function needsSliderMigration(slider: CompositeNode | null | undefined): boolean;
|
|
871
|
+
/**
|
|
872
|
+
* The migration of a saved slider (board 9 Q13): its Swiper-drawn arrows, dots — and, when Autoplay is on, the pause
|
|
873
|
+
* control WCAG 2.2.2 requires — become parts, in the place and the colours Swiper drew them. Idempotent: a slider
|
|
874
|
+
* that already has parts is left alone. True when it changed.
|
|
875
|
+
*/
|
|
876
|
+
declare function migrateSliderControls(slider: CompositeNode, create: CompositeNodeFactory): boolean;
|
|
877
|
+
/**
|
|
878
|
+
* A switch flipped in the panel: on a slider still on Swiper-drawn controls, migrate it first (so its other controls
|
|
879
|
+
* keep their look), then stamp / remove the parts the new switch calls for. ONE edit.
|
|
880
|
+
*/
|
|
881
|
+
declare function setSliderFlag(slider: CompositeNode, flag: SliderFlag, on: boolean, create: CompositeNodeFactory): SliderPartsChange;
|
|
882
|
+
interface SliderWords {
|
|
883
|
+
stop: string;
|
|
884
|
+
start: string;
|
|
885
|
+
prev: string;
|
|
886
|
+
next: string;
|
|
887
|
+
carousel: string;
|
|
888
|
+
slide: string;
|
|
889
|
+
/** `{{index}}` and `{{slidesLength}}`, Swiper's placeholders. */
|
|
890
|
+
slideLabel: string;
|
|
891
|
+
goTo: string;
|
|
892
|
+
}
|
|
893
|
+
declare const SLIDER_WORDS: Readonly<Record<'en' | 'he', SliderWords>>;
|
|
894
|
+
declare function sliderWords(lang?: string | null): SliderWords;
|
|
895
|
+
/** The wrapper's live region (APG): silent while the slides move on their own, polite otherwise. */
|
|
896
|
+
declare function sliderLiveRegion(rotating: boolean): 'off' | 'polite';
|
|
897
|
+
/**
|
|
898
|
+
* The pause control's state (APG carousel): its NAME says what it will do ("Stop automatic slide show" while it
|
|
899
|
+
* rotates, "Start automatic slide show" when stopped). An author who named the control keeps the name, and the
|
|
900
|
+
* state is `aria-pressed` instead (pressed = stopped).
|
|
901
|
+
*/
|
|
902
|
+
declare function sliderPauseAttributes(rotating: boolean, words?: SliderWords, authorName?: string | null): Record<string, string>;
|
|
903
|
+
/** The pause control's glyph: pause while it rotates, play when stopped. */
|
|
904
|
+
declare function sliderPauseGlyph(rotating: boolean): string;
|
|
905
|
+
interface CarouselQuote {
|
|
906
|
+
quote: string;
|
|
907
|
+
who: string;
|
|
908
|
+
}
|
|
909
|
+
/** Board 6's sample quotes — PLACEHOLDERS: testimonials are facts the studio gives, never invented. */
|
|
910
|
+
declare const CAROUSEL_QUOTES: ReadonlyArray<CarouselQuote>;
|
|
911
|
+
interface CarouselOptions {
|
|
912
|
+
/** The carousel's accessible name (a `region` landmark). */
|
|
913
|
+
name?: string;
|
|
914
|
+
quotes?: ReadonlyArray<CarouselQuote>;
|
|
915
|
+
}
|
|
916
|
+
/**
|
|
917
|
+
* The testimonial carousel (board 6): a named Slider, one quote per slide (each a `card`), rotating every 5s with its
|
|
918
|
+
* control parts — the pause control first, Previous · Next, the dots. ONE recipe for the composer and the builder.
|
|
919
|
+
*/
|
|
920
|
+
declare function buildCarouselRecipe(create: CompositeNodeFactory, options?: CarouselOptions): CompositeNode;
|
|
921
|
+
/** The slide a lightbox opens at for the clicked row (clamped to the slides there are). */
|
|
922
|
+
declare function slideIndexForRow(rowIndex: number, slideCount: number): number;
|
|
923
|
+
|
|
924
|
+
/**
|
|
925
|
+
* The accessible carousel's RUNTIME (CC3, board 6; closes vectoriox/iox-ui#13) — DOM only, over a running Swiper,
|
|
926
|
+
* ONE copy for the engine (both paths) and the admin's Preview. Swiper's A11y module gives the container
|
|
927
|
+
* `aria-roledescription="carousel"`, every slide `role=group` + "slide" + "n of m"; this adds what the APG
|
|
928
|
+
* carousel needs on top:
|
|
929
|
+
* - the PAUSE control (role `slider.pause`, rendered first): it stops rotation for good and starts it again; its
|
|
930
|
+
* name says what it will do, its glyph swaps;
|
|
931
|
+
* - rotation PAUSES while focus is anywhere inside (hover is Swiper's `pauseOnMouseEnter`) and resumes when it
|
|
932
|
+
* leaves — unless the visitor pressed pause;
|
|
933
|
+
* - the wrapper's live region is `off` while the slides move on their own and `polite` otherwise;
|
|
934
|
+
* - slides that are not in view are `inert` (and hidden from assistive technology), so Tab never lands in one.
|
|
935
|
+
* The builder's EDIT canvas never attaches it (no autoplay there, and a slide must stay clickable).
|
|
936
|
+
*/
|
|
937
|
+
/** The parts of the Swiper instance this runtime reads — a real Swiper, or a stub in a spec. */
|
|
938
|
+
interface CarouselSwiper {
|
|
939
|
+
el: HTMLElement;
|
|
940
|
+
wrapperEl: HTMLElement;
|
|
941
|
+
slides: HTMLElement[];
|
|
942
|
+
activeIndex: number;
|
|
943
|
+
destroyed?: boolean;
|
|
944
|
+
params?: {
|
|
945
|
+
slidesPerView?: number | 'auto';
|
|
946
|
+
autoplay?: {
|
|
947
|
+
pauseOnMouseEnter?: boolean;
|
|
948
|
+
} | boolean;
|
|
949
|
+
};
|
|
950
|
+
autoplay?: {
|
|
951
|
+
running: boolean;
|
|
952
|
+
paused?: boolean;
|
|
953
|
+
start(): void;
|
|
954
|
+
stop(): void;
|
|
955
|
+
pause(): void;
|
|
956
|
+
resume(): void;
|
|
957
|
+
};
|
|
958
|
+
on(event: string, handler: (...args: unknown[]) => void): void;
|
|
959
|
+
off(event: string, handler: (...args: unknown[]) => void): void;
|
|
960
|
+
}
|
|
961
|
+
interface CarouselA11yOptions {
|
|
962
|
+
words?: SliderWords;
|
|
963
|
+
}
|
|
964
|
+
/** The part of `role` that belongs to THIS slider (never one of a slider nested in a slide). */
|
|
965
|
+
declare function sliderPartElement(sliderEl: Element, role: SliderRole): HTMLElement | null;
|
|
966
|
+
declare class CarouselA11y {
|
|
967
|
+
private readonly swiper;
|
|
968
|
+
/** The visitor pressed pause: rotation stays stopped until they press it again. */
|
|
969
|
+
private stoppedByVisitor;
|
|
970
|
+
private focusInside;
|
|
971
|
+
/** The pointer is over the carousel and Swiper holds rotation for it (`pauseOnMouseEnter`). */
|
|
972
|
+
private hovering;
|
|
973
|
+
private readonly cleanups;
|
|
974
|
+
private readonly words;
|
|
975
|
+
private readonly pause;
|
|
976
|
+
private readonly authorName;
|
|
977
|
+
constructor(swiper: CarouselSwiper, options?: CarouselA11yOptions);
|
|
978
|
+
/** True while the slides move on their own: autoplay runs and nothing holds it — not focus inside, not the
|
|
979
|
+
* pointer over it. (Swiper's own `paused` also flips during every transition, so it is not read here.) */
|
|
980
|
+
get rotating(): boolean;
|
|
981
|
+
private get hoverPauses();
|
|
982
|
+
/** The pause control: stop rotation for good, or start it again. */
|
|
983
|
+
togglePause(): void;
|
|
984
|
+
destroy(): void;
|
|
985
|
+
private listen;
|
|
986
|
+
private onFocusIn;
|
|
987
|
+
private onFocusOut;
|
|
988
|
+
/** Re-state the carousel: the live region, the pause control, the slides out of view. */
|
|
989
|
+
sync(): void;
|
|
990
|
+
private syncHiddenSlides;
|
|
991
|
+
}
|
|
992
|
+
/** The carousel runtime attached to a slider element, if any. */
|
|
993
|
+
declare function carouselOf(el: Element | null | undefined): CarouselA11y | null;
|
|
994
|
+
/** Attach once per Swiper (a re-init gets a fresh runtime). */
|
|
995
|
+
declare function attachCarouselA11y(swiper: CarouselSwiper, options?: CarouselA11yOptions): CarouselA11y;
|
|
996
|
+
|
|
997
|
+
/**
|
|
998
|
+
* THE LIGHTBOX (CC3 — complex-components plan §7d, board 6). Not a component: a Dialog holding a Slider bound to the
|
|
999
|
+
* SAME source as the grid of thumbnails. The one new thing is `openDialog`'s "Open at the clicked item"
|
|
1000
|
+
* (`slideTo: 'row'`): a thumbnail in a repeater row opens the lightbox at ITS slide.
|
|
1001
|
+
*
|
|
1002
|
+
* Dialog `dialog` · centre · full viewport · Inverse scheme "Lightbox" (a free-standing Dialog: board A4)
|
|
1003
|
+
* ├─ ButtonBlock `button-ghost` "Close" › Icon × click → closeDialog
|
|
1004
|
+
* └─ SliderContainer one slide in view · keyboard · the source's rows
|
|
1005
|
+
* ├─ Previous · Next (slider.prev / slider.next, button-secondary) hidden on a phone (swipe)
|
|
1006
|
+
* ├─ SliderSlide › Image `media` (contain, keeps its alt) + Text `small` caption
|
|
1007
|
+
* └─ Pagination (slider.pagination) — the counter "3 / 6"
|
|
1008
|
+
*
|
|
1009
|
+
* Keyboard ← → are the Slider's Keyboard module; Esc and the focus trap are the `<dialog>`'s; focus returns to the
|
|
1010
|
+
* thumbnail that opened it (the dialog opener's own rule).
|
|
1011
|
+
*/
|
|
1012
|
+
declare const SLIDE_TO_ROW = "row";
|
|
1013
|
+
/** The attribute a renderer writes on every repeated row (the context-state provenance, both engine paths, the canvas). */
|
|
1014
|
+
declare const ROW_INDEX_ATTRIBUTE = "data-iox-row-idx";
|
|
1015
|
+
declare const LIGHTBOX_LABEL = "Lightbox";
|
|
1016
|
+
interface LightboxOptions {
|
|
1017
|
+
/** The list the slides come from (the grid's own source). Empty = three manual slides. */
|
|
1018
|
+
source?: string;
|
|
1019
|
+
sourcePath?: string;
|
|
1020
|
+
/** The row field each slide's image and caption read (`item` = the row itself, a bare URL). */
|
|
1021
|
+
imageField?: string;
|
|
1022
|
+
captionField?: string;
|
|
1023
|
+
/** The image's alt binding; '' = decorative (a bare URL row has no words of its own). */
|
|
1024
|
+
altField?: string;
|
|
1025
|
+
}
|
|
1026
|
+
/** On a phone the arrows give way to a swipe (board 6, "the arrows hide on touch-only widths"). */
|
|
1027
|
+
declare const LIGHTBOX_ARROWS_HIDE_AT = "mobile";
|
|
1028
|
+
/** A fresh lightbox: the Dialog, its Close part and the Slider (bound to `source`, or three manual slides). */
|
|
1029
|
+
declare function buildLightboxRecipe(create: CompositeNodeFactory, options?: LightboxOptions): CompositeNode;
|
|
1030
|
+
interface RepeatSource {
|
|
1031
|
+
source: string;
|
|
1032
|
+
path: string;
|
|
1033
|
+
}
|
|
1034
|
+
/** What a Repeater (its `source` binding) or a bound Slider (its `source` / `sourcePath` traits) repeats over. */
|
|
1035
|
+
declare function repeatSourceOf(node: CompositeNode | null | undefined): RepeatSource | null;
|
|
1036
|
+
declare function sameRepeatSource(a: RepeatSource | null, b: RepeatSource | null): boolean;
|
|
1037
|
+
/** The Slider a lightbox Dialog holds (the first one, depth first), or null. */
|
|
1038
|
+
declare function lightboxSliderOf(dialog: CompositeNode | null | undefined): CompositeNode | null;
|
|
1039
|
+
/** The repeated rows the element is in: the nearest Repeater or bound Slider among its ancestors (`path` = root → the
|
|
1040
|
+
* element, inclusive). */
|
|
1041
|
+
declare function rowSourceOf(path: ReadonlyArray<CompositeNode>): RepeatSource | null;
|
|
1042
|
+
/**
|
|
1043
|
+
* Interactions ▸ openDialog ▸ "Open at the clicked item" is offered only when it can work (board 9): the clicked
|
|
1044
|
+
* element sits in a repeater row AND the target Dialog holds a Slider bound to the same source.
|
|
1045
|
+
*/
|
|
1046
|
+
declare function canOpenAtClickedItem(ownerPath: ReadonlyArray<CompositeNode>, dialog: CompositeNode | null | undefined): boolean;
|
|
1047
|
+
/** The repeated row an element sits in (its row index), 0 when it is in none (the canvas' template row). */
|
|
1048
|
+
declare function rowIndexOf(el: Element | null | undefined): number;
|
|
769
1049
|
|
|
770
|
-
export { ACCORDION_BIND_PROP, ACCORDION_CONTENT_LIMIT, ACCORDION_DEFAULT_ONS, ACCORDION_ICONS, ACCORDION_ICON_GLYPH, ACCORDION_NEW_ITEM_WORDS, ACCORDION_WORDS, AccordionClass, AccordionDefaultOn, AccordionEditRefusal, AccordionIcon, AccordionKeyAction, AccordionRole, AccordionRuntime, BADGE_TONES, BADGE_TONE_ICONS, BadgeTone, CARD_LAYOUTS, CARD_LAYOUT_CUSTOM, CARD_PARTS, CARD_PART_ROLE, CARD_STACK_BREAKPOINT, CARD_WORDS, CHIP_ICON, CHIP_STYLE, COMPOSITE_ATTRIBUTE, COMPOSITE_KIND_ROLES, COMPOSITE_ROLE_SPECS, CardLayout, CardPart, CardRole, CompositeBehaviourTrait, CompositeItemAction, CompositeKind, DEFAULT_ON_ATTRIBUTE, DISCLOSURE_ITEM_KEY, DISCLOSURE_WORDS, DisclosureRole, ITEM_KEY_ATTRIBUTE, ITEM_OFF_EVENT, ITEM_ON_EVENT, ITEM_OPEN_STATE, MULTIPLE_ATTRIBUTE, ON_ATTRIBUTE, ON_STATE, PILL_LABEL_STYLE, SCOPE_ATTRIBUTE, StructureEdit, StructureRefusal, UNTIL_FOUND, accordionAnswerOf, accordionBehaviour, accordionDomIds, accordionFocusIndex, accordionHeadingLevel, accordionItemAttributes, accordionItemLabel, accordionItemOf, accordionItemState, accordionItems, accordionKeyAction, accordionPanelAttributes, accordionPanelOf, accordionPartStyle, accordionQuestionOf, accordionRegionAttributes, accordionRemovalRefusal, accordionRootAttributes, accordionRootOf, accordionRuntimeOf, accordionScope, accordionToContent, accordionToManual, accordionTrackAttributes, accordionTriggerAttributes, accordionTriggerOf, addAccordionItem, applyCardLayout, attachAccordionAt, attachAccordions, badgeStyleId, badgeToneOf, buildAccordionItem, buildAccordionRecipe, buildBadge, buildCardRecipe, buildChip, buildCompositeIcon, buildDisclosureRecipe, cardPartsOf, cardRootOf, cardTitleOf, clearLayerStyles, closeAccordionItem, closestAccordion, closestAccordionItem, compositeItemOf, compositeItems, compositeKindOfRole, compositeRootOf, compositeRowKeys, compositeScopeId, detachAccordion, detectAccordionIcon, detectCardLayout, disclosureOpenByDefault, domSafeKey, findByRole, hasLabelledRegion, initialAccordionOpen, isAccordionFromContent, isAccordionItemOn, isAccordionPart, isAccordionRoot, isCardLinked, isCardRoot, isCompositeItem, isCompositePanel, isCompositeRoot, isCompositeTrigger, isDisclosurePart, isDisclosureRoot, isLockedPart, isPillNode, itemOpenTriggerIds, makeCompositePart, moveAccordionItem, nextAccordionState, nextItemKey, onAccordionItemState, openAccordionItem, parentInComposite, pickAccordionAutoBinds, readLayerStyle, readProp, readStyle, removeFromComposite, renameAccordionItem, rowItemKey, runCompositeItemAction, serializeDomAttributes, setAccordionBehaviour, setAccordionIcon, setBadgeTone, setCardLinked, setCardPart, shouldScrollToItem, structureRefusal, walkComposite, writeLayerStyles, writeProp, writeStyles };
|
|
771
|
-
export type { AccordionAutoBinds, AccordionBehaviour, AccordionDomIds, AccordionItemState, AccordionOptions, AccordionRuntimeOptions, AccordionScope, AccordionWords, BaselineStyles, CardEditOptions, CardLayoutResult, CardLayoutState, CardOptions, CardPartChange, CardWords, CompositeBinding, CompositeKindRoles, CompositeLayer, CompositeNode, CompositeNodeFactory, CompositeNodeSpec, CompositeRoleSpec, CompositeTrait, ContentFieldLike, DisclosureOptions, DisclosureWords, DomAttributes, PillOptions };
|
|
1050
|
+
export { ACCORDION_BIND_PROP, ACCORDION_CONTENT_LIMIT, ACCORDION_DEFAULT_ONS, ACCORDION_ICONS, ACCORDION_ICON_GLYPH, ACCORDION_NEW_ITEM_WORDS, ACCORDION_WORDS, AccordionClass, AccordionDefaultOn, AccordionEditRefusal, AccordionIcon, AccordionKeyAction, AccordionRole, AccordionRuntime, BADGE_TONES, BADGE_TONE_ICONS, BadgeTone, CARD_LAYOUTS, CARD_LAYOUT_CUSTOM, CARD_PARTS, CARD_PART_ROLE, CARD_STACK_BREAKPOINT, CARD_WORDS, CAROUSEL_QUOTES, CHIP_ICON, CHIP_STYLE, COMPOSITE_ATTRIBUTE, COMPOSITE_KIND_ROLES, COMPOSITE_ROLE_SPECS, CardLayout, CardPart, CardRole, CarouselA11y, CompositeBehaviourTrait, CompositeItemAction, CompositeKind, DEFAULT_ON_ATTRIBUTE, DISCLOSURE_ITEM_KEY, DISCLOSURE_WORDS, DisclosureRole, ITEM_KEY_ATTRIBUTE, ITEM_OFF_EVENT, ITEM_ON_EVENT, ITEM_OPEN_STATE, LIGHTBOX_ARROWS_HIDE_AT, LIGHTBOX_LABEL, MULTIPLE_ATTRIBUTE, NO_ELEMENT_STYLE, ON_ATTRIBUTE, ON_STATE, PILL_LABEL_STYLE, ROW_INDEX_ATTRIBUTE, SCOPE_ATTRIBUTE, SLIDER_NAME_TRAIT, SLIDER_PART_GLYPH, SLIDER_PART_ROLES, SLIDER_PLAY_GLYPH, SLIDER_TYPE, SLIDER_WORDS, SLIDE_TO_ROW, SLIDE_TYPE, SWIPER_THEME_COLOR, SliderFlag, SliderRole, StructureEdit, StructureRefusal, UNTIL_FOUND, accordionAnswerOf, accordionBehaviour, accordionDomIds, accordionFocusIndex, accordionHeadingLevel, accordionItemAttributes, accordionItemLabel, accordionItemOf, accordionItemState, accordionItems, accordionKeyAction, accordionPanelAttributes, accordionPanelOf, accordionPartStyle, accordionQuestionOf, accordionRegionAttributes, accordionRemovalRefusal, accordionRootAttributes, accordionRootOf, accordionRuntimeOf, accordionScope, accordionToContent, accordionToManual, accordionTrackAttributes, accordionTriggerAttributes, accordionTriggerOf, addAccordionItem, applyCardLayout, attachAccordionAt, attachAccordions, attachCarouselA11y, badgeStyleId, badgeToneOf, buildAccordionItem, buildAccordionRecipe, buildBadge, buildCardRecipe, buildCarouselRecipe, buildChip, buildCompositeIcon, buildDisclosureRecipe, buildLightboxRecipe, buildSliderPart, canOpenAtClickedItem, cardPartsOf, cardRootOf, cardTitleOf, carouselOf, clearLayerStyles, closeAccordionItem, closestAccordion, closestAccordionItem, compositeItemOf, compositeItems, compositeKindOfRole, compositeRootOf, compositeRowKeys, compositeScopeId, detachAccordion, detectAccordionIcon, detectCardLayout, disclosureOpenByDefault, domSafeKey, findByRole, hasLabelledRegion, hasSliderParts, initialAccordionOpen, isAccordionFromContent, isAccordionItemOn, isAccordionPart, isAccordionRoot, isCardLinked, isCardRoot, isCompositeItem, isCompositePanel, isCompositeRoot, isCompositeTrigger, isDisclosurePart, isDisclosureRoot, isLockedPart, isPillNode, isSlider, isSliderPart, itemOpenTriggerIds, lightboxSliderOf, makeCompositePart, migrateSliderControls, moveAccordionItem, needsSliderMigration, nextAccordionState, nextItemKey, onAccordionItemState, openAccordionItem, parentInComposite, pickAccordionAutoBinds, readLayerStyle, readProp, readStyle, removeFromComposite, renameAccordionItem, repeatSourceOf, rowIndexOf, rowItemKey, rowSourceOf, runCompositeItemAction, sameRepeatSource, serializeDomAttributes, setAccordionBehaviour, setAccordionIcon, setBadgeTone, setCardLinked, setCardPart, setSliderFlag, shouldScrollToItem, slideIndexForRow, sliderLiveRegion, sliderPart, sliderPartElement, sliderPauseAttributes, sliderPauseGlyph, sliderSlides, sliderWords, splitSliderChildren, structureRefusal, syncSliderParts, walkComposite, wantedSliderParts, writeLayerStyles, writeProp, writeStyles };
|
|
1051
|
+
export type { AccordionAutoBinds, AccordionBehaviour, AccordionDomIds, AccordionItemState, AccordionOptions, AccordionRuntimeOptions, AccordionScope, AccordionWords, BaselineStyles, CardEditOptions, CardLayoutResult, CardLayoutState, CardOptions, CardPartChange, CardWords, CarouselA11yOptions, CarouselOptions, CarouselQuote, CarouselSwiper, CompositeBinding, CompositeKindRoles, CompositeLayer, CompositeNode, CompositeNodeFactory, CompositeNodeSpec, CompositeRoleSpec, CompositeTrait, ContentFieldLike, DisclosureOptions, DisclosureWords, DomAttributes, LegacySliderLook, LightboxOptions, PillOptions, RepeatSource, SliderPartsChange, SliderWords };
|
package/design-core/index.d.ts
CHANGED
|
@@ -897,6 +897,18 @@ declare const SPEC_TIERS: {
|
|
|
897
897
|
readonly name: "media-scrim-ink";
|
|
898
898
|
readonly type: "color";
|
|
899
899
|
readonly default: "#FFFFFF";
|
|
900
|
+
}, {
|
|
901
|
+
readonly name: "video-play-bg";
|
|
902
|
+
readonly type: "color";
|
|
903
|
+
readonly default: "var(--iox-button-primary-bg)";
|
|
904
|
+
}, {
|
|
905
|
+
readonly name: "video-play-ink";
|
|
906
|
+
readonly type: "color";
|
|
907
|
+
readonly default: "var(--iox-button-primary-ink)";
|
|
908
|
+
}, {
|
|
909
|
+
readonly name: "video-play-size";
|
|
910
|
+
readonly type: "size";
|
|
911
|
+
readonly default: "64px";
|
|
900
912
|
}];
|
|
901
913
|
};
|
|
902
914
|
declare const SPEC_TOKEN_TYPES: readonly ["color", "paint", "font", "number", "size", "spacing", "radius", "shadow", "effect", "duration", "easing", "keyword", "other"];
|
|
@@ -1485,7 +1497,7 @@ declare const SPEC_ELEMENT_STYLES: readonly [{
|
|
|
1485
1497
|
readonly id: "card";
|
|
1486
1498
|
readonly label: "Card";
|
|
1487
1499
|
readonly group: "Layout";
|
|
1488
|
-
readonly appliesTo: readonly ["Container", "LinkedContainer", "Card"];
|
|
1500
|
+
readonly appliesTo: readonly ["Container", "LinkedContainer", "Card", "SliderSlide"];
|
|
1489
1501
|
readonly base: {
|
|
1490
1502
|
readonly color: "inherit";
|
|
1491
1503
|
readonly backgroundColor: "var(--iox-card-bg)";
|
|
@@ -1612,7 +1624,7 @@ declare const SPEC_ELEMENT_STYLES: readonly [{
|
|
|
1612
1624
|
readonly id: "media";
|
|
1613
1625
|
readonly label: "Image";
|
|
1614
1626
|
readonly group: "Media";
|
|
1615
|
-
readonly appliesTo: readonly ["Image", "SliderSlide", "Gallery"];
|
|
1627
|
+
readonly appliesTo: readonly ["Image", "SliderSlide", "Gallery", "Video"];
|
|
1616
1628
|
readonly base: {
|
|
1617
1629
|
readonly borderRadius: "var(--iox-image-radius)";
|
|
1618
1630
|
readonly objectFit: "cover";
|
|
@@ -1813,6 +1825,7 @@ declare const SPEC_DEFAULT_ELEMENT_STYLE: {
|
|
|
1813
1825
|
readonly Link: "link";
|
|
1814
1826
|
readonly Image: "media";
|
|
1815
1827
|
readonly SliderSlide: "media";
|
|
1828
|
+
readonly Video: "media";
|
|
1816
1829
|
readonly Divider: "rule";
|
|
1817
1830
|
readonly Icon: "icon";
|
|
1818
1831
|
readonly Dialog: "dialog";
|
|
@@ -3600,6 +3613,24 @@ declare const SPEC_FLAVOR_PACKS: readonly [{
|
|
|
3600
3613
|
readonly type: "color";
|
|
3601
3614
|
readonly group: "components";
|
|
3602
3615
|
readonly value: "#FFFFFF";
|
|
3616
|
+
}, {
|
|
3617
|
+
readonly name: "video-play-bg";
|
|
3618
|
+
readonly tier: "component";
|
|
3619
|
+
readonly type: "color";
|
|
3620
|
+
readonly group: "components";
|
|
3621
|
+
readonly value: "var(--iox-button-primary-bg)";
|
|
3622
|
+
}, {
|
|
3623
|
+
readonly name: "video-play-ink";
|
|
3624
|
+
readonly tier: "component";
|
|
3625
|
+
readonly type: "color";
|
|
3626
|
+
readonly group: "components";
|
|
3627
|
+
readonly value: "var(--iox-button-primary-ink)";
|
|
3628
|
+
}, {
|
|
3629
|
+
readonly name: "video-play-size";
|
|
3630
|
+
readonly tier: "component";
|
|
3631
|
+
readonly type: "size";
|
|
3632
|
+
readonly group: "components";
|
|
3633
|
+
readonly value: "64px";
|
|
3603
3634
|
}];
|
|
3604
3635
|
}, {
|
|
3605
3636
|
readonly id: "linen";
|
|
@@ -4983,6 +5014,24 @@ declare const SPEC_FLAVOR_PACKS: readonly [{
|
|
|
4983
5014
|
readonly type: "color";
|
|
4984
5015
|
readonly group: "components";
|
|
4985
5016
|
readonly value: "#FFFFFF";
|
|
5017
|
+
}, {
|
|
5018
|
+
readonly name: "video-play-bg";
|
|
5019
|
+
readonly tier: "component";
|
|
5020
|
+
readonly type: "color";
|
|
5021
|
+
readonly group: "components";
|
|
5022
|
+
readonly value: "var(--iox-button-primary-bg)";
|
|
5023
|
+
}, {
|
|
5024
|
+
readonly name: "video-play-ink";
|
|
5025
|
+
readonly tier: "component";
|
|
5026
|
+
readonly type: "color";
|
|
5027
|
+
readonly group: "components";
|
|
5028
|
+
readonly value: "var(--iox-button-primary-ink)";
|
|
5029
|
+
}, {
|
|
5030
|
+
readonly name: "video-play-size";
|
|
5031
|
+
readonly tier: "component";
|
|
5032
|
+
readonly type: "size";
|
|
5033
|
+
readonly group: "components";
|
|
5034
|
+
readonly value: "64px";
|
|
4986
5035
|
}];
|
|
4987
5036
|
}, {
|
|
4988
5037
|
readonly id: "midnight";
|
|
@@ -6356,6 +6405,24 @@ declare const SPEC_FLAVOR_PACKS: readonly [{
|
|
|
6356
6405
|
readonly type: "color";
|
|
6357
6406
|
readonly group: "components";
|
|
6358
6407
|
readonly value: "#FFFFFF";
|
|
6408
|
+
}, {
|
|
6409
|
+
readonly name: "video-play-bg";
|
|
6410
|
+
readonly tier: "component";
|
|
6411
|
+
readonly type: "color";
|
|
6412
|
+
readonly group: "components";
|
|
6413
|
+
readonly value: "var(--iox-button-primary-bg)";
|
|
6414
|
+
}, {
|
|
6415
|
+
readonly name: "video-play-ink";
|
|
6416
|
+
readonly tier: "component";
|
|
6417
|
+
readonly type: "color";
|
|
6418
|
+
readonly group: "components";
|
|
6419
|
+
readonly value: "var(--iox-button-primary-ink)";
|
|
6420
|
+
}, {
|
|
6421
|
+
readonly name: "video-play-size";
|
|
6422
|
+
readonly tier: "component";
|
|
6423
|
+
readonly type: "size";
|
|
6424
|
+
readonly group: "components";
|
|
6425
|
+
readonly value: "64px";
|
|
6359
6426
|
}];
|
|
6360
6427
|
}, {
|
|
6361
6428
|
readonly id: "glass";
|
|
@@ -7772,6 +7839,24 @@ declare const SPEC_FLAVOR_PACKS: readonly [{
|
|
|
7772
7839
|
readonly type: "color";
|
|
7773
7840
|
readonly group: "components";
|
|
7774
7841
|
readonly value: "#FFFFFF";
|
|
7842
|
+
}, {
|
|
7843
|
+
readonly name: "video-play-bg";
|
|
7844
|
+
readonly tier: "component";
|
|
7845
|
+
readonly type: "color";
|
|
7846
|
+
readonly group: "components";
|
|
7847
|
+
readonly value: "var(--iox-button-primary-bg)";
|
|
7848
|
+
}, {
|
|
7849
|
+
readonly name: "video-play-ink";
|
|
7850
|
+
readonly tier: "component";
|
|
7851
|
+
readonly type: "color";
|
|
7852
|
+
readonly group: "components";
|
|
7853
|
+
readonly value: "var(--iox-button-primary-ink)";
|
|
7854
|
+
}, {
|
|
7855
|
+
readonly name: "video-play-size";
|
|
7856
|
+
readonly tier: "component";
|
|
7857
|
+
readonly type: "size";
|
|
7858
|
+
readonly group: "components";
|
|
7859
|
+
readonly value: "64px";
|
|
7775
7860
|
}];
|
|
7776
7861
|
}, {
|
|
7777
7862
|
readonly id: "bloom";
|
|
@@ -9152,6 +9237,24 @@ declare const SPEC_FLAVOR_PACKS: readonly [{
|
|
|
9152
9237
|
readonly type: "color";
|
|
9153
9238
|
readonly group: "components";
|
|
9154
9239
|
readonly value: "#FFFFFF";
|
|
9240
|
+
}, {
|
|
9241
|
+
readonly name: "video-play-bg";
|
|
9242
|
+
readonly tier: "component";
|
|
9243
|
+
readonly type: "color";
|
|
9244
|
+
readonly group: "components";
|
|
9245
|
+
readonly value: "var(--iox-button-primary-bg)";
|
|
9246
|
+
}, {
|
|
9247
|
+
readonly name: "video-play-ink";
|
|
9248
|
+
readonly tier: "component";
|
|
9249
|
+
readonly type: "color";
|
|
9250
|
+
readonly group: "components";
|
|
9251
|
+
readonly value: "var(--iox-button-primary-ink)";
|
|
9252
|
+
}, {
|
|
9253
|
+
readonly name: "video-play-size";
|
|
9254
|
+
readonly tier: "component";
|
|
9255
|
+
readonly type: "size";
|
|
9256
|
+
readonly group: "components";
|
|
9257
|
+
readonly value: "64px";
|
|
9155
9258
|
}];
|
|
9156
9259
|
}, {
|
|
9157
9260
|
readonly id: "pop";
|
|
@@ -10543,6 +10646,24 @@ declare const SPEC_FLAVOR_PACKS: readonly [{
|
|
|
10543
10646
|
readonly type: "color";
|
|
10544
10647
|
readonly group: "components";
|
|
10545
10648
|
readonly value: "#FFFFFF";
|
|
10649
|
+
}, {
|
|
10650
|
+
readonly name: "video-play-bg";
|
|
10651
|
+
readonly tier: "component";
|
|
10652
|
+
readonly type: "color";
|
|
10653
|
+
readonly group: "components";
|
|
10654
|
+
readonly value: "var(--iox-button-primary-bg)";
|
|
10655
|
+
}, {
|
|
10656
|
+
readonly name: "video-play-ink";
|
|
10657
|
+
readonly tier: "component";
|
|
10658
|
+
readonly type: "color";
|
|
10659
|
+
readonly group: "components";
|
|
10660
|
+
readonly value: "var(--iox-button-primary-ink)";
|
|
10661
|
+
}, {
|
|
10662
|
+
readonly name: "video-play-size";
|
|
10663
|
+
readonly tier: "component";
|
|
10664
|
+
readonly type: "size";
|
|
10665
|
+
readonly group: "components";
|
|
10666
|
+
readonly value: "64px";
|
|
10546
10667
|
}];
|
|
10547
10668
|
}];
|
|
10548
10669
|
declare const SPEC_CONTRAST: {
|
|
@@ -11219,6 +11340,12 @@ declare function ownedTraitStatus(target: ElementStyleTarget, id: string): Owned
|
|
|
11219
11340
|
* Then the new style is written. Traits neither style owns are never touched.
|
|
11220
11341
|
*/
|
|
11221
11342
|
declare function switchElementStyle(target: ElementStyleTarget, fromId: string | null | undefined, toId: string, baseline?: Readonly<Record<string, unknown>>): SwitchElementStyleResult;
|
|
11343
|
+
/**
|
|
11344
|
+
* Take a node OUT of its element style (a part a recipe wants unstyled — a migrated slider's bare chevrons, CC3):
|
|
11345
|
+
* every owned trait still holding the style's value goes back to `baseline` (a state trait is removed); a trait the
|
|
11346
|
+
* author changed is kept. The node then wears no style (no `iox-es` marker). Returns the kept traits.
|
|
11347
|
+
*/
|
|
11348
|
+
declare function releaseElementStyle(target: ElementStyleTarget, fromId: string | null | undefined, baseline?: Readonly<Record<string, unknown>>): OwnedTrait[];
|
|
11222
11349
|
/**
|
|
11223
11350
|
* The element-style MARKER (design-system §3b-bis, spec `elementStyleMarker`). A node that wears an
|
|
11224
11351
|
* element style renders `iox-es iox-es-<id>` in BOTH renderers, through the one node-class helper
|
|
@@ -12316,5 +12443,5 @@ interface FontFamilyRemoval {
|
|
|
12316
12443
|
*/
|
|
12317
12444
|
declare function planFontFamilyRemoval(existing: ReadonlyArray<StoredDesignTokenRow>, previous: StoredDesign, family: string): FontFamilyRemoval;
|
|
12318
12445
|
|
|
12319
|
-
export { ACCENT_TOKEN_NAMES, AdoptOutcome, AdoptSkipReason, BAR_RESERVE_BREAKPOINTS, BAR_RESERVE_CLASS, BOTTOM_BAR_STYLE, BUTTON_VARIANT_TO_STYLE, CANVAS_LINK_ATTRIBUTE, CARD_LINK_CLASS, COLOR_SCHEMES, COLOR_SCHEME_TRAIT, COLOR_SCHEME_TYPES, ColorScheme, ColourCheckId, DEFAULT_FLAVOR_ID, DESIGN_TOKEN_GROUPS, DESIGN_TOKEN_TIERS, DESIGN_TOKEN_TYPES, DesignConfigKey, ELEMENT_STYLES, ELEMENT_STYLE_MARKER_CLASS, ELEMENT_STYLE_STATES, EMPTY_IMAGE_ATTRIBUTE, EMPTY_IMAGE_SRC, ElementStyleState, FLAVOR_SPEC_VERSION, FONT_CATALOG, FONT_FAMILY_TOKENS, FONT_FILE_ACCEPT, FONT_FILE_EXTENSIONS, FONT_FILE_FORMATS, FONT_STYLES, FONT_WEIGHTS, FontUploadError, GOOGLE_FONTS_CSS_ORIGIN, GOOGLE_FONTS_FILE_ORIGIN, HELD_CONTRAST, INHERITED_TEXT, LinkType, MAX_FONT_FILE_BYTES, NEW_NODE_STYLE_DEFAULTS, OwnedTraitLink, PALETTE_PRESETS, PRE_DS2_FLAVOR_DEFAULTS, PRE_TINT_DEFAULT, REDUCED_MOTION_OVERRIDES, REDUCED_TRANSPARENCY_OVERRIDES, REVERT_WINDOW_MS, SCHEME_INK, SPEC_A11Y, SPEC_AXES, SPEC_BUTTON_VARIANT_TO_STYLE, SPEC_CONTRAST, SPEC_CONTRAST_AUDIT, SPEC_DEFAULT_ELEMENT_STYLE, SPEC_ELEMENT_STYLES, SPEC_FIELD_CLASS_BASELINE, SPEC_FLAVORS, SPEC_FLAVOR_PACKS, SPEC_FONTS, SPEC_FONT_ROLES, SPEC_INK_SCOPES, SPEC_LEGACY_ALIASES, SPEC_PALETTE_PRESETS, SPEC_SCHEMES, SPEC_SCHEME_INK, SPEC_SPRINGS, SPEC_TIERS, SPEC_TIER_IDS, SPEC_TOKEN_TYPES, SUPERSEDED_STYLE_VALUES, SWISS_FLAVOR, TINT_FULL_CHROMA, TINT_IDS, TINT_LEVELS, TINT_OWN_HUE_CHROMA, TINT_TURN_CHROMA, USER_TOKEN_SOURCE, WCAG_AA_TEXT, WCAG_AA_UI, adoptElementStyles, adoptionStyleFor, apcaLc, applyElementStyle, applyHeadingLevelRule, atLightness, atLightnessMaxChroma, auditDesignContrast, barReserveClass, buildFlavorTokens, buildFontFaceCss, buttonBlockHref, catalogFontId, checkFontWeight, choicesForPack, colorSchemeClass, colorSchemeOf, colourTabChecks, compareFontWeights, compileSchemeCss, compileTokenCss, compileTokenCssBlocks, compositeOver, cssString, defaultDesignChoices, defaultElementStyleFor, deriveAccentTokens, deriveBrandTokens, designBaseline, designConfigEntries, designModeOf, designTokenRepairs, designTokenRows, elementStyleById, elementStyleClass, elementStylesFor, emptyImageLabelSrc, emptyImagePlaceholder, emptyImageSrc, ensureAlpha, ensureContrast, flavorColours, flavorPackById, flavorSeedWrites, flavorSourceStamp, fontFamilyKey, fontFileName, fontFileStem, fontFormatOf, fontPreloads, fontRoleReferences, fontStackWithout, fontWeightCovers, fontWeightRange, fontWeightValue, fontsForTokens, formatFontFamilies, formatFontFamily, formatFontWeight, googleFontHref, groupFontFamilies, hasElementStyleMarker, headingHref, inSrgbGamut, isDesignTokenGroup, isDesignTokenTier, isDesignTokenType, isFontWeightRange, isRetiredFlavorId, legacyDesignTokenRows, legacyFlavorTokens, legacyRuleTokenReferences, matchFontWeight, missingDesignRows, missingFontRoles, nodeDesignClasses, normalizeFontStyle, normalizeFontWeight, normalizeFontWeightValue, oklabToRgb, ownedTraitStatus, ownedTraitsOf, packDesignChoices, paintColours, parseCssColour, parseFontFamilies, parseFontWeight, parseHexColor, planDesignApply, planDesignRevert, planFlavorRevert, planFlavorSeed, planFontFamilyRemoval, planSwissMigration, preTintAccentGrounds, previewElementStyleAdoption, previewFontWeight, quantizeRgb, readDesignConfig, readOwnedTrait, relativeLuminance, resolveDesignChoices, resolveSchemeTokenValues, resolveTokenReferences, resolveTokenValues, revertAvailable, rgbToOklab, ringColour, roleClass, sameDesignChoices, setColorScheme, specTokenNames, splitTopLevel, springToLinear, stackNamesFamily, styleKeyToKebab, switchElementStyle, syncNodeDesignClasses, toHexColor, tokenReferences, tokensToDarkVarMap, tokensToVarMap, unknownTokenReferences, untouchedSeedRow, userFontStack, validateFlavorPack, wcagContrastRatio, withSchemeInk, writeOwnedTrait };
|
|
12446
|
+
export { ACCENT_TOKEN_NAMES, AdoptOutcome, AdoptSkipReason, BAR_RESERVE_BREAKPOINTS, BAR_RESERVE_CLASS, BOTTOM_BAR_STYLE, BUTTON_VARIANT_TO_STYLE, CANVAS_LINK_ATTRIBUTE, CARD_LINK_CLASS, COLOR_SCHEMES, COLOR_SCHEME_TRAIT, COLOR_SCHEME_TYPES, ColorScheme, ColourCheckId, DEFAULT_FLAVOR_ID, DESIGN_TOKEN_GROUPS, DESIGN_TOKEN_TIERS, DESIGN_TOKEN_TYPES, DesignConfigKey, ELEMENT_STYLES, ELEMENT_STYLE_MARKER_CLASS, ELEMENT_STYLE_STATES, EMPTY_IMAGE_ATTRIBUTE, EMPTY_IMAGE_SRC, ElementStyleState, FLAVOR_SPEC_VERSION, FONT_CATALOG, FONT_FAMILY_TOKENS, FONT_FILE_ACCEPT, FONT_FILE_EXTENSIONS, FONT_FILE_FORMATS, FONT_STYLES, FONT_WEIGHTS, FontUploadError, GOOGLE_FONTS_CSS_ORIGIN, GOOGLE_FONTS_FILE_ORIGIN, HELD_CONTRAST, INHERITED_TEXT, LinkType, MAX_FONT_FILE_BYTES, NEW_NODE_STYLE_DEFAULTS, OwnedTraitLink, PALETTE_PRESETS, PRE_DS2_FLAVOR_DEFAULTS, PRE_TINT_DEFAULT, REDUCED_MOTION_OVERRIDES, REDUCED_TRANSPARENCY_OVERRIDES, REVERT_WINDOW_MS, SCHEME_INK, SPEC_A11Y, SPEC_AXES, SPEC_BUTTON_VARIANT_TO_STYLE, SPEC_CONTRAST, SPEC_CONTRAST_AUDIT, SPEC_DEFAULT_ELEMENT_STYLE, SPEC_ELEMENT_STYLES, SPEC_FIELD_CLASS_BASELINE, SPEC_FLAVORS, SPEC_FLAVOR_PACKS, SPEC_FONTS, SPEC_FONT_ROLES, SPEC_INK_SCOPES, SPEC_LEGACY_ALIASES, SPEC_PALETTE_PRESETS, SPEC_SCHEMES, SPEC_SCHEME_INK, SPEC_SPRINGS, SPEC_TIERS, SPEC_TIER_IDS, SPEC_TOKEN_TYPES, SUPERSEDED_STYLE_VALUES, SWISS_FLAVOR, TINT_FULL_CHROMA, TINT_IDS, TINT_LEVELS, TINT_OWN_HUE_CHROMA, TINT_TURN_CHROMA, USER_TOKEN_SOURCE, WCAG_AA_TEXT, WCAG_AA_UI, adoptElementStyles, adoptionStyleFor, apcaLc, applyElementStyle, applyHeadingLevelRule, atLightness, atLightnessMaxChroma, auditDesignContrast, barReserveClass, buildFlavorTokens, buildFontFaceCss, buttonBlockHref, catalogFontId, checkFontWeight, choicesForPack, colorSchemeClass, colorSchemeOf, colourTabChecks, compareFontWeights, compileSchemeCss, compileTokenCss, compileTokenCssBlocks, compositeOver, cssString, defaultDesignChoices, defaultElementStyleFor, deriveAccentTokens, deriveBrandTokens, designBaseline, designConfigEntries, designModeOf, designTokenRepairs, designTokenRows, elementStyleById, elementStyleClass, elementStylesFor, emptyImageLabelSrc, emptyImagePlaceholder, emptyImageSrc, ensureAlpha, ensureContrast, flavorColours, flavorPackById, flavorSeedWrites, flavorSourceStamp, fontFamilyKey, fontFileName, fontFileStem, fontFormatOf, fontPreloads, fontRoleReferences, fontStackWithout, fontWeightCovers, fontWeightRange, fontWeightValue, fontsForTokens, formatFontFamilies, formatFontFamily, formatFontWeight, googleFontHref, groupFontFamilies, hasElementStyleMarker, headingHref, inSrgbGamut, isDesignTokenGroup, isDesignTokenTier, isDesignTokenType, isFontWeightRange, isRetiredFlavorId, legacyDesignTokenRows, legacyFlavorTokens, legacyRuleTokenReferences, matchFontWeight, missingDesignRows, missingFontRoles, nodeDesignClasses, normalizeFontStyle, normalizeFontWeight, normalizeFontWeightValue, oklabToRgb, ownedTraitStatus, ownedTraitsOf, packDesignChoices, paintColours, parseCssColour, parseFontFamilies, parseFontWeight, parseHexColor, planDesignApply, planDesignRevert, planFlavorRevert, planFlavorSeed, planFontFamilyRemoval, planSwissMigration, preTintAccentGrounds, previewElementStyleAdoption, previewFontWeight, quantizeRgb, readDesignConfig, readOwnedTrait, relativeLuminance, releaseElementStyle, resolveDesignChoices, resolveSchemeTokenValues, resolveTokenReferences, resolveTokenValues, revertAvailable, rgbToOklab, ringColour, roleClass, sameDesignChoices, setColorScheme, specTokenNames, splitTopLevel, springToLinear, stackNamesFamily, styleKeyToKebab, switchElementStyle, syncNodeDesignClasses, toHexColor, tokenReferences, tokensToDarkVarMap, tokensToVarMap, unknownTokenReferences, untouchedSeedRow, userFontStack, validateFlavorPack, wcagContrastRatio, withSchemeInk, writeOwnedTrait };
|
|
12320
12447
|
export type { AccentBackgrounds, AccentGround, AccentTokenName, AdoptContext, AdoptReport, AdoptableNode, AdoptedNode, ApplyElementStyleResult, ButtonBlockLinkProps, ColourCheck, ColourFlavor, ContrastFinding, DensityId, DesignApplyOptions, DesignChoices, DesignClassSource, DesignConfigEntry, DesignMode, DesignTokenGroup, DesignTokenLike, DesignTokenRow, DesignTokenTier, DesignTokenType, ElementStyle, ElementStyleTarget, ElementStyleTraitLike, FlavorColours, FlavorPack, FlavorPackV2, FlavorPalette, FlavorRevertPlan, FlavorRevertSnapshot, FlavorRevertWrite, FlavorSeedOptions, FlavorSeedPlan, FlavorSpecToken, FlavorTintConfig, FlavorTokenDef, FontDescriptor, FontFamilyGroup, FontFamilyRemoval, FontFamilyToken, FontFormat, FontPair, FontRoleToken, FontStyle, FontWeight, FontWeightRange, FontsForTokensOptions, KeptEdit, LinearSpring, MissingFontRole, MotionId, NodeLinkProps, OkLab, OwnedTrait, OwnedTraitStatus, PalettePreset, ResolvedMode, Rgb, Rgba, SchemeId, SeedBaseline, SeedExpectation, ShapeId, SkippedNode, StoredDesign, StoredDesignTokenRow, SupersededStyleValue, SwissMigration, SwitchElementStyleResult, TintId, TintLevel, TokenCssBlocks, TokenCssOptions };
|