@breadstone/mosaik-elements-foundation 0.0.135 → 0.0.137

package/Controls/Components/Grouping/BannerGroup/IBannerGroupElementProps.d.ts

@@ -0,0 +1,36 @@
+import type { IDisableableProps } from '../../../Behaviors/Disableable';
+import type { IOrientableProps } from '../../../Behaviors/Orientable';
+import type { BannerGroupDismissBehavior } from '../../../Types/BannerGroupDismissBehavior';
+import type { BannerGroupStacking } from '../../../Types/BannerGroupStacking';
+/**
+ * Represents the `{@link IBannerGroupElementProps}` interface.
+ *
+ * @public
+ */
+export interface IBannerGroupElementProps extends IDisableableProps, IOrientableProps {
+    /**
+     * The current active (start) index.
+     */
+    index: number;
+    /**
+     * Enables looping when navigating beyond the first or last banner.
+     */
+    loop: boolean;
+    /**
+     * The maximum number of visible banners (1 = pager/carousel mode).
+     */
+    maxLength: number;
+    /**
+     * Defines how dismissed banners are handled.
+     */
+    dismissBehavior: BannerGroupDismissBehavior;
+    /**
+     * Defines how banners are stacked in pager/carousel mode.
+     */
+    stacking: BannerGroupStacking;
+    /**
+     * Whether the order of banners is reversed.
+     */
+    reverse: boolean;
+}
+//# sourceMappingURL=IBannerGroupElementProps.d.ts.map

package/Controls/Components/Grouping/BannerGroup/IBannerGroupElementProps.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"IBannerGroupElementProps.d.ts","sourceRoot":"","sources":["../../../../../src/Controls/Components/Grouping/BannerGroup/IBannerGroupElementProps.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAC;AACxE,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,+BAA+B,CAAC;AACtE,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,2CAA2C,CAAC;AAC5F,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,oCAAoC,CAAC;AAI9E;;;;GAIG;AACH,MAAM,WAAW,wBAAyB,SAAQ,iBAAiB,EAAE,gBAAgB;IAIjF;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;OAEG;IACH,IAAI,EAAE,OAAO,CAAC;IAEd;;OAEG;IACH,SAAS,EAAE,MAAM,CAAC;IAElB;;OAEG;IACH,eAAe,EAAE,0BAA0B,CAAC;IAE5C;;OAEG;IACH,QAAQ,EAAE,mBAAmB,CAAC;IAE9B;;OAEG;IACH,OAAO,EAAE,OAAO,CAAC;CAGpB"}

package/Controls/Components/Grouping/BannerGroup/IBannerGroupElementProps.js

@@ -0,0 +1,3 @@
+// #region Imports
+export {};
+//# sourceMappingURL=IBannerGroupElementProps.js.map

package/Controls/Components/Grouping/BannerGroup/IBannerGroupElementProps.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"IBannerGroupElementProps.js","sourceRoot":"","sources":["../../../../../src/Controls/Components/Grouping/BannerGroup/IBannerGroupElementProps.ts"],"names":[],"mappings":"AAAA,kBAAkB"}

package/Controls/Components/Grouping/BannerGroup/Themes/BannerGroupElement.Cosmopolitan.d.ts

@@ -0,0 +1,6 @@
+import { type CSSResult } from '../../../../../Dom/Css';
+/**
+ * @public
+ */
+export declare function bannerGroupElementCosmopolitanStyle(): CSSResult;
+//# sourceMappingURL=BannerGroupElement.Cosmopolitan.d.ts.map

package/Controls/Components/Grouping/BannerGroup/Themes/BannerGroupElement.Cosmopolitan.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BannerGroupElement.Cosmopolitan.d.ts","sourceRoot":"","sources":["../../../../../../src/Controls/Components/Grouping/BannerGroup/Themes/BannerGroupElement.Cosmopolitan.ts"],"names":[],"mappings":"AASA,OAAO,EAAO,KAAK,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAI7D;;GAEG;AACH,wBAAgB,mCAAmC,IAAI,SAAS,CA8K/D"}

package/Controls/Components/Grouping/BannerGroup/Themes/BannerGroupElement.Cosmopolitan.js

