@sebgroup/green-core 0.0.0-v-angular-20250113082841

package/primitives/listbox/option.d.ts

@@ -0,0 +1,52 @@
+import { GdsElement } from '../../gds-element';
+import '../../components/icon/icons/checkmark';
+export interface OptionsContainer extends HTMLElement {
+    options: GdsOption[];
+    multiple: boolean;
+}
+declare const GdsOption_base: (new (...args: any[]) => import("lit").LitElement) & typeof GdsElement;
+/**
+ * @element gds-option
+ *
+ * A listbox option is an option in a listbox widget.
+ * This primitive corresponds to the aria `option` role: https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/option_role
+ *
+ * Can be used together with the `gds-listbox` primitive.
+ *
+ * @slot - The default slot. Custom content can be used to display the option.
+ *
+ * @event gds-select - Fired when the option is selected.
+ * @event gds-blur - Fired when the option loses focus.
+ * @event gds-focus - Fired when the option gains focus.
+ */
+export declare class GdsOption extends GdsOption_base {
+    #private;
+    static styles: (import("lit").CSSResult | import("lit").CSSResult[])[];
+    /**
+     * The value of the option.
+     */
+    value: any;
+    /**
+     * Controls whether the option is visible or not.
+     */
+    get hidden(): boolean;
+    set hidden(value: string | boolean);
+    /**
+     * Returns true if the option is selected.
+     * Setting this property will select or unselect the option.
+     */
+    selected: boolean;
+    /**
+     * Sets this option as a placeholder.
+     * A placehodler option does not have a value and will act as the default option.
+     *
+     * In a multiple select listbox, placeholder options will not be rendered in the list.
+     */
+    isPlaceholder: boolean;
+    constructor();
+    connectedCallback(): void;
+    get parentElement(): OptionsContainer;
+    private _handlePlaceholderStatusChange;
+    render(): any;
+}
+export {};

package/primitives/listbox/option.js

@@ -0,0 +1,19 @@
+import {
+  GdsOption
+} from "../../chunks/chunk.ACK4BD6H.js";
+import "../../chunks/chunk.GYFUC5DX.js";
+import "../../chunks/chunk.43JUKB53.js";
+import "../../chunks/chunk.K6WND5FJ.js";
+import "../../chunks/chunk.WM7HBMMV.js";
+import "../../chunks/chunk.J35HKXK4.js";
+import "../../chunks/chunk.TYGMNHNO.js";
+import "../../chunks/chunk.LUKJEJDB.js";
+import "../../chunks/chunk.IYBYOHJ2.js";
+import "../../chunks/chunk.YO24ZYAD.js";
+import "../../chunks/chunk.LQSWYCMZ.js";
+import "../../chunks/chunk.MLXMQIEV.js";
+import "../../chunks/chunk.WVKINQII.js";
+import "../../chunks/chunk.SEHSDSX2.js";
+export {
+  GdsOption
+};

package/primitives/listbox/option.styles.d.ts

@@ -0,0 +1,2 @@
+declare const style: import("lit").CSSResult;
+export default style;

package/primitives/menu/index.d.ts

@@ -0,0 +1 @@
+export * from './menu';

package/primitives/menu/index.js

@@ -0,0 +1,16 @@
+import "../../chunks/chunk.UF6IEONX.js";
+import {
+  GdsMenu
+} from "../../chunks/chunk.N23HPMSU.js";
+import "../../chunks/chunk.MCDTEWE3.js";
+import "../../chunks/chunk.E62NOHQC.js";
+import "../../chunks/chunk.43JUKB53.js";
+import "../../chunks/chunk.J35HKXK4.js";
+import "../../chunks/chunk.YO24ZYAD.js";
+import "../../chunks/chunk.LQSWYCMZ.js";
+import "../../chunks/chunk.MLXMQIEV.js";
+import "../../chunks/chunk.WVKINQII.js";
+import "../../chunks/chunk.SEHSDSX2.js";
+export {
+  GdsMenu
+};

