@warp-ds/elements 2.3.0-next.9 → 2.3.0

package/dist/packages/rip-and-tear-radio/base-element.js

@@ -1,100 +0,0 @@
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-import { LitElement, unsafeCSS } from 'lit';
-import { property } from 'lit/decorators.js';
-import { styles as hostStyles } from './host-styles';
-export default class BaseElement extends LitElement {
-    /**
-     * Override the default styles property to fetch and convert string CSS files. Components can override this behavior
-     * by setting their own `static styles = []` property.
-     */
-    static get styles() {
-        const styles = Array.isArray(this.css) ? this.css : this.css ? [this.css] : [];
-        return [hostStyles, ...styles].map((style) => (typeof style === 'string' ? unsafeCSS(style) : style));
-    }
-    #hasRecordedInitialProperties;
-    constructor() {
-        super();
-        this.#hasRecordedInitialProperties = false;
-        this.initialReflectedProperties = new Map();
-        /**
-         * Methods for setting and checking custom states.
-         */
-        this.customStates = {
-            /** Adds or removes the specified custom state. */
-            set: (customState, active) => {
-                if (!this.internals?.states)
-                    return;
-                if (active) {
-                    this.internals.states.add(customState);
-                }
-                else {
-                    this.internals.states.delete(customState);
-                }
-            },
-            /** Determines whether or not the element currently has the specified state. */
-            has: (customState) => {
-                if (!this.internals?.states)
-                    return false;
-                return this.internals.states.has(customState);
-            },
-        };
-        try {
-            this.internals = this.attachInternals();
-        }
-        catch {
-            /* Need to tell people if they need a polyfill. */
-            console.error('Element internals are not supported in your browser. Consider using a polyfill');
-        }
-        this.customStates.set('wa-defined', true);
-        const Self = this.constructor;
-        for (const [property, spec] of Self.elementProperties) {
-            if (spec.default === 'inherit' && spec.initial !== undefined && typeof property === 'string') {
-                this.customStates.set(`initial-${property}-${spec.initial}`, true);
-            }
-        }
-    }
-    attributeChangedCallback(name, oldValue, newValue) {
-        if (!this.#hasRecordedInitialProperties) {
-            this.constructor.elementProperties.forEach((obj, prop) => {
-                if (obj.reflect && this[prop] != null) {
-                    this.initialReflectedProperties.set(prop, this[prop]);
-                }
-            });
-            this.#hasRecordedInitialProperties = true;
-        }
-        super.attributeChangedCallback(name, oldValue, newValue);
-    }
-    willUpdate(changedProperties) {
-        super.willUpdate(changedProperties);
-        // Run the morph fixing *after* willUpdate.
-        this.initialReflectedProperties.forEach((value, prop) => {
-            // If a prop changes to `null`, we assume this happens via an attribute changing to `null`.
-            if (changedProperties.has(prop) && this[prop] == null) {
-                // Silly type gymnastics to appease the compiler.
-                this[prop] = value;
-            }
-        });
-    }
-    /**
-     * Given a native event, this function cancels it and dispatches it again from the host element using the desired
-     * event options.
-     */
-    relayNativeEvent(event, eventOptions) {
-        event.stopImmediatePropagation();
-        this.dispatchEvent(new event.constructor(event.type, {
-            ...event,
-            ...eventOptions,
-        }));
-    }
-}
-__decorate([
-    property()
-], BaseElement.prototype, "dir", void 0);
-__decorate([
-    property()
-], BaseElement.prototype, "lang", void 0);

package/dist/packages/rip-and-tear-radio/custom-error-validator.d.ts

@@ -1,6 +0,0 @@
-import type { Validator } from './form-associated-element';
-/**
- * This validator is for if you have an exact copy of your element in the shadow DOM. Rather than needing
- * custom translations and error messages, you can simply rely on the element "formControl" in your shadow dom.
- */
-export declare const CustomErrorValidator: () => Validator;

package/dist/packages/rip-and-tear-radio/custom-error-validator.js