@@ -0,0 +1,188 @@
+// ------------------------------------------------------------------------------
+// <auto-generated>
+//     This code was generated by a tool.
+//     Changes to this file may cause incorrect behavior and will be lost if the code is regenerated.
+// </auto-generated>
+// ------------------------------------------------------------------------------
+// #region Imports
+import { css } from '../../../../../Dom/Css';
+// #endregion
+/**
+ * @public
+ */
+export function bannerGroupElementCosmopolitanStyle() {
+    return css `
+:host {
+  --banner-group-font-family: unset;
+  --banner-group-font-letter-spacing: unset;
+  --banner-group-font-line-height: unset;
+  --banner-group-font-size: unset;
+  --banner-group-font-text-decoration: unset;
+  --banner-group-font-text-transform: unset;
+  --banner-group-font-weight: unset;
+  --banner-group-gap: unset;
+  --banner-group-padding-bottom: unset;
+  --banner-group-padding-left: unset;
+  --banner-group-padding-right: unset;
+  --banner-group-padding-top: unset;
+  --banner-group-transition-duration: unset;
+  --banner-group-transition-mode: unset;
+  --banner-group-transition-property: unset;
+  --banner-group-translate: unset;
+}
+
+@media screen and (prefers-reduced-motion: reduce) {
+  :host {
+    transition-duration: .01ms;
+  }
+}
+
+:host {
+  box-sizing: border-box;
+  display: block;
+  position: relative;
+}
+
+:host *, :host :before, :host :after {
+  box-sizing: border-box;
+  background-repeat: no-repeat;
+}
+
+:host :before, :host :after {
+  text-decoration: inherit;
+  vertical-align: inherit;
+}
+
+:host([hidden]) {
+  display: none !important;
+}
+
+:host {
+  --banner-group-gap: 0px;
+  --banner-group-indicator-size: 8px;
+  --banner-group-indicator-gap: 8px;
+  --banner-group-depth-scale-step: .08;
+  --banner-group-depth-translate-step: 12;
+  --banner-group-depth-opacity-step: 0;
+  display: block;
+  position: relative;
+}
+
+:host [part="viewport"] {
+  gap: var(--banner-group-gap);
+  flex-direction: row;
+  display: flex;
+}
+
+:host([orientation="vertical"]) [part="viewport"] {
+  flex-direction: column;
+}
+
+:host([orientation="vertical"][reverse]) [part="viewport"] {
+  flex-direction: column-reverse;
+}
+
+:host([orientation="horizontal"]) [part="viewport"] {
+  flex-direction: row;
+}
+
+:host([orientation="horizontal"][reverse]) [part="viewport"] {
+  flex-direction: row-reverse;
+}
+
+:host ::slotted([hidden]) {
+  display: none !important;
+}
+
+:host([stacking="depth"]) [part="viewport"] {
+  align-items: center;
+  position: relative;
+}
+
+:host(:not([stacking="depth"])) ::slotted(.banner-group-item) {
+  will-change: opacity, transform;
+  transition: opacity .22s, transform .32s cubic-bezier(.22, .61, .36, 1);
+}
+
+:host(:not([stacking="depth"])) ::slotted(.banner-group-item[hidden]) {
+  display: none !important;
+}
+
+:host(:not([stacking="depth"])) ::slotted(.banner-group-item[data-active="true"]) {
+  opacity: 1;
+  position: relative;
+  transform: translate3d(0, 0, 0);
+}
+
+:host(:not([stacking="depth"])) ::slotted(.banner-group-item:not([data-active="true"]):not([data-leaving="true"])) {
+  opacity: 0;
+  transform: translate3d(0, 8px, 0);
+}
+
+:host([orientation="horizontal"]:not([stacking="depth"])) ::slotted(.banner-group-item:not([data-active="true"]):not([data-leaving="true"])) {
+  transform: translate3d(8px, 0, 0);
+}
+
+:host(:not([stacking="depth"])) ::slotted(.banner-group-item[data-leaving="true"]) {
+  opacity: 0;
+  transform: translate3d(0, -8px, 0);
+}
+
+:host([orientation="horizontal"]:not([stacking="depth"])) ::slotted(.banner-group-item[data-leaving="true"]) {
+  transform: translate3d(-8px, 0, 0);
+}
+
+:host([stacking="depth"]) ::slotted(.banner-group-item) {
+  transform-origin: top;
+  pointer-events: none;
+  --_depth-offset: var(--banner-group-item-depth-offset, 0);
+  --_item-index: var(--banner-group-item-index, 0);
+  --_direction: 1;
+  --_translate-primary: calc(var(--banner-group-depth-translate-step) * var(--_depth-offset) * var(--_direction) * 1px);
+  --_scale: calc(1 - (var(--banner-group-depth-scale-step) * var(--_depth-offset)));
+  --_opacity: calc(1 - (var(--banner-group-depth-opacity-step) * var(--_depth-offset)));
+  z-index: calc(var(--banner-group-visible-count, 1)  - var(--_depth-offset));
+  transform: translateY(var(--_translate-primary)) scale(var(--_scale));
+  opacity: var(--_opacity);
+  transition: transform .16s, opacity .16s;
+  position: absolute;
+  inset: 0;
+}
+
+:host([stacking="depth"][reverse]) ::slotted(.banner-group-item) {
+  --_direction: -1;
+  transform-origin: bottom;
+}
+
+:host([stacking="depth"][orientation="horizontal"]) ::slotted(.banner-group-item) {
+  transform-origin: 100%;
+  transform: translateX(var(--_translate-primary)) scale(var(--_scale));
+}
+
+:host([stacking="depth"][orientation="horizontal"][reverse]) ::slotted(.banner-group-item) {
+  --_direction: -1;
+  transform-origin: 0;
+}
+
+:host([stacking="depth"]) ::slotted(.banner-group-item[data-active="true"]) {
+  z-index: 1000;
+  pointer-events: auto;
+  position: relative;
+}
+
+:host([stacking="depth"]:hover) ::slotted(.banner-group-item) {
+  opacity: 1;
+  pointer-events: auto;
+  z-index: auto;
+  position: static;
+  inset: auto;
+  transform: none;
+}
+
+:host([stacking="depth"][orientation="horizontal"]:hover) ::slotted(.banner-group-item) {
+  transform: none;
+}
+
+    `;
+}
+//# sourceMappingURL=BannerGroupElement.Cosmopolitan.js.map

