@oicl/openbridge-webcomponents-full-bundle 2.0.0-next.58 → 2.0.0-next.60

package/dist/components/tree-navigation-item/tree-navigation-item.css.js

@@ -0,0 +1,429 @@
+import { css } from "lit";
+const componentStyle = css`
+          * {
+            -webkit-tap-highlight-color: transparent;
+          }
+
+* {
+  box-sizing: border-box;
+}
+
+:host {
+  display: block;
+}
+
+.wrapper {
+  display: flex;
+  align-items: center;
+  width: 100%;
+  height: var(--menu-navigation-components-tree-navigation-item-touch-target);
+  user-select: none;
+}
+
+.wrapper:focus-visible {
+    outline-offset: -2px;
+  }
+
+.wrapper {
+            cursor: pointer;
+}
+
+.wrapper:focus {
+            outline: none;
+}
+
+.wrapper .visible-wrapper {
+            border-color: var(--flat-enabled-border-color);
+            background-color: var(--flat-enabled-background-color);
+            border-width: 1px;
+            border-style: solid;
+            cursor: pointer;
+            --base-border-color: var(--flat-enabled-border-color);
+            --base-background-color: var(--flat-enabled-background-color);
+}
+
+.wrapper.activated .visible-wrapper {
+            border-color: var(--flat-activated-border-color);
+            background-color: var(--flat-activated-background-color);
+            --base-border-color: var(--flat-activated-border-color);
+            --base-background-color: var(--flat-activated-background-color);
+}
+
+@media (hover:hover) {
+
+.wrapper:hover .visible-wrapper {
+                        border-color: color-mix(in srgb, var(--flat-hover-border-color) calc(var(--obc-can-hover) * 100%), var(--base-border-color));
+                        background-color: color-mix(in srgb, var(--flat-hover-background-color) calc(var(--obc-can-hover) * 100%), var(--base-background-color));
+            }
+}
+
+.wrapper:active .visible-wrapper {
+            border-color: var(--flat-pressed-border-color);
+            background-color: var(--flat-pressed-background-color);
+}
+
+.wrapper:focus-visible .visible-wrapper {
+            outline-color: var(--border-focus-color);
+            outline-width: var(--global-size-spacing-border-weight-focusframe);
+            outline-style: solid;
+            border-color: var(--container-global-color);
+            z-index: 1;
+}
+
+.wrapper:disabled .visible-wrapper {
+            border-color: var(--flat-disabled-border-color);
+            background-color: var(--flat-disabled-background-color);
+            cursor: not-allowed;
+            color: var(--on-flat-disabled-color) !important;
+}
+
+.wrapper.disabled .visible-wrapper {
+            border-color: var(--flat-disabled-border-color);
+            background-color: var(--flat-disabled-background-color);
+            cursor: not-allowed;
+            color: var(--on-flat-disabled-color) !important;
+}
+
+.wrapper:disabled {
+            cursor: not-allowed;
+}
+
+.wrapper.disabled {
+            cursor: not-allowed;
+}
+
+.wrapper {
+  font-family: var(--global-typography-font-family);
+  font-weight: var(--global-typography-ui-body-font-weight);
+  font-size: var(--global-typography-ui-body-font-size);
+  line-height: var(--global-typography-ui-body-line-height);
+  font-feature-settings:
+    "liga" off,
+    "clig" off,
+    "ss04" on;
+  color: var(--on-flat-active-color);
+}
+
+.wrapper .visible-wrapper {
+    display: flex;
+    align-items: center;
+    width: 100%;
+    height: 100%;
+    border-radius: var(--global-border-radius-border-radius-base);
+    padding: 0
+      var(--menu-navigation-components-tree-navigation-item-padding-horizontal);
+  }
+
+/*
+   * A checked row is not re-selectable, so it stays on the amplified enabled
+   * style with no hover/pressed feedback.
+   */
+
+.wrapper.checked {
+            cursor: pointer;
+}
+
+.wrapper.checked:focus {
+            outline: none;
+}
+
+.wrapper.checked .visible-wrapper {
+            border-color: var(--amplified-enabled-border-color);
+            background-color: var(--amplified-enabled-background-color);
+            border-width: 1px;
+            border-style: solid;
+            cursor: pointer;
+            --base-border-color: var(--amplified-enabled-border-color);
+            --base-background-color: var(--amplified-enabled-background-color);
+}
+
+.wrapper.checked.activated .visible-wrapper {
+            border-color: var(--amplified-activated-border-color);
+            background-color: var(--amplified-activated-background-color);
+            --base-border-color: var(--amplified-activated-border-color);
+            --base-background-color: var(--amplified-activated-background-color);
+}
+
+@media (hover:hover) {
+
+.wrapper.checked:hover .visible-wrapper {
+                        border-color: color-mix(in srgb, var(--amplified-hover-border-color) calc(var(--obc-can-hover) * 100%), var(--base-border-color));
+                        background-color: color-mix(in srgb, var(--amplified-hover-background-color) calc(var(--obc-can-hover) * 100%), var(--base-background-color));
+            }
+}
+
+.wrapper.checked:active .visible-wrapper {
+            border-color: var(--amplified-pressed-border-color);
+            background-color: var(--amplified-pressed-background-color);
+}
+
+.wrapper.checked:focus-visible .visible-wrapper {
+            outline-color: var(--border-focus-color);
+            outline-width: var(--global-size-spacing-border-weight-focusframe);
+            outline-style: solid;
+            border-color: var(--container-global-color);
+            z-index: 1;
+}
+
+.wrapper.checked:disabled .visible-wrapper {
+            border-color: var(--amplified-disabled-border-color);
+            background-color: var(--amplified-disabled-background-color);
+            cursor: not-allowed;
+            color: var(--on-amplified-disabled-color) !important;
+}
+
+.wrapper.checked.disabled .visible-wrapper {
+            border-color: var(--amplified-disabled-border-color);
+            background-color: var(--amplified-disabled-background-color);
+            cursor: not-allowed;
+            color: var(--on-amplified-disabled-color) !important;
+}
+
+.wrapper.checked:disabled {
+            cursor: not-allowed;
+}
+
+.wrapper.checked.disabled {
+            cursor: not-allowed;
+}
+
+.wrapper.checked {
+    cursor: default;
+}
+
+.wrapper.checked .visible-wrapper,.wrapper.checked:hover .visible-wrapper,.wrapper.checked:active .visible-wrapper {
+      background-color: var(--amplified-enabled-background-color);
+      border-color: var(--amplified-enabled-border-color);
+    }
+
+.wrapper.checked .label {
+      font-family: var(--global-typography-font-family);
+      font-weight: var(--global-typography-ui-body-active-font-weight);
+      font-size: var(--global-typography-ui-body-active-font-size);
+      line-height: var(--global-typography-ui-body-active-line-height);
+      font-feature-settings:
+    "liga" off,
+    "clig" off,
+    "ss04" on;
+      color: var(--on-flat-active-color);
+    }
+
+.wrapper.checked .leading-icon {
+      color: var(--on-amplified-active-color);
+    }
+
+/* Guide lines are tree structure, not row state, so they do not dim here. */
+
+.wrapper.disabled {
+    color: var(--on-flat-disabled-color);
+  }
+
+.wrapper.disabled .leading-icon {
+      color: var(--on-flat-disabled-color);
+    }
+
+.tree-node-row {
+  display: flex;
+  align-items: center;
+  height: 100%;
+  flex-shrink: 0;
+}
+
+.branch {
+  position: relative;
+  height: 100%;
+  width: var(--menu-navigation-components-branch-width);
+  flex-shrink: 0;
+}
+
+/*
+ * Guide lines all run on a rail at 75% of each 32px column and share the faint
+ * outline color. Verticals and the dropdown bleed 1px past the row edges so they
+ * cross the visible-wrapper's 1px transparent flat border and meet the adjacent
+ * row's line with no seam gap.
+ */
+
+.branch-vertical {
+  position: absolute;
+  top: -1px;
+  bottom: -1px;
+  left: 75%;
+  width: 1px;
+  transform: translateX(-0.5px);
+  background: var(--border-outline-color);
+}
+
+.branch-horizontal {
+  position: absolute;
+  top: 50%;
+  transform: translateY(-0.5px);
+  left: 75%;
+  right: 0;
+  height: 1px;
+  background: var(--border-outline-color);
+}
+
+/*
+ * Corner (└, last child): a single bordered box replaces the straight rects so
+ * the bend can be rounded. The box bleeds 1px past the column's right edge so its
+ * bottom border overlaps the terminal connector with no break, and translateY
+ * drops it 0.5px so that border lands on the connector's pixel row (else the join
+ * reads as a \`---___\` step). The radius stays tight — the stub is only 8px, so a
+ * larger fillet would consume the whole flat run.
+ */
+
+.branch-corner .branch-vertical,
+.branch-corner .branch-horizontal {
+  display: none;
+}
+
+.branch-corner .branch-elbow {
+  position: absolute;
+  top: -1px;
+  bottom: 50%;
+  left: 75%;
+  right: -1px;
+  transform: translate(-0.5px, 0.5px);
+  border-left: 1px solid var(--border-outline-color);
+  border-bottom: 1px solid var(--border-outline-color);
+  border-bottom-left-radius: var(
+    --menu-navigation-components-branch-corner-radius,
+    2px
+  );
+}
+
+.terminal {
+  position: relative;
+  height: 100%;
+  width: var(--global-size-spacing-touch-target-min);
+  flex-shrink: 0;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+/* Stub entering the terminal, continuing the guide line up to the chevron gap. */
+
+.terminal-connector {
+  position: absolute;
+  top: 50%;
+  transform: translateY(-0.5px);
+  left: 0;
+  width: 25%;
+  height: 1px;
+  background: var(--border-outline-color);
+}
+
+/* On a leaf (no chevron) the stub runs further, stopping ~13px before the icon. */
+
+.terminal:not(:has(.chevron)) .terminal-connector {
+  width: calc(100% - 13px);
+}
+
+/* Descends from below the chevron to connect an expanded node to its children. */
+
+.terminal-dropdown {
+  position: absolute;
+  left: 50%;
+  transform: translateX(-0.5px);
+  top: 75%;
+  bottom: -1px;
+  width: 1px;
+  background: var(--border-outline-color);
+}
+
+/* Visual expand/collapse indicator only — not a separate control. */
+
+.chevron {
+  position: relative;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: var(--menu-navigation-components-tree-navigation-item-icon-size);
+  height: var(--menu-navigation-components-tree-navigation-item-icon-size);
+  color: var(--element-neutral-color);
+  transition: transform 100ms ease-in-out;
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .chevron {
+    transition: none;
+  }
+}
+
+.wrapper.disabled .chevron {
+  color: var(--on-flat-disabled-color);
+}
+
+:host([expanded]) .chevron {
+  transform: rotate(90deg);
+}
+
+/* Alert-header marker for non-regular terminal types, at the terminal's top-right. */
+
+.terminal-header {
+  position: absolute;
+  inset: 0;
+  display: flex;
+  justify-content: flex-end;
+  align-items: flex-start;
+  padding: var(--menu-navigation-components-terminal-padding-aggregated-icon);
+  color: var(--element-neutral-color);
+  pointer-events: none;
+}
+
+.terminal-header > * {
+  width: var(--menu-navigation-components-tree-navigation-item-icon-size);
+  height: var(--menu-navigation-components-tree-navigation-item-icon-size);
+}
+
+.wrapper.disabled .terminal-header {
+  color: var(--on-flat-disabled-color);
+}
+
+.label-container {
+  display: flex;
+  flex: 1;
+  gap: var(
+    --menu-navigation-components-tree-navigation-item-padding-horizontal
+  );
+  align-items: center;
+  min-width: 0;
+  padding-right: var(
+    --menu-navigation-components-tree-navigation-item-padding-horizontal
+  );
+}
+
+.leading-icon {
+  position: relative;
+  flex-shrink: 0;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: var(--menu-navigation-components-tree-navigation-item-icon-size);
+  height: var(--menu-navigation-components-tree-navigation-item-icon-size);
+  color: var(--on-flat-neutral-color);
+}
+
+::slotted([slot="icon"]) {
+  display: block;
+  width: var(--menu-navigation-components-tree-navigation-item-icon-size);
+  height: var(--menu-navigation-components-tree-navigation-item-icon-size);
+}
+
+.label {
+  flex: 1;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  min-width: 0;
+}
+
+.alert-badge {
+  flex-shrink: 0;
+}
+`;
+export {
+  componentStyle as default
+};
+//# sourceMappingURL=tree-navigation-item.css.js.map