@@ -1,22 +0,0 @@
-/**
- * This validator is for if you have an exact copy of your element in the shadow DOM. Rather than needing
- * custom translations and error messages, you can simply rely on the element "formControl" in your shadow dom.
- */
-export const CustomErrorValidator = () => {
-    return {
-        observedAttributes: ['custom-error'],
-        checkValidity(element) {
-            const validity = {
-                message: '',
-                isValid: true,
-                invalidKeys: [],
-            };
-            if (element.customError) {
-                validity.message = element.customError;
-                validity.isValid = false;
-                validity.invalidKeys = ['customError'];
-            }
-            return validity;
-        },
-    };
-};

package/dist/packages/rip-and-tear-radio/form-associated-element.d.ts

@@ -1,103 +0,0 @@
-import { LitElement } from 'lit';
-import BaseElement from './base-element.js';
-export interface Validator<T extends BaseFormAssociatedElement = BaseFormAssociatedElement> {
-    observedAttributes?: string[];
-    checkValidity: (element: T) => {
-        message: string;
-        isValid: boolean;
-        invalidKeys: Exclude<keyof ValidityState, 'valid'>[];
-    };
-    message?: string | ((element: T) => string);
-}
-export interface BaseFormControl extends BaseElement {
-    name: null | string;
-    disabled?: boolean;
-    defaultValue?: unknown;
-    defaultChecked?: boolean;
-    checked?: boolean;
-    defaultSelected?: boolean;
-    selected?: boolean;
-    form?: string | null;
-    value?: unknown;
-    pattern?: string;
-    min?: number | string | Date;
-    max?: number | string | Date;
-    step?: number | 'any';
-    required?: boolean;
-    minlength?: number;
-    maxlength?: number;
-    readonly validity: ValidityState;
-    readonly validationMessage: string;
-    checkValidity: () => boolean;
-    getForm: () => HTMLFormElement | null;
-    reportValidity: () => boolean;
-    setCustomValidity: (message: string) => void;
-    hasInteracted: boolean;
-    valueHasChanged?: boolean;
-    /** Convenience API for `setCustomValidity()` */
-    customError: null | string;
-}
-export declare class BaseFormAssociatedElement extends BaseElement implements Omit<ElementInternals, 'form' | 'setFormValue'>, BaseFormControl {
-    static formAssociated: boolean;
-    /**
-     * Validators are static because they have `observedAttributes`, essentially attributes to "watch"
-     * for changes. Whenever these attributes change, we want to be notified and update the validator.
-     */
-    static get validators(): Validator[];
-    static get observedAttributes(): string[];
-    /** The name of the input, submitted as a name/value pair with form data. */
-    name: string | null;
-    /** Disables the form control. */
-    disabled: boolean;
-    required: boolean;
-    assumeInteractionOn: string[];
-    input?: (HTMLElement & {
-        value: unknown;
-    }) | HTMLInputElement | HTMLTextAreaElement;
-    validators: Validator[];
-    valueHasChanged: boolean;
-    hasInteracted: boolean;
-    customError: string | null;
-    private emittedEvents;
-    constructor();
-    private states;
-    connectedCallback(): void;
-    firstUpdated(...args: Parameters<LitElement['firstUpdated']>): void;
-    emitInvalid: (e: Event) => void;
-    protected willUpdate(changedProperties: Parameters<LitElement['willUpdate']>[0]): void;
-    private handleInteraction;
-    get labels(): NodeList;
-    getForm(): HTMLFormElement;
-    get validity(): ValidityState;
-    get willValidate(): boolean;
-    get validationMessage(): string;
-    checkValidity(): boolean;
-    reportValidity(): boolean;
-    /**
-     * Override this to change where constraint validation popups are anchored.
-     */
-    get validationTarget(): undefined | HTMLElement;
-    setValidity(...args: Parameters<typeof this.internals.setValidity>): void;
-    setCustomStates(): void;
-    /**
-     * Do not use this when creating a "Validator". This is intended for end users of components.
-     * We track manually defined custom errors so we don't clear them on accident in our validators.
-     *
-     */
-    setCustomValidity(message: string): void;
-    formResetCallback(): void;
-    formDisabledCallback(isDisabled: boolean): void;
-    /**
-     * Called when the browser is trying to restore element’s state to state in which case reason is "restore", or when
-     * the browser is trying to fulfill autofill on behalf of user in which case reason is "autocomplete". In the case of
-     * "restore", state is a string, File, or FormData object previously set as the second argument to setFormValue.
-     */
-    formStateRestoreCallback(state: string | File | FormData | null, reason: 'autocomplete' | 'restore'): void;
-    setValue(...args: Parameters<typeof this.internals.setFormValue>): void;
-    get allValidators(): Validator<BaseFormAssociatedElement>[];
-    /**
-     * Reset validity is a way of removing manual custom errors and native validation.
-     */
-    resetValidity(): void;
-    updateValidity(): void;
-}