package/primitives/menu/menu-heading.d.ts

@@ -0,0 +1,6 @@
+import { GdsElement } from '../../gds-element';
+export declare class GdsMenuHeading extends GdsElement {
+    static styles: import("lit").CSSResult;
+    connectedCallback(): void;
+    render(): import("lit-html").TemplateResult<1>;
+}

package/primitives/menu/menu-heading.js

@@ -0,0 +1,12 @@
+import {
+  GdsMenuHeading
+} from "../../chunks/chunk.QZGU6HJL.js";
+import "../../chunks/chunk.J35HKXK4.js";
+import "../../chunks/chunk.YO24ZYAD.js";
+import "../../chunks/chunk.LQSWYCMZ.js";
+import "../../chunks/chunk.MLXMQIEV.js";
+import "../../chunks/chunk.WVKINQII.js";
+import "../../chunks/chunk.SEHSDSX2.js";
+export {
+  GdsMenuHeading
+};

package/primitives/menu/menu-heading.styles.d.ts

@@ -0,0 +1,2 @@
+declare const style: import("lit").CSSResult;
+export default style;

package/primitives/menu/menu-item.d.ts

@@ -0,0 +1,12 @@
+import { GdsElement } from '../../gds-element';
+declare const GdsMenuItem_base: (new (...args: any[]) => import("lit").LitElement) & typeof GdsElement;
+/**
+ * @element gds-menu-item
+ */
+export declare class GdsMenuItem extends GdsMenuItem_base {
+    #private;
+    static styles: import("lit").CSSResult[];
+    connectedCallback(): void;
+    render(): any;
+}
+export {};

package/primitives/menu/menu-item.js

@@ -0,0 +1,13 @@
+import {
+  GdsMenuItem
+} from "../../chunks/chunk.MCDTEWE3.js";
+import "../../chunks/chunk.43JUKB53.js";
+import "../../chunks/chunk.J35HKXK4.js";
+import "../../chunks/chunk.YO24ZYAD.js";
+import "../../chunks/chunk.LQSWYCMZ.js";
+import "../../chunks/chunk.MLXMQIEV.js";
+import "../../chunks/chunk.WVKINQII.js";
+import "../../chunks/chunk.SEHSDSX2.js";
+export {
+  GdsMenuItem
+};

package/primitives/menu/menu.d.ts

@@ -0,0 +1,24 @@
+import { GdsElement } from '../../gds-element';
+import { ListboxKbNavigation } from '../../utils/controllers/listbox-kb-nav-controller';
+import type { GdsMenuItem } from '../../primitives/menu/menu-item';
+import '../../primitives/menu/menu-item';
+/**
+ * @element gds-menu
+ * @internal
+ *
+ * A menu generally represents a grouping of common actions or functions that the user can invoke.
+ * This primitive corresponds to the aria menu role: https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/menu_role
+ *
+ * * @slot - The default slot. Only `gds-menu-item` elements should be used here.
+ */
+export declare class GdsMenu extends GdsElement implements ListboxKbNavigation {
+    #private;
+    constructor();
+    connectedCallback(): void;
+    get navigableItems(): GdsMenuItem[];
+    /**
+     * Focuses the first item in the menu.
+     */
+    focus(): void;
+    render(): any;
+}

package/primitives/menu/menu.js

@@ -0,0 +1,15 @@
+import {
+  GdsMenu
+} from "../../chunks/chunk.N23HPMSU.js";
+import "../../chunks/chunk.MCDTEWE3.js";
+import "../../chunks/chunk.E62NOHQC.js";
+import "../../chunks/chunk.43JUKB53.js";
+import "../../chunks/chunk.J35HKXK4.js";
+import "../../chunks/chunk.YO24ZYAD.js";
+import "../../chunks/chunk.LQSWYCMZ.js";
+import "../../chunks/chunk.MLXMQIEV.js";
+import "../../chunks/chunk.WVKINQII.js";
+import "../../chunks/chunk.SEHSDSX2.js";
+export {
+  GdsMenu
+};