package/dist/components/tree-navigation-item/tree-navigation-item.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tree-navigation-item.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/tree-navigation-item/tree-navigation-item.d.ts

@@ -0,0 +1,160 @@
+import { LitElement } from 'lit';
+import '../../icons/icon-chevron-right-google.js';
+import '../../icons/icon-alert-header-aggregated-iec.js';
+import '../../icons/icon-alert-header-group-iec.js';
+import '../badge/badge.js';
+/**
+ * Guide line drawn for one indentation column. Normally computed by
+ * `obc-tree-navigation`; rarely set by hand.
+ *
+ * - `straight`: vertical pass-through (`│`)
+ * - `intersection`: vertical + stub for a non-last child (`├`)
+ * - `corner`: half vertical + stub for the last child (`└`)
+ * - `blank`: empty spacer
+ */
+export declare enum TreeBranchType {
+    straight = "straight",
+    intersection = "intersection",
+    corner = "corner",
+    blank = "blank"
+}
+/**
+ * Terminal type for a tree item, controlling the alert-header marker shown in
+ * the terminal (top-right, by the chevron).
+ *
+ * - `regular`: No marker — a plain expand/collapse terminal.
+ * - `aggregatedHeader`: Shows the aggregated alert-header marker, indicating the
+ *   node aggregates alerts from its descendants.
+ * - `groupHeader`: Shows the group alert-header marker, indicating a grouped set
+ *   of alerts beneath the node.
+ */
+export declare enum TreeTerminalType {
+    regular = "regular",
+    aggregatedHeader = "aggregated-header",
+    groupHeader = "group-header"
+}
+/**
+ * `<obc-tree-navigation-item>` – A single row in a tree- or file-explorer-style
+ * navigation list, with indentation guide lines, an optional expand/collapse
+ * chevron, a leading icon, a label, and an optional alert badge.
+ *
+ * Each row represents one node in a hierarchy. Depth is expressed through the
+ * `branches` array: one entry per ancestor level, each describing the guide line
+ * to draw for that level. The expand chevron lets a node disclose its children,
+ * emitting `expand-toggle` so a parent can manage the open/closed state.
+ *
+ * ## Features
+ * - **Indentation guides:** Render one 32px guide column per `branches` entry —
+ *   pass-through vertical lines for ancestors that continue, and an elbow
+ *   (`intersection`) connecting the row to its parent.
+ * - **Expand/collapse:** Set `expandable` to show a chevron that rotates when
+ *   `expanded`. The chevron is a visual indicator only — activating the row
+ *   fires `expand-toggle` with the next state; manage `expanded` in response.
+ *   When `expanded`, a vertical guide descends from the chevron to connect to
+ *   the revealed child rows below.
+ * - **Terminal type:** `terminalType` adds an alert-header marker in the terminal
+ *   (`aggregatedHeader` or `groupHeader`), indicating the node heads a set of
+ *   aggregated or grouped alerts.
+ * - **Leading icon:** Provide an icon via the `icon` slot (shown when
+ *   `hasLeadingIcon`).
+ * - **Alert badge:** A trailing counter badge (e.g. an alarm count), toggled with
+ *   `hasAlertBadge` and configured via `alertCount` and `alertType`.
+ * - **Checked state:** `checked` highlights the current selection using the
+ *   amplified elevation style. A checked row is the current item and is not
+ *   re-selectable — it shows no hover/pressed feedback and fires no `click` or
+ *   navigation. An expandable checked row still toggles (fires `expand-toggle`),
+ *   so a group that is the current selection can be opened and closed. It stays
+ *   keyboard-focusable.
+ * - **Link or button:** Set `href` to render the row as a link; otherwise it acts
+ *   as a button.
+ *
+ * ## Usage Guidelines
+ * - Use for hierarchical navigation such as file trees, layer panels, or nested
+ *   menus. For flat navigation lists, use `obc-navigation-item` instead.
+ * - Build `branches` from the row's ancestry: `intersection` for the level that
+ *   owns this row, `straight` for ancestors with siblings still to come, and
+ *   `blank` for ancestors whose subtrees have ended. When placed inside
+ *   `obc-tree-navigation`, the container computes `branches` automatically.
+ * - Keep one row `checked` at a time within a tree to mark the current location.
+ * - Leaf nodes should leave `expandable` as `false` so no chevron is shown.
+ *
+ * ## Slots
+ *
+ * | Slot Name      | Renders When...                 | Purpose                                                                 |
+ * |----------------|---------------------------------|-------------------------------------------------------------------------|
+ * | icon           | `hasLeadingIcon` is true        | Leading icon for the row, e.g. `<obi-placeholder slot="icon">`.         |
+ *
+ * @slot icon - Leading icon slot (shown when `hasLeadingIcon` is true).
+ * @fires expand-toggle {CustomEvent<boolean>} Fired when an expandable row is activated; detail is the next `expanded` value.
+ * @fires click {CustomEvent<void>} Fired when the row is activated.
+ */
+export declare class ObcTreeNavigationItem extends LitElement {
+    /** The text label displayed for the row. */
+    label: string;
+    /**
+     * Guide line for each ancestor level, outermost first; one 32px column per
+     * entry. Computed by `obc-tree-navigation` — rarely set by hand.
+     */
+    branches: TreeBranchType[];
+    /** Whether the row shows an expand/collapse chevron. Leave false for leaf nodes. */
+    expandable: boolean;
+    /** Whether the node is expanded. Rotates the chevron and sets `aria-expanded`. */
+    expanded: boolean;
+    /**
+     * Whether the row is the current selection. Applies the amplified style and
+     * makes the row inert to re-selection (no hover/pressed feedback, no `click`
+     * or navigation); it remains keyboard-focusable. An expandable checked row
+     * still fires `expand-toggle` so a selected group can open and close.
+     */
+    checked: boolean;
+    /** Disables the row, removing it from the tab order and dimming its appearance. */
+    disabled: boolean;
+    /**
+     * Whether the row is in the tab order. A tree container manages this as a
+     * roving tabindex (one row focusable at a time); standalone rows stay tabbable.
+     */
+    focusable: boolean;
+    /**
+     * Whether the row shows a leading icon (provided via the `icon` slot).
+     */
+    hasLeadingIcon: boolean;
+    /**
+     * Terminal type, controlling the alert-header marker shown in the terminal.
+     * One of `regular` (default), `aggregated-header`, or `group-header`.
+     */
+    terminalType: string;
+    /** Whether a trailing alert counter badge is shown. */
+    hasAlertBadge: boolean;
+    /** The number shown in the alert badge when `hasAlertBadge` is true. */
+    alertCount: number;
+    /** The severity/type of the alert badge. One of the `obc-badge` types (default `alarm`). */
+    alertType: string;
+    /**
+     * The URL to navigate to when the row is activated. If set, the row renders as
+     * a link; otherwise it acts as a button.
+     */
+    href: string | undefined;
+    private wrapperElement?;
+    /** Focuses the row's interactive wrapper (the host itself is not focusable). */
+    focus(options?: FocusOptions): void;
+    /** A root-level row has no ancestor columns, so it draws no connector lines. */
+    private get isRoot();
+    /**
+     * All ancestor columns are blank spacers — the row is indented but draws no
+     * guide lines, so the terminal connector and dropdown are suppressed too.
+     */
+    private get isBlankAncestry();
+    private activate;
+    private handleKeydown;
+    private renderBranch;
+    private renderTerminalHeader;
+    render(): import('lit-html').TemplateResult<1>;
+    static styles: import('lit').CSSResult;
+}
+export type ObcTreeNavigationItemExpandToggleEvent = CustomEvent<boolean>;
+declare global {
+    interface HTMLElementTagNameMap {
+        'obc-tree-navigation-item': ObcTreeNavigationItem;
+    }
+}
+//# sourceMappingURL=tree-navigation-item.d.ts.map