package/dist/packages/rip-and-tear-radio/form-associated-element.js

@@ -1,282 +0,0 @@
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-import { isServer } from 'lit';
-import { property } from 'lit/decorators.js';
-import BaseElement from './base-element.js';
-import { CustomErrorValidator } from './custom-error-validator.js';
-import { WInvalidEvent } from './invalid';
-// setFormValue omitted so that we can use `setValue`
-export class BaseFormAssociatedElement extends BaseElement {
-    static { this.formAssociated = true; }
-    /**
-     * Validators are static because they have `observedAttributes`, essentially attributes to "watch"
-     * for changes. Whenever these attributes change, we want to be notified and update the validator.
-     */
-    static get validators() {
-        return [CustomErrorValidator()];
-    }
-    // Append all Validator "observedAttributes" into the "observedAttributes" so they can run.
-    static get observedAttributes() {
-        const parentAttrs = new Set(super.observedAttributes || []);
-        for (const validator of this.validators) {
-            if (!validator.observedAttributes) {
-                continue;
-            }
-            for (const attr of validator.observedAttributes) {
-                parentAttrs.add(attr);
-            }
-        }
-        return [...parentAttrs];
-    }
-    constructor() {
-        super();
-        // Form attributes
-        /** The name of the input, submitted as a name/value pair with form data. */
-        this.name = null;
-        /** Disables the form control. */
-        this.disabled = false;
-        this.required = false;
-        this.assumeInteractionOn = ['input'];
-        this.validators = [];
-        // Should these be private?
-        this.valueHasChanged = false;
-        this.hasInteracted = false;
-        // This works around a limitation in Safari. It is a hacky way for us to preserve custom errors generated by the user.
-        this.customError = null;
-        this.emittedEvents = [];
-        this.emitInvalid = (e) => {
-            if (e.target !== this)
-                return;
-            // An "invalid" event counts as interacted, this is usually triggered by a button "submitting"
-            this.hasInteracted = true;
-            this.dispatchEvent(new WInvalidEvent());
-        };
-        this.handleInteraction = (event) => {
-            const emittedEvents = this.emittedEvents;
-            if (!emittedEvents.includes(event.type)) {
-                emittedEvents.push(event.type);
-            }
-            // Mark it as user-interacted as soon as all associated events have been emitted
-            if (emittedEvents.length === this.assumeInteractionOn?.length) {
-                this.hasInteracted = true;
-            }
-        };
-        if (!isServer) {
-            this.addEventListener('invalid', this.emitInvalid);
-        }
-    }
-    connectedCallback() {
-        super.connectedCallback();
-        this.updateValidity();
-        // Lazily evaluate after the constructor to allow people to override the `assumeInteractionOn`
-        this.assumeInteractionOn.forEach((event) => {
-            this.addEventListener(event, this.handleInteraction);
-        });
-    }
-    firstUpdated(...args) {
-        super.firstUpdated(...args);
-        this.updateValidity();
-    }
-    willUpdate(changedProperties) {
-        if (!isServer && changedProperties.has('customError')) {
-            // We use null because it we really don't want it to show up in the attributes because `custom-error` does reflect
-            if (!this.customError) {
-                this.customError = null;
-            }
-            this.setCustomValidity(this.customError || '');
-        }
-        if (changedProperties.has('value') || changedProperties.has('disabled')) {
-            // @ts-expect-error Some components will use an accessors, other use a property, so we don't want to limit them.
-            const value = this.value;
-            // Accounts for the snowflake case on `<wa-select>`
-            if (Array.isArray(value)) {
-                if (this.name) {
-                    const formData = new FormData();
-                    for (const val of value) {
-                        formData.append(this.name, val);
-                    }
-                    this.setValue(formData, formData);
-                }
-            }
-            else {
-                this.setValue(value, value);
-            }
-        }
-        if (changedProperties.has('disabled')) {
-            this.customStates.set('disabled', this.disabled);
-            if (this.hasAttribute('disabled') || (!isServer && !this.matches(':disabled'))) {
-                this.toggleAttribute('disabled', this.disabled);
-            }
-        }
-        this.updateValidity();
-        super.willUpdate(changedProperties);
-    }
-    get labels() {
-        return this.internals.labels;
-    }
-    getForm() {
-        return this.internals.form;
-    }
-    get validity() {
-        return this.internals.validity;
-    }
-    // Not sure if this supports `novalidate`. Will need to test.
-    get willValidate() {
-        return this.internals.willValidate;
-    }
-    get validationMessage() {
-        return this.internals.validationMessage;
-    }
-    checkValidity() {
-        this.updateValidity();
-        return this.internals.checkValidity();
-    }
-    reportValidity() {
-        this.updateValidity();
-        // This seems reasonable. `reportValidity()` is kind of like "we expect you to have interacted"
-        this.hasInteracted = true;
-        return this.internals.reportValidity();
-    }
-    /**
-     * Override this to change where constraint validation popups are anchored.
-     */
-    get validationTarget() {
-        return (this.input || undefined);
-    }
-    setValidity(...args) {
-        const flags = args[0];
-        const message = args[1];
-        let anchor = args[2];
-        if (!anchor) {
-            anchor = this.validationTarget;
-        }
-        this.internals.setValidity(flags, message, anchor || undefined);
-        this.requestUpdate('validity');
-        this.setCustomStates();
-    }
-    setCustomStates() {
-        const required = Boolean(this.required);
-        const isValid = this.internals.validity.valid;
-        const hasInteracted = this.hasInteracted;
-        this.customStates.set('required', required);
-        this.customStates.set('optional', !required);
-        this.customStates.set('invalid', !isValid);
-        this.customStates.set('valid', isValid);
-        this.customStates.set('user-invalid', !isValid && hasInteracted);
-        this.customStates.set('user-valid', isValid && hasInteracted);
-    }
-    /**
-     * Do not use this when creating a "Validator". This is intended for end users of components.
-     * We track manually defined custom errors so we don't clear them on accident in our validators.
-     *
-     */
-    setCustomValidity(message) {
-        if (!message) {
-            // We use null because it we really don't want it to show up in the attributes because `custom-error` does reflect
-            this.customError = null;
-            this.setValidity({});
-            return;
-        }
-        this.customError = message;
-        this.setValidity({ customError: true }, message, this.validationTarget);
-    }
-    formResetCallback() {
-        this.resetValidity();
-        this.hasInteracted = false;
-        this.valueHasChanged = false;
-        this.emittedEvents = [];
-        this.updateValidity();
-    }
-    formDisabledCallback(isDisabled) {
-        this.disabled = isDisabled;
-        this.updateValidity();
-    }
-    /**
-     * Called when the browser is trying to restore element’s state to state in which case reason is "restore", or when
-     * the browser is trying to fulfill autofill on behalf of user in which case reason is "autocomplete". In the case of
-     * "restore", state is a string, File, or FormData object previously set as the second argument to setFormValue.
-     */
-    formStateRestoreCallback(state, reason) {
-        // @ts-expect-error We purposely do not have a value property. It makes things hard to extend.
-        this.value = state;
-        if (reason === 'restore') {
-            this.resetValidity();
-        }
-        this.updateValidity();
-    }
-    setValue(...args) {
-        const [value, state] = args;
-        this.internals.setFormValue(value, state);
-    }
-    get allValidators() {
-        const staticValidators = this.constructor.validators || [];
-        const validators = this.validators || [];
-        return [...staticValidators, ...validators];
-    }
-    /**
-     * Reset validity is a way of removing manual custom errors and native validation.
-     */
-    resetValidity() {
-        this.setCustomValidity('');
-        this.setValidity({});
-    }
-    updateValidity() {
-        if (this.disabled ||
-            this.hasAttribute('disabled') ||
-            !this.willValidate //
-        ) {
-            this.resetValidity();
-            return;
-        }
-        const validators = this.allValidators;
-        if (!validators?.length) {
-            // If there's no validators, we do nothing. We also don't want to mess with custom errors, so we just stop here.
-            return;
-        }
-        const flags = {
-            // Don't trust custom errors from the Browser. Safari breaks the spec.
-            customError: Boolean(this.customError),
-        };
-        const formControl = this.validationTarget || this.input || undefined;
-        let finalMessage = '';
-        for (const validator of validators) {
-            const { isValid, message, invalidKeys } = validator.checkValidity(this);
-            if (isValid) {
-                continue;
-            }
-            if (!finalMessage) {
-                finalMessage = message;
-            }
-            if (invalidKeys?.length >= 0) {
-                invalidKeys.forEach((str) => (flags[str] = true));
-            }
-        }
-        // This is a workaround for preserving custom errors
-        if (!finalMessage) {
-            finalMessage = this.validationMessage;
-        }
-        this.setValidity(flags, finalMessage, formControl);
-    }
-}
-__decorate([
-    property({ reflect: true })
-], BaseFormAssociatedElement.prototype, "name", void 0);
-__decorate([
-    property({ type: Boolean })
-], BaseFormAssociatedElement.prototype, "disabled", void 0);
-__decorate([
-    property({ state: true, attribute: false })
-], BaseFormAssociatedElement.prototype, "valueHasChanged", void 0);
-__decorate([
-    property({ state: true, attribute: false })
-], BaseFormAssociatedElement.prototype, "hasInteracted", void 0);
-__decorate([
-    property({ attribute: 'custom-error', reflect: true })
-], BaseFormAssociatedElement.prototype, "customError", void 0);
-__decorate([
-    property({ attribute: false, state: true, type: Object })
-], BaseFormAssociatedElement.prototype, "validity", null);