package/primitives/ripple/index.d.ts

@@ -0,0 +1 @@
+export * from './ripple';

package/primitives/ripple/index.js

@@ -0,0 +1,13 @@
+import "../../chunks/chunk.TX64TTBN.js";
+import {
+  Ripple
+} from "../../chunks/chunk.NT6Q2HAU.js";
+import "../../chunks/chunk.LUKJEJDB.js";
+import "../../chunks/chunk.IYBYOHJ2.js";
+import "../../chunks/chunk.YO24ZYAD.js";
+import "../../chunks/chunk.MLXMQIEV.js";
+import "../../chunks/chunk.WVKINQII.js";
+import "../../chunks/chunk.SEHSDSX2.js";
+export {
+  Ripple
+};

package/primitives/ripple/ripple.d.ts

@@ -0,0 +1,7 @@
+import { LitElement } from 'lit';
+export declare class Ripple extends LitElement {
+    static styles: (import("lit").CSSResult | import("lit").CSSResult[])[];
+    private _rippleEl?;
+    render(): import("lit-html").TemplateResult<1>;
+    onmousedown: (e: MouseEvent) => void;
+}

package/primitives/ripple/ripple.js

@@ -0,0 +1,12 @@
+import {
+  Ripple
+} from "../../chunks/chunk.NT6Q2HAU.js";
+import "../../chunks/chunk.LUKJEJDB.js";
+import "../../chunks/chunk.IYBYOHJ2.js";
+import "../../chunks/chunk.YO24ZYAD.js";
+import "../../chunks/chunk.MLXMQIEV.js";
+import "../../chunks/chunk.WVKINQII.js";
+import "../../chunks/chunk.SEHSDSX2.js";
+export {
+  Ripple
+};

package/scoping.d.ts

@@ -0,0 +1 @@
+export * from './utils/helpers/custom-element-scoping';

package/scoping.js

@@ -0,0 +1,20 @@
+import "./chunks/chunk.YO24ZYAD.js";
+import {
+  ScopedElementRegistry,
+  VER_SUFFIX,
+  gdsCustomElement,
+  getScopedTagName,
+  getUnscopedTagName,
+  html,
+  htmlTemplateTagFactory
+} from "./chunks/chunk.MLXMQIEV.js";
+import "./chunks/chunk.SEHSDSX2.js";
+export {
+  ScopedElementRegistry,
+  VER_SUFFIX,
+  gdsCustomElement,
+  getScopedTagName,
+  getUnscopedTagName,
+  html,
+  htmlTemplateTagFactory
+};

package/setup-jest.js

@@ -0,0 +1,51 @@
+global.CSSStyleSheet = function () {}
+global.CSSStyleSheet.prototype.replaceSync = (k) => false
+
+global.HTMLElement.prototype.attachInternals = () => {
+  return new global.ElementInternals()
+}
+global.HTMLElement.prototype.closest = () => {
+  return null
+}
+
+global.ElementInternals = function () {}
+global.ElementInternals.prototype.setValidity = () => {}
+global.ElementInternals.prototype.setFormValue = () => {}
+global.ElementInternals.prototype.validity = () => {
+  valid: true
+}
+global.ElementInternals.prototype.checkValidity = () => {}
+global.ElementInternals.prototype.reportValidity = () => {}
+global.ElementInternals.prototype.willValidate = () => {}
+global.ElementInternals.prototype.validationMessage = ''
+
+window.matchMedia = () => {
+  return {
+    matches: false,
+    addEventListener: () => {},
+    removeEventListener: () => {},
+  }
+}
+
+global.HTMLElement.prototype.close = () => {}
+
+Object.defineProperty(window, 'matchMedia', {
+  writable: true,
+  value: jest.fn().mockImplementation((query) => ({
+    matches: false,
+    media: query,
+    onchange: null,
+    addListener: jest.fn(), // deprecated
+    removeListener: jest.fn(), // deprecated
+    addEventListener: jest.fn(),
+    removeEventListener: jest.fn(),
+    dispatchEvent: jest.fn(),
+  })),
+})
+
+global.IntersectionObserver = class IntersectionObserver {
+  constructor() {}
+  observe() {}
+  disconnect() {}
+  unobserve() {}
+}