package/Controls/Components/Grouping/BannerGroup/Themes/BannerGroupElement.Cosmopolitan.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BannerGroupElement.Cosmopolitan.js","sourceRoot":"","sources":["../../../../../../src/Controls/Components/Grouping/BannerGroup/Themes/BannerGroupElement.Cosmopolitan.ts"],"names":[],"mappings":"AAAA,iFAAiF;AACjF,mBAAmB;AACnB,yCAAyC;AACzC,qGAAqG;AACrG,oBAAoB;AACpB,iFAAiF;AAEjF,kBAAkB;AAElB,OAAO,EAAE,GAAG,EAAkB,MAAM,wBAAwB,CAAC;AAE7D,aAAa;AAEb;;GAEG;AACH,MAAM,UAAU,mCAAmC;IAC/C,OAAO,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA4KT,CAAC;AACN,CAAC"}

package/Controls/Components/Grouping/BannerGroup/Themes/BannerGroupElement.Joy.d.ts

@@ -0,0 +1,6 @@
+import { type CSSResult } from '../../../../../Dom/Css';
+/**
+ * @public
+ */
+export declare function bannerGroupElementJoyStyle(): CSSResult;
+//# sourceMappingURL=BannerGroupElement.Joy.d.ts.map

package/Controls/Components/Grouping/BannerGroup/Themes/BannerGroupElement.Joy.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BannerGroupElement.Joy.d.ts","sourceRoot":"","sources":["../../../../../../src/Controls/Components/Grouping/BannerGroup/Themes/BannerGroupElement.Joy.ts"],"names":[],"mappings":"AASA,OAAO,EAAO,KAAK,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAI7D;;GAEG;AACH,wBAAgB,0BAA0B,IAAI,SAAS,CA8KtD"}

package/Controls/Components/Grouping/BannerGroup/Themes/BannerGroupElement.Joy.js