package/dist/packages/rip-and-tear-radio/host-styles.d.ts

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

package/dist/packages/rip-and-tear-radio/host-styles.js

@@ -1,12 +0,0 @@
-import { css } from 'lit';
-export const styles = css `
-  :host {
-    box-sizing: border-box !important;
-  }
-
-  :host *,
-  :host *::before,
-  :host *::after {
-    box-sizing: inherit !important;
-  }
-`;

package/dist/packages/rip-and-tear-radio/index.d.ts

@@ -1 +0,0 @@
-export {};

package/dist/packages/rip-and-tear-radio/index.js

@@ -1,6 +0,0 @@
-import { WRadio } from './radio';
-import { WRadioGroup } from './radio-group';
-if (!customElements.get('w-radio')) {
-    customElements.define('w-radio', WRadio);
-    customElements.define('w-radio-group', WRadioGroup);
-}

package/dist/packages/rip-and-tear-radio/invalid.d.ts

@@ -1,8 +0,0 @@
-export declare class WInvalidEvent extends Event {
-    constructor();
-}
-declare global {
-    interface GlobalEventHandlersEventMap {
-        'wa-invalid': WInvalidEvent;
-    }
-}

package/dist/packages/rip-and-tear-radio/invalid.js

@@ -1,5 +0,0 @@
-export class WInvalidEvent extends Event {
-    constructor() {
-        super('w-invalid', { bubbles: true, cancelable: false, composed: true });
-    }
-}