package/tokens.style.d.ts

@@ -0,0 +1,4 @@
+import colorsDark from '../../../dist/libs/tokens/internal/dark.css?inline';
+import colorsLight from '../../../dist/libs/tokens/internal/light.css?inline';
+declare const tokens: import("lit").CSSResult[];
+export { tokens, colorsLight, colorsDark };

package/transitional-styles.d.ts

@@ -0,0 +1 @@
+export * from './utils/transitional-styles/transitional-styles';

package/transitional-styles.js

@@ -0,0 +1,11 @@
+import {
+  TransitionalStyles,
+  registerTransitionalStyles
+} from "./chunks/chunk.J35HKXK4.js";
+import "./chunks/chunk.MLXMQIEV.js";
+import "./chunks/chunk.WVKINQII.js";
+import "./chunks/chunk.SEHSDSX2.js";
+export {
+  TransitionalStyles,
+  registerTransitionalStyles
+};

package/utils/controllers/dynamic-styles-controller.d.ts

@@ -0,0 +1,43 @@
+import { CSSResult, ReactiveController } from 'lit';
+import { GdsElement } from '../../gds-element';
+export declare class DynamicStylesController implements ReactiveController {
+    #private;
+    host: GdsElement;
+    constructor(host: GdsElement);
+    hostConnected(): void;
+    /**
+     * Checks if the controller has a particular key.
+     *
+     * @param key - The style key to check.
+     */
+    has(key: string): boolean;
+    /**
+     * Injects CSS into the host element's shadow root. The key is used to
+     * identify the styles and can be used to update the styles later. If
+     * you need to clear style for a particular key, you can call `inject`
+     * with an empty string as the `styles` parameter.
+     *
+     * @param key - A unique key to identify the styles.
+     * @param cssResult - The CSSResult to inject.
+     */
+    inject(key: string, cssResult: CSSResult): void;
+    /**
+     * Clears the styles for a particular key.
+     *
+     * @param key - The key of the styles to clear.
+     */
+    clear(key: string): void;
+    /**
+     * Clears all styles of the component, including any initial styles.
+     */
+    clearAll(): void;
+    /**
+     * Clears the initial styles of the component, but keeps any injected styles.
+     */
+    clearInitial(): void;
+    /**
+     * Restores the initial styles of the component, and keeps any injected styles.
+     */
+    restoreInitial(): void;
+}
+export declare function supportsConstructedStylesheets(): boolean;

package/utils/controllers/listbox-kb-nav-controller.d.ts

@@ -0,0 +1,25 @@
+import { LitElement, ReactiveController } from 'lit';
+/**
+ * Components that use `ListboxKbNavController` needs to implement this interface.
+ */
+export interface ListboxKbNavigation extends LitElement {
+    /**
+     * Should return a list of navigable HTMLElements.
+     */
+    navigableItems: HTMLElement[];
+}
+/**
+ * Controller that handles keyboard navigation for `ListboxKbNavigation` compatible components.
+ * @internal
+ *
+ * The purpose of this controller is to provide a reusable implementation of the keyboard
+ * interaction patterns decribed here:
+ * https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/listbox_role
+ */
+export declare class ListboxKbNavController implements ReactiveController {
+    #private;
+    host: ListboxKbNavigation;
+    constructor(host: ListboxKbNavigation);
+    hostConnected(): void;
+    hostDisconnected(): void;
+}

package/utils/decorators/index.d.ts