@@ -0,0 +1,188 @@
+// ------------------------------------------------------------------------------
+// <auto-generated>
+//     This code was generated by a tool.
+//     Changes to this file may cause incorrect behavior and will be lost if the code is regenerated.
+// </auto-generated>
+// ------------------------------------------------------------------------------
+// #region Imports
+import { css } from '../../../../../Dom/Css';
+// #endregion
+/**
+ * @public
+ */
+export function bannerGroupElementJoyStyle() {
+    return css `
+:host {
+  --banner-group-font-family: unset;
+  --banner-group-font-letter-spacing: unset;
+  --banner-group-font-line-height: unset;
+  --banner-group-font-size: unset;
+  --banner-group-font-text-decoration: unset;
+  --banner-group-font-text-transform: unset;
+  --banner-group-font-weight: unset;
+  --banner-group-gap: unset;
+  --banner-group-padding-bottom: unset;
+  --banner-group-padding-left: unset;
+  --banner-group-padding-right: unset;
+  --banner-group-padding-top: unset;
+  --banner-group-transition-duration: unset;
+  --banner-group-transition-mode: unset;
+  --banner-group-transition-property: unset;
+  --banner-group-translate: unset;
+}
+
+@media screen and (prefers-reduced-motion: reduce) {
+  :host {
+    transition-duration: .01ms;
+  }
+}
+
+:host {
+  box-sizing: border-box;
+  display: block;
+  position: relative;
+}
+
+:host *, :host :before, :host :after {
+  box-sizing: border-box;
+  background-repeat: no-repeat;
+}
+
+:host :before, :host :after {
+  text-decoration: inherit;
+  vertical-align: inherit;
+}
+
+:host([hidden]) {
+  display: none !important;
+}
+
+:host {
+  --banner-group-gap: 0px;
+  --banner-group-indicator-size: 8px;
+  --banner-group-indicator-gap: 8px;
+  --banner-group-depth-scale-step: .08;
+  --banner-group-depth-translate-step: 12;
+  --banner-group-depth-opacity-step: 0;
+  display: block;
+  position: relative;
+}
+
+:host [part="viewport"] {
+  gap: var(--banner-group-gap);
+  flex-direction: row;
+  display: flex;
+}
+
+:host([orientation="vertical"]) [part="viewport"] {
+  flex-direction: column;
+}
+
+:host([orientation="vertical"][reverse]) [part="viewport"] {
+  flex-direction: column-reverse;
+}
+
+:host([orientation="horizontal"]) [part="viewport"] {
+  flex-direction: row;
+}
+
+:host([orientation="horizontal"][reverse]) [part="viewport"] {
+  flex-direction: row-reverse;
+}
+
+:host ::slotted([hidden]) {
+  display: none !important;
+}
+
+:host([stacking="depth"]) [part="viewport"] {
+  align-items: center;
+  position: relative;
+}
+
+:host(:not([stacking="depth"])) ::slotted(.banner-group-item) {
+  will-change: opacity, transform;
+  transition: opacity .22s, transform .32s cubic-bezier(.22, .61, .36, 1);
+}
+
+:host(:not([stacking="depth"])) ::slotted(.banner-group-item[hidden]) {
+  display: none !important;
+}
+
+:host(:not([stacking="depth"])) ::slotted(.banner-group-item[data-active="true"]) {
+  opacity: 1;
+  position: relative;
+  transform: translate3d(0, 0, 0);
+}
+
+:host(:not([stacking="depth"])) ::slotted(.banner-group-item:not([data-active="true"]):not([data-leaving="true"])) {
+  opacity: 0;
+  transform: translate3d(0, 8px, 0);
+}
+
+:host([orientation="horizontal"]:not([stacking="depth"])) ::slotted(.banner-group-item:not([data-active="true"]):not([data-leaving="true"])) {
+  transform: translate3d(8px, 0, 0);
+}
+
+:host(:not([stacking="depth"])) ::slotted(.banner-group-item[data-leaving="true"]) {
+  opacity: 0;
+  transform: translate3d(0, -8px, 0);
+}
+
+:host([orientation="horizontal"]:not([stacking="depth"])) ::slotted(.banner-group-item[data-leaving="true"]) {
+  transform: translate3d(-8px, 0, 0);
+}
+
+:host([stacking="depth"]) ::slotted(.banner-group-item) {
+  transform-origin: top;
+  pointer-events: none;
+  --_depth-offset: var(--banner-group-item-depth-offset, 0);
+  --_item-index: var(--banner-group-item-index, 0);
+  --_direction: 1;
+  --_translate-primary: calc(var(--banner-group-depth-translate-step) * var(--_depth-offset) * var(--_direction) * 1px);
+  --_scale: calc(1 - (var(--banner-group-depth-scale-step) * var(--_depth-offset)));
+  --_opacity: calc(1 - (var(--banner-group-depth-opacity-step) * var(--_depth-offset)));
+  z-index: calc(var(--banner-group-visible-count, 1)  - var(--_depth-offset));
+  transform: translateY(var(--_translate-primary)) scale(var(--_scale));
+  opacity: var(--_opacity);
+  transition: transform .16s, opacity .16s;
+  position: absolute;
+  inset: 0;
+}
+
+:host([stacking="depth"][reverse]) ::slotted(.banner-group-item) {
+  --_direction: -1;
+  transform-origin: bottom;
+}
+
+:host([stacking="depth"][orientation="horizontal"]) ::slotted(.banner-group-item) {
+  transform-origin: 100%;
+  transform: translateX(var(--_translate-primary)) scale(var(--_scale));
+}
+
+:host([stacking="depth"][orientation="horizontal"][reverse]) ::slotted(.banner-group-item) {
+  --_direction: -1;
+  transform-origin: 0;
+}
+
+:host([stacking="depth"]) ::slotted(.banner-group-item[data-active="true"]) {
+  z-index: 1000;
+  pointer-events: auto;
+  position: relative;
+}
+
+:host([stacking="depth"]:hover) ::slotted(.banner-group-item) {
+  opacity: 1;
+  pointer-events: auto;
+  z-index: auto;
+  position: static;
+  inset: auto;
+  transform: none;
+}
+
+:host([stacking="depth"][orientation="horizontal"]:hover) ::slotted(.banner-group-item) {
+  transform: none;
+}
+
+    `;
+}
+//# sourceMappingURL=BannerGroupElement.Joy.js.map