package/dist/packages/rip-and-tear-radio/math.d.ts

@@ -1 +0,0 @@
-export declare function uniqueId(prefix?: string): string;

package/dist/packages/rip-and-tear-radio/math.js

@@ -1,4 +0,0 @@
-import { nanoid } from 'nanoid';
-export function uniqueId(prefix = '') {
-    return `${prefix}${nanoid()}`;
-}

package/dist/packages/rip-and-tear-radio/radio-group-styles.d.ts

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

package/dist/packages/rip-and-tear-radio/radio-group-styles.js

@@ -1,59 +0,0 @@
-import{css as o}from"lit";var r=o`
-  :host {
-    display: block;
-  }
-
-  .form-control {
-    position: relative;
-    border: none;
-    padding: 0;
-    margin: 0;
-  }
-
-  .label {
-    font-size: var(--w-font-size-s);
-    line-height: var(--w-line-height-s);
-    font-weight: 700;
-    -webkit-font-smoothing: antialiased;
-    -moz-osx-font-smoothing: grayscale;
-    font-smoothing: grayscale;
-    cursor: pointer;
-    padding-bottom: 0.4rem;
-    color: var(--w-s-color-text);
-    display: block;
-  }
-
-  .radio-group-required .label::after {
-    content: var(--wa-form-control-required-content);
-    margin-inline-start: var(--wa-form-control-required-content-offset);
-  }
-
-  .button-group {
-    display: flex;
-  }
-
-  [part~='form-control-input'] {
-    display: flex;
-    flex-direction: column;
-    flex-wrap: wrap;
-  }
-
-  /* Horizontal */
-  :host([orientation='horizontal']) [part~='form-control-input'] {
-    flex-direction: row;
-    gap: 1em;
-  }
-
-  /* Help text */
-  [part~='hint'] {
-    margin-block-start: 0.5em;
-  }
-
-  /* Radios have the "button" appearance */
-  :host fieldset.has-radio-buttons {
-    [part~='form-control-input'] {
-      gap: 0;
-    }
-  }
-`;export{r as styles};
-//# sourceMappingURL=radio-group-styles.js.map