@@ -0,0 +1,3 @@
+export * from './watch';
+export * from './observe-light-dom';
+export * from './watch-media-query';

package/utils/decorators/observe-light-dom.d.ts

@@ -0,0 +1,7 @@
+import type { LitElement } from 'lit';
+type Handler = () => void;
+/**
+ * Runs when the light DOM children of the component changes.
+ */
+export declare function observeLightDOM(observerConfig?: MutationObserverInit): <ElemClass extends LitElement>(proto: ElemClass, _propertyKey: string, descriptor: TypedPropertyDescriptor<Handler>) => void;
+export {};

package/utils/decorators/resize-observer.d.ts

@@ -0,0 +1,15 @@
+import type { LitElement } from 'lit';
+type Handler = () => void;
+/**
+ * Runs when the size of the component changes.
+ *
+ * Usage:
+ * ```javascript
+ * \@resizeObserver()
+ * handleResize() {
+ *  // Do some layout calculation or something
+ * }
+ * ```
+ */
+export declare function resizeObserver(): <ElemClass extends LitElement>(proto: ElemClass, propertyKey: string, descriptor: TypedPropertyDescriptor<Handler>) => void;
+export {};

package/utils/decorators/style-expression-property.d.ts

@@ -0,0 +1,32 @@
+import { GdsElement } from 'src/gds-element';
+/**
+ * Options for `@styleExpressionProperty`.
+ */
+export type StyleExpressionPropertyOptions = {
+    /** The DOM-attribute to bind to. Same as the attribute option on Lits @property decorator */
+    attribute?: string;
+    /** The selector to use for the CSS rule. Defaults to `:host` */
+    selector?: string;
+    /** The CSS property to set. Defaults to the property key, i.e if the decorator is
+     * attached to a property named `padding`, the default name of the CSS property will
+     * also be `padding`. This option overrides that. */
+    property?: string;
+    /** A function that takes a value and returns a string. Defaults to `(value) => 'var(--gds-space-${value})'`
+     * This can be used to resolve the values into CSS variables for example. */
+    valueTemplate?: (value: string) => string;
+    /** A function that takes a property name and an array of values and returns a string. Defaults to
+     * `(property, values) => `${property}: ${values.join(' ')};`
+     * This can be used to customize the generated CSS. This runs after the `valueTemplate` is executed. */
+    styleTemplate?: (property: string, values: string[]) => string;
+    /** Set this to something unique if the property suffers from caching issues.
+     * This can typically happen if a identically named combo of property and selector is used in multiple
+     * components with different style or value templates.
+     */
+    cacheOverrideKey?: string;
+};
+/**
+ * A decorator that can be used to create a Style Expression Property.
+ *
+ * @param options Options for the decorator.
+ */
+export declare function styleExpressionProperty(options?: StyleExpressionPropertyOptions): <ElemClass extends GdsElement>(proto: ElemClass, descriptor: PropertyKey) => void;

package/utils/decorators/watch-media-query.d.ts

@@ -0,0 +1,31 @@
+import type { LitElement } from 'lit';
+type Handler = (matches: boolean) => void;
+/**
+ * Media queries expressing standard breakpoints.
+ * TODO: These should probably be imported from somehere, so that they are always in sync with CSS.
+ */
+export declare const standardBreakpoints: {
+    sm: string;
+    md: string;
+    lg: string;
+    xl: string;
+};
+/**
+ * Runs when the match state of the specified media query changes.
+ *
+ * @param q The media query to watch.
+ *
+ * Usage:
+ * ```javascript
+ * \@watchMediaQuery('(max-width: 576px)')
+ * handleMobileLayout(matches) {
+ *  if (matches) {
+ *   // Do something when the media query matches
+ *  } else
+ *   // Do something when the media query no longer matches
+ *  }
+ * }
+ * ```
+ */
+export declare function watchMediaQuery(q: string): <ElemClass extends LitElement>(proto: ElemClass, _propertyKey: string, descriptor: TypedPropertyDescriptor<Handler>) => void;
+export {};