package/Controls/Components/Grouping/BannerGroup/Themes/BannerGroupElement.Joy.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BannerGroupElement.Joy.js","sourceRoot":"","sources":["../../../../../../src/Controls/Components/Grouping/BannerGroup/Themes/BannerGroupElement.Joy.ts"],"names":[],"mappings":"AAAA,iFAAiF;AACjF,mBAAmB;AACnB,yCAAyC;AACzC,qGAAqG;AACrG,oBAAoB;AACpB,iFAAiF;AAEjF,kBAAkB;AAElB,OAAO,EAAE,GAAG,EAAkB,MAAM,wBAAwB,CAAC;AAE7D,aAAa;AAEb;;GAEG;AACH,MAAM,UAAU,0BAA0B;IACtC,OAAO,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA4KT,CAAC;AACN,CAAC"}

package/Controls/Components/Grouping/BannerGroup/Themes/BannerGroupElement.Retro.d.ts

@@ -0,0 +1,6 @@
+import { type CSSResult } from '../../../../../Dom/Css';
+/**
+ * @public
+ */
+export declare function bannerGroupElementRetroStyle(): CSSResult;
+//# sourceMappingURL=BannerGroupElement.Retro.d.ts.map

package/Controls/Components/Grouping/BannerGroup/Themes/BannerGroupElement.Retro.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BannerGroupElement.Retro.d.ts","sourceRoot":"","sources":["../../../../../../src/Controls/Components/Grouping/BannerGroup/Themes/BannerGroupElement.Retro.ts"],"names":[],"mappings":"AASA,OAAO,EAAO,KAAK,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAI7D;;GAEG;AACH,wBAAgB,4BAA4B,IAAI,SAAS,CA8KxD"}

package/Controls/Components/Grouping/BannerGroup/Themes/BannerGroupElement.Retro.js