package/dist/components/tree-navigation-item/tree-navigation-item.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tree-navigation-item.d.ts","sourceRoot":"","sources":["../../../src/components/tree-navigation-item/tree-navigation-item.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAA2B,MAAM,KAAK,CAAC;AAMzD,OAAO,0CAA0C,CAAC;AAClD,OAAO,iDAAiD,CAAC;AACzD,OAAO,4CAA4C,CAAC;AACpD,OAAO,mBAAmB,CAAC;AAG3B;;;;;;;;GAQG;AACH,oBAAY,cAAc;IACxB,QAAQ,aAAa;IACrB,YAAY,iBAAiB;IAC7B,MAAM,WAAW;IACjB,KAAK,UAAU;CAChB;AAED;;;;;;;;;GASG;AACH,oBAAY,gBAAgB;IAC1B,OAAO,YAAY;IACnB,gBAAgB,sBAAsB;IACtC,WAAW,iBAAiB;CAC7B;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAsDG;AACH,qBACa,qBAAsB,SAAQ,UAAU;IACnD,4CAA4C;IAClB,KAAK,SAAe;IAE9C;;;OAGG;IACsB,QAAQ,EAAE,cAAc,EAAE,CAAM;IAEzD,oFAAoF;IACzD,UAAU,UAAS;IAE9C,kFAAkF;IACxC,QAAQ,UAAS;IAE3D;;;;;OAKG;IACuC,OAAO,UAAS;IAE1D,mFAAmF;IACzC,QAAQ,UAAS;IAE3D;;;OAGG;IAC0C,SAAS,UAAQ;IAE9D;;OAEG;IAC0C,cAAc,UAAQ;IAEnE;;;OAGG;IACuB,YAAY,EAAE,MAAM,CAA4B;IAE1E,uDAAuD;IAC5B,aAAa,UAAS;IAEjD,wEAAwE;IAC9C,UAAU,SAAK;IAEzC,4FAA4F;IAClE,SAAS,EAAE,MAAM,CAAmB;IAE9D;;;OAGG;IACuB,IAAI,EAAE,MAAM,GAAG,SAAS,CAAC;IAEhC,OAAO,CAAC,cAAc,CAAC,CAAc;IAExD,gFAAgF;IAChE,KAAK,CAAC,OAAO,CAAC,EAAE,YAAY,GAAG,IAAI;IAInD,gFAAgF;IAChF,OAAO,KAAK,MAAM,GAEjB;IAED;;;OAGG;IACH,OAAO,KAAK,eAAe,GAK1B;IAED,OAAO,CAAC,QAAQ;IAiBhB,OAAO,CAAC,aAAa;IAOrB,OAAO,CAAC,YAAY;IAkBpB,OAAO,CAAC,oBAAoB;IAcnB,MAAM;IA2Df,OAAgB,MAAM,0BAA6B;CACpD;AAED,MAAM,MAAM,sCAAsC,GAAG,WAAW,CAAC,OAAO,CAAC,CAAC;AAE1E,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,0BAA0B,EAAE,qBAAqB,CAAC;KACnD;CACF"}