package/utils/decorators/watch.d.ts

@@ -0,0 +1,23 @@
+import type { LitElement } from 'lit';
+type UpdateHandler = (prev?: unknown, next?: unknown) => void;
+interface WatchOptions {
+    /**
+     * If true, will only start watching after the initial update/render
+     */
+    waitUntilFirstUpdate?: boolean;
+}
+/**
+ * Runs when observed properties change, e.g. @property or @state, but before the component updates. To wait for an
+ * update to complete after a change occurs, use `await this.updateComplete` in the handler. To start watching after the
+ * initial update/render, use `{ waitUntilFirstUpdate: true }` or `this.hasUpdated` in the handler.
+ *
+ * Usage:
+ * ```javascript
+ * \@watch('propName')
+ * handlePropChange(oldValue, newValue) {
+ *   ...
+ * }
+ * ```
+ */
+export declare function watch(propertyName: string | string[], options?: WatchOptions): <ElemClass extends LitElement>(proto: ElemClass, propertyKey: string, descriptor: TypedPropertyDescriptor<UpdateHandler>) => void;
+export {};

package/utils/directives/forward-attributes.d.ts

@@ -0,0 +1,25 @@
+import { Directive, ElementPart, PartInfo } from 'lit/directive.js';
+/**
+ * A directive that forwards attributes from the host element to the target element in the component.
+ *
+ * If an attribute name starts with `gds-`, the `gds-` prefix is removed.
+ *
+ * @param filter A function that determines which attributes to forward.
+ *
+ * @example
+ * Here, all attributes that start with `gds-aria` or are named `gds-role`, will be forwarded:
+ * ```html
+ * <button
+ *    ${forwardAttributes(
+ *      (attr) => attr.name.startsWith('gds-aria') || attr.name === 'gds-role'
+ *    )}
+ * >Button</button>
+ * ```
+ */
+declare class ForwardAttributesDirective extends Directive {
+    constructor(partInfo: PartInfo);
+    render(_filter: (attr: Attr) => boolean): symbol;
+    update(part: ElementPart, [filter]: Parameters<this['render']>): void;
+}
+export declare const forwardAttributes: (_filter: (attr: Attr) => boolean) => import("lit-html/directive").DirectiveResult<typeof ForwardAttributesDirective>;
+export {};

package/utils/directives/index.d.ts

@@ -0,0 +1 @@
+export * from './forward-attributes';

package/utils/global-styles.d.ts

@@ -0,0 +1,19 @@
+import { CSSResult } from 'lit';
+declare global {
+    var __gdsGlobalStylesRegistry: GlobalStylesRegistry;
+}
+export declare class GlobalStylesRegistry {
+    #private;
+    /**
+     * Get the global singleton instance of the GlobalStylesRegistry.
+     */
+    static get instance(): GlobalStylesRegistry;
+    /**
+     * Injects global styles into the document. This function is intended to be used for global styles
+     * that cannot be scoped to a specific component.
+     *
+     * @param key unique identifier for this stylesheet.
+     * @param styles CSSResult produced by the lit css template literal tag
+     */
+    injectGlobalStyles(key: string, styles: CSSResult): void;
+}

package/utils/helpers/attribute-converters.d.ts

@@ -0,0 +1,14 @@
+import type { ComplexAttributeConverter } from 'lit';
+/**
+ * Converts between an ISO date string and a Date object.
+ */
+export declare const dateConverter: ComplexAttributeConverter<Date, string>;
+/**
+ * Converts between a comma-separated list of ISO date strings and an array of Date objects.
+
+ */
+export declare const dateArrayConverter: ComplexAttributeConverter<Date[], string>;
+/**
+ * Converts between a comma-separated list of strings and an array of strings.
+ */
+export declare const stringArrayConverter: ComplexAttributeConverter<string[], string>;