@@ -0,0 +1,188 @@
+// ------------------------------------------------------------------------------
+// <auto-generated>
+//     This code was generated by a tool.
+//     Changes to this file may cause incorrect behavior and will be lost if the code is regenerated.
+// </auto-generated>
+// ------------------------------------------------------------------------------
+// #region Imports
+import { css } from '../../../../../Dom/Css';
+// #endregion
+/**
+ * @public
+ */
+export function bannerGroupElementRetroStyle() {
+    return css `
+:host {
+  --banner-group-font-family: unset;
+  --banner-group-font-letter-spacing: unset;
+  --banner-group-font-line-height: unset;
+  --banner-group-font-size: unset;
+  --banner-group-font-text-decoration: unset;
+  --banner-group-font-text-transform: unset;
+  --banner-group-font-weight: unset;
+  --banner-group-gap: unset;
+  --banner-group-padding-bottom: unset;
+  --banner-group-padding-left: unset;
+  --banner-group-padding-right: unset;
+  --banner-group-padding-top: unset;
+  --banner-group-transition-duration: unset;
+  --banner-group-transition-mode: unset;
+  --banner-group-transition-property: unset;
+  --banner-group-translate: unset;
+}
+
+@media screen and (prefers-reduced-motion: reduce) {
+  :host {
+    transition-duration: .01ms;
+  }
+}
+
+:host {
+  box-sizing: border-box;
+  display: block;
+  position: relative;
+}
+
+:host *, :host :before, :host :after {
+  box-sizing: border-box;
+  background-repeat: no-repeat;
+}
+
+:host :before, :host :after {
+  text-decoration: inherit;
+  vertical-align: inherit;
+}
+
+:host([hidden]) {
+  display: none !important;
+}
+
+:host {
+  --banner-group-gap: 0px;
+  --banner-group-indicator-size: 8px;
+  --banner-group-indicator-gap: 8px;
+  --banner-group-depth-scale-step: .08;
+  --banner-group-depth-translate-step: 12;
+  --banner-group-depth-opacity-step: 0;
+  display: block;
+  position: relative;
+}
+
+:host [part="viewport"] {
+  gap: var(--banner-group-gap);
+  flex-direction: row;
+  display: flex;
+}
+
+:host([orientation="vertical"]) [part="viewport"] {
+  flex-direction: column;
+}
+
+:host([orientation="vertical"][reverse]) [part="viewport"] {
+  flex-direction: column-reverse;
+}
+
+:host([orientation="horizontal"]) [part="viewport"] {
+  flex-direction: row;
+}
+
+:host([orientation="horizontal"][reverse]) [part="viewport"] {
+  flex-direction: row-reverse;
+}
+
+:host ::slotted([hidden]) {
+  display: none !important;
+}
+
+:host([stacking="depth"]) [part="viewport"] {
+  align-items: center;
+  position: relative;
+}
+
+:host(:not([stacking="depth"])) ::slotted(.banner-group-item) {
+  will-change: opacity, transform;
+  transition: opacity .22s, transform .32s cubic-bezier(.22, .61, .36, 1);
+}
+
+:host(:not([stacking="depth"])) ::slotted(.banner-group-item[hidden]) {
+  display: none !important;
+}
+
+:host(:not([stacking="depth"])) ::slotted(.banner-group-item[data-active="true"]) {
+  opacity: 1;
+  position: relative;
+  transform: translate3d(0, 0, 0);
+}
+
+:host(:not([stacking="depth"])) ::slotted(.banner-group-item:not([data-active="true"]):not([data-leaving="true"])) {
+  opacity: 0;
+  transform: translate3d(0, 8px, 0);
+}
+
+:host([orientation="horizontal"]:not([stacking="depth"])) ::slotted(.banner-group-item:not([data-active="true"]):not([data-leaving="true"])) {
+  transform: translate3d(8px, 0, 0);
+}
+
+:host(:not([stacking="depth"])) ::slotted(.banner-group-item[data-leaving="true"]) {
+  opacity: 0;
+  transform: translate3d(0, -8px, 0);
+}
+
+:host([orientation="horizontal"]:not([stacking="depth"])) ::slotted(.banner-group-item[data-leaving="true"]) {
+  transform: translate3d(-8px, 0, 0);
+}
+
+:host([stacking="depth"]) ::slotted(.banner-group-item) {
+  transform-origin: top;
+  pointer-events: none;
+  --_depth-offset: var(--banner-group-item-depth-offset, 0);
+  --_item-index: var(--banner-group-item-index, 0);
+  --_direction: 1;
+  --_translate-primary: calc(var(--banner-group-depth-translate-step) * var(--_depth-offset) * var(--_direction) * 1px);
+  --_scale: calc(1 - (var(--banner-group-depth-scale-step) * var(--_depth-offset)));
+  --_opacity: calc(1 - (var(--banner-group-depth-opacity-step) * var(--_depth-offset)));
+  z-index: calc(var(--banner-group-visible-count, 1)  - var(--_depth-offset));
+  transform: translateY(var(--_translate-primary)) scale(var(--_scale));
+  opacity: var(--_opacity);
+  transition: transform .16s, opacity .16s;
+  position: absolute;
+  inset: 0;
+}
+
+:host([stacking="depth"][reverse]) ::slotted(.banner-group-item) {
+  --_direction: -1;
+  transform-origin: bottom;
+}
+
+:host([stacking="depth"][orientation="horizontal"]) ::slotted(.banner-group-item) {
+  transform-origin: 100%;
+  transform: translateX(var(--_translate-primary)) scale(var(--_scale));
+}
+
+:host([stacking="depth"][orientation="horizontal"][reverse]) ::slotted(.banner-group-item) {
+  --_direction: -1;
+  transform-origin: 0;
+}
+
+:host([stacking="depth"]) ::slotted(.banner-group-item[data-active="true"]) {
+  z-index: 1000;
+  pointer-events: auto;
+  position: relative;
+}
+
+:host([stacking="depth"]:hover) ::slotted(.banner-group-item) {
+  opacity: 1;
+  pointer-events: auto;
+  z-index: auto;
+  position: static;
+  inset: auto;
+  transform: none;
+}
+
+:host([stacking="depth"][orientation="horizontal"]:hover) ::slotted(.banner-group-item) {
+  transform: none;
+}
+
+    `;
+}
+//# sourceMappingURL=BannerGroupElement.Retro.js.map