package/dist/packages/rip-and-tear-radio/radio-group-styles.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../packages/rip-and-tear-radio/radio-group-styles.ts"],
-  "sourcesContent": ["import { css } from 'lit';\n\nexport const styles = css`\n  :host {\n    display: block;\n  }\n\n  .form-control {\n    position: relative;\n    border: none;\n    padding: 0;\n    margin: 0;\n  }\n\n  .label {\n    font-size: var(--w-font-size-s);\n    line-height: var(--w-line-height-s);\n    font-weight: 700;\n    -webkit-font-smoothing: antialiased;\n    -moz-osx-font-smoothing: grayscale;\n    font-smoothing: grayscale;\n    cursor: pointer;\n    padding-bottom: 0.4rem;\n    color: var(--w-s-color-text);\n    display: block;\n  }\n\n  .radio-group-required .label::after {\n    content: var(--wa-form-control-required-content);\n    margin-inline-start: var(--wa-form-control-required-content-offset);\n  }\n\n  .button-group {\n    display: flex;\n  }\n\n  [part~='form-control-input'] {\n    display: flex;\n    flex-direction: column;\n    flex-wrap: wrap;\n  }\n\n  /* Horizontal */\n  :host([orientation='horizontal']) [part~='form-control-input'] {\n    flex-direction: row;\n    gap: 1em;\n  }\n\n  /* Help text */\n  [part~='hint'] {\n    margin-block-start: 0.5em;\n  }\n\n  /* Radios have the \"button\" appearance */\n  :host fieldset.has-radio-buttons {\n    [part~='form-control-input'] {\n      gap: 0;\n    }\n  }\n`;\n"],
-  "mappings": "AAAA,OAAS,OAAAA,MAAW,MAEb,IAAMC,EAASD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;",
-  "names": ["css", "styles"]
-}