package/Controls/Components/Grouping/BannerGroup/Themes/BannerGroupElement.Retro.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BannerGroupElement.Retro.js","sourceRoot":"","sources":["../../../../../../src/Controls/Components/Grouping/BannerGroup/Themes/BannerGroupElement.Retro.ts"],"names":[],"mappings":"AAAA,iFAAiF;AACjF,mBAAmB;AACnB,yCAAyC;AACzC,qGAAqG;AACrG,oBAAoB;AACpB,iFAAiF;AAEjF,kBAAkB;AAElB,OAAO,EAAE,GAAG,EAAkB,MAAM,wBAAwB,CAAC;AAE7D,aAAa;AAEb;;GAEG;AACH,MAAM,UAAU,4BAA4B;IACxC,OAAO,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA4KT,CAAC;AACN,CAAC"}

package/Controls/Components/Inputs/Abstracts/InputBase.d.ts

@@ -96,9 +96,5 @@ export declare abstract class InputBaseElement extends InputBaseElement_base imp
      */
     private tryGetInput;
 }
-/**
- * @public
- */
-export declare function isInputBase(element: Element): element is InputBaseElement;
 export {};
 //# sourceMappingURL=InputBase.d.ts.map

package/Controls/Components/Inputs/Abstracts/InputBase.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"InputBase.d.ts","sourceRoot":"","sources":["../../../../../src/Controls/Components/Inputs/Abstracts/InputBase.ts"],"names":[],"mappings":"AAEA,OAAO,EAAa,KAAK,eAAe,EAAE,MAAM,8BAA8B,CAAC;AAG/E,OAAO,EAAE,UAAU,EAAE,MAAM,2BAA2B,CAAC;AACvD,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAC9D,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAC3D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAIrD;;;;GAIG;AACH,MAAM,WAAW,eAAgB,SAAQ,eAAe;IAEpD,QAAQ,EAAE,OAAO,CAAC;IAElB,KAAK,EAAE,UAAU,CAAC;IAElB,SAAS,EAAE,gBAAgB,GAAG,IAAI,CAAC;IAEnC,MAAM,EAAE,aAAa,GAAG,IAAI,CAAC;CAEhC;;AAED;;;;;GAKG;AACH,8BAAsB,gBAClB,SAAQ,qBACR,YAAW,eAAe;IAI1B,OAAO,CAAC,MAAM,CAAa;IAC3B,OAAO,CAAC,SAAS,CAAU;IAC3B,OAAO,CAAC,UAAU,CAA0B;IAC5C,OAAO,CAAC,OAAO,CAAuB;IAMtC;;OAEG;;IAcH;;;;;OAKG;IACH,IAIW,QAAQ,IAAI,OAAO,CAE7B;IAED,IAAW,QAAQ,CAAC,KAAK,EAAE,OAAO,EAKjC;IAED;;;;;;OAMG;IACH,IACW,KAAK,IAAI,UAAU,CAE7B;IAED,OAAO,KAAK,KAAK,QAKhB;IAED;;;;OAIG;IACH,IACW,SAAS,IAAI,gBAAgB,GAAG,IAAI,CAE9C;IAED,IAAW,SAAS,CAAC,KAAK,EAAE,gBAAgB,GAAG,IAAI,EAKlD;IAED;;;;OAIG;IACH,IACW,MAAM,IAAI,aAAa,GAAG,IAAI,CAExC;IAED,IAAW,MAAM,CAAC,KAAK,EAAE,aAAa,GAAG,IAAI,EAK5C;IAMD;;;;OAIG;IACI,KAAK,IAAI,IAAI;IAIpB;;OAEG;IACH,SAAS,CAAC,QAAQ,CAAC,KAAK,EAAE,gBAAgB,GAAG,mBAAmB,GAAG,OAAO;IAQ1E;;OAEG;IACH,SAAS,CAAC,MAAM,CAAC,MAAM,EAAE,UAAU,GAAG,IAAI;IAa1C;;OAEG;IACH,SAAS,CAAC,OAAO,CAAC,MAAM,EAAE,UAAU,GAAG,IAAI;IAI3C;;OAEG;IACH,SAAS,CAAC,OAAO,CAAC,MAAM,EAAE,UAAU,GAAG,IAAI;IAI3C;;OAEG;IACH,OAAO,CAAC,UAAU;IAkBlB;;OAEG;IACH,OAAO,CAAC,aAAa;IAoBrB;;OAEG;IACH,OAAO,CAAC,WAAW;CAUtB;AAED;;GAEG;AACH,wBAAgB,WAAW,CAAC,OAAO,EAAE,OAAO,GAAG,OAAO,IAAI,gBAAgB,CAEzE"}
+{"version":3,"file":"InputBase.d.ts","sourceRoot":"","sources":["../../../../../src/Controls/Components/Inputs/Abstracts/InputBase.ts"],"names":[],"mappings":"AAEA,OAAO,EAAa,KAAK,eAAe,EAAE,MAAM,8BAA8B,CAAC;AAG/E,OAAO,EAAE,UAAU,EAAE,MAAM,2BAA2B,CAAC;AACvD,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAC9D,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAC3D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAIrD;;;;GAIG;AACH,MAAM,WAAW,eAAgB,SAAQ,eAAe;IAEpD,QAAQ,EAAE,OAAO,CAAC;IAElB,KAAK,EAAE,UAAU,CAAC;IAElB,SAAS,EAAE,gBAAgB,GAAG,IAAI,CAAC;IAEnC,MAAM,EAAE,aAAa,GAAG,IAAI,CAAC;CAEhC;;AAED;;;;;GAKG;AACH,8BAAsB,gBAClB,SAAQ,qBACR,YAAW,eAAe;IAI1B,OAAO,CAAC,MAAM,CAAa;IAC3B,OAAO,CAAC,SAAS,CAAU;IAC3B,OAAO,CAAC,UAAU,CAA0B;IAC5C,OAAO,CAAC,OAAO,CAAuB;IAMtC;;OAEG;;IAcH;;;;;OAKG;IACH,IAIW,QAAQ,IAAI,OAAO,CAE7B;IAED,IAAW,QAAQ,CAAC,KAAK,EAAE,OAAO,EAKjC;IAED;;;;;;OAMG;IACH,IACW,KAAK,IAAI,UAAU,CAE7B;IAED,OAAO,KAAK,KAAK,QAKhB;IAED;;;;OAIG;IACH,IACW,SAAS,IAAI,gBAAgB,GAAG,IAAI,CAE9C;IAED,IAAW,SAAS,CAAC,KAAK,EAAE,gBAAgB,GAAG,IAAI,EAKlD;IAED;;;;OAIG;IACH,IACW,MAAM,IAAI,aAAa,GAAG,IAAI,CAExC;IAED,IAAW,MAAM,CAAC,KAAK,EAAE,aAAa,GAAG,IAAI,EAK5C;IAMD;;;;OAIG;IACI,KAAK,IAAI,IAAI;IAIpB;;OAEG;IACH,SAAS,CAAC,QAAQ,CAAC,KAAK,EAAE,gBAAgB,GAAG,mBAAmB,GAAG,OAAO;IAQ1E;;OAEG;IACH,SAAS,CAAC,MAAM,CAAC,MAAM,EAAE,UAAU,GAAG,IAAI;IAa1C;;OAEG;IACH,SAAS,CAAC,OAAO,CAAC,MAAM,EAAE,UAAU,GAAG,IAAI;IAI3C;;OAEG;IACH,SAAS,CAAC,OAAO,CAAC,MAAM,EAAE,UAAU,GAAG,IAAI;IAI3C;;OAEG;IACH,OAAO,CAAC,UAAU;IAkBlB;;OAEG;IACH,OAAO,CAAC,aAAa;IAoBrB;;OAEG;IACH,OAAO,CAAC,WAAW;CAUtB"}