@refinitiv-ui/elements 5.10.1 → 5.12.0-alpha.0

package/lib/progress-bar/index.js

@@ -1,157 +0,0 @@
-import { __decorate } from "tslib";
-import { css, html, BasicElement } from '@refinitiv-ui/core';
-import { customElement } from '@refinitiv-ui/core/lib/decorators/custom-element.js';
-import { property } from '@refinitiv-ui/core/lib/decorators/property.js';
-import { styleMap } from '@refinitiv-ui/core/lib/directives/style-map.js';
-import { VERSION } from '../version.js';
-/**
- * Data visualisation component,
- * showing a simple percentage bar.
- * @slot label - Overrides the label property and places custom content. Useful for modifying the color, or, adding icons.
- */
-let ProgressBar = class ProgressBar extends BasicElement {
-    constructor() {
-        super(...arguments);
-        this.valuePrevious = '';
-        /**
-         * The current value of the bar.
-         * This can range from `0-100` and
-         * will be represented as a percentage bar
-         */
-        this.value = '100';
-        /**
-         * The alignment of the bar.
-         * The bar can either start from the `left` or `right`.
-         */
-        this.alignment = 'left';
-        /**
-         * The current label to be displayed next to the bar.
-         * This is affixed to the end of the bar, so make sure to cater for this.
-         */
-        this.label = '';
-    }
-    /**
-     * Element version number
-     * @returns version number
-     */
-    static get version() {
-        return VERSION;
-    }
-    /**
-     * A `CSSResultGroup` that will be used
-     * to style the host, slotted children
-     * and the internal template of the element.
-     * @return CSS template
-     */
-    static get styles() {
-        return css `
-    :host {
-      height: 10px;
-      display: flex;
-      position: relative;
-    }
-    [part~=bar] {
-      height: 100%;
-      position: relative;
-    }
-    [part=label] {
-      position: absolute;
-      top: 50%;
-      left: 100%;
-      height: 0;
-      line-height: 0;
-      white-space: nowrap;
-      margin-left: 10px;
-    }
-    :host([alignment=right]) {
-      justify-content: flex-end;
-    }
-    :host([alignment=right]) [part=label] {
-      left: auto;
-      right: 100%;
-      margin-left: 0;
-      margin-right: 10px;
-    }
-    :host [part~=bar-zero] [part=label] {
-      margin: 0;
-    }
-    `;
-    }
-    /**
-     * Converts value from string to number for calculations
-     * @returns value of bar as a number
-     */
-    get valueNumber() {
-        const value = parseFloat(this.value);
-        if (!this.value || isNaN(value)) { // check value is invalid
-            const valuePrevious = parseFloat(this.valuePrevious);
-            // if valuePrevious is invalid return default value 100
-            return !valuePrevious || isNaN(valuePrevious) ? 100 : valuePrevious;
-        }
-        return value;
-    }
-    /**
-     * Gets the current part names for the internal bar
-     */
-    get barParts() {
-        return this.barFill ? 'bar' : 'bar bar-zero';
-    }
-    /**
-     * Calculates the bar's percentage width
-     */
-    get barFill() {
-        return Math.min(100, Math.max(0, this.valueNumber));
-    }
-    /**
-     * Returns CSS styles for showing
-     * the bar's fill percentage.
-     */
-    get barStyle() {
-        return {
-            width: `${this.barFill}%`,
-            minWidth: `${this.barFill ? 1 : 0}px`
-        };
-    }
-    /**
-     * Called after an update has occurred
-     * @param changedProperties changed properties
-     * @returns {void}
-     */
-    updated(changedProperties) {
-        changedProperties.forEach((oldValue, propName) => {
-            if (propName === 'value') {
-                this.valuePrevious = oldValue;
-                this.value = this.valueNumber.toString();
-            }
-        });
-    }
-    /**
-     * A `TemplateResult` that will be used
-     * to render the updated internal template.
-     * @return Render template
-     */
-    render() {
-        return html `
-    <div part="${this.barParts}" style="${styleMap(this.barStyle)}">
-      <span part="label">
-        <slot name="label">${this.label}</slot>
-      </span>
-    </div>
-    `;
-    }
-};
-__decorate([
-    property({ type: String })
-], ProgressBar.prototype, "value", void 0);
-__decorate([
-    property({ type: String, reflect: true })
-], ProgressBar.prototype, "alignment", void 0);
-__decorate([
-    property({ type: String })
-], ProgressBar.prototype, "label", void 0);
-ProgressBar = __decorate([
-    customElement('ef-progress-bar', {
-        alias: 'sapphire-bar'
-    })
-], ProgressBar);
-export { ProgressBar };

package/lib/progress-bar/themes/halo/dark/index.js

@@ -1,2 +0,0 @@
-
-elf.customStyles.define('ef-progress-bar', ':host{color:#6678ff;height:8px}:host [part=bar]{background-color:var(--bar-color,currentColor);transition:width .1s}:host [part=label]{color:#ccc;transition:margin .1s}');

package/lib/progress-bar/themes/halo/light/index.js

@@ -1,2 +0,0 @@
-
-elf.customStyles.define('ef-progress-bar', ':host{color:#334bff;height:8px}:host [part=bar]{background-color:var(--bar-color,currentColor);transition:width .1s}:host [part=label]{color:#0d0d0d;transition:margin .1s}');

package/lib/progress-bar/themes/solar/charcoal/index.js

@@ -1,2 +0,0 @@
-
-elf.customStyles.define('ef-progress-bar', ':host{color:#f93;height:5px}:host [part=bar]{background-color:var(--bar-color,currentColor);transition:width .2s}:host [part=label]{color:#c2c2c2;transition:margin .2s}');

package/lib/progress-bar/themes/solar/pearl/index.js

@@ -1,2 +0,0 @@
-
-elf.customStyles.define('ef-progress-bar', ':host{color:#ee7600;height:5px}:host [part=bar]{background-color:var(--bar-color,currentColor);transition:width .2s}:host [part=label]{color:#484848;transition:margin .2s}');

package/lib/radio-button/index.d.ts

@@ -1,123 +0,0 @@
-import { JSXInterface } from '../jsx';
-import { CSSResultGroup, ControlElement, TemplateResult, PropertyValues } from '@refinitiv-ui/core';
-/**
- * Basic radio button
- *
- * @fires checked-changed - Fired when the `checked` property changes.
- *
- * @attr {string} value - Value of the radio button
- * @prop {string} [value=""] - Value of the radio button
-*
- * @attr {string} name - Group multiple radio buttons by assigning the same name
- * @prop {string} [name=""] - Group multiple radio buttons by assigning the same name
- *
- * @attr {boolean} readonly - Set readonly state
- * @prop {boolean} [readonly=false] - Set readonly state
- *
- * @attr {boolean} disabled - Set disabled state
- * @prop {boolean} [disabled=false] - Set disabled state
- */
-export declare class RadioButton extends ControlElement {
-    /**
-     * Element version number
-     * @returns version number
-     */
-    static get version(): string;
-    protected readonly defaultRole: string | null;
-    /**
-     * A `CSSResultGroup` that will be used
-     * to style the host, slotted children
-     * and the internal template of the element.
-     * @return CSS template
-     */
-    static get styles(): CSSResultGroup;
-    private _checked;
-    /**
-     * Radio button checked state
-     * @param value checked state
-     * @default false
-     * @returns {void}
-     */
-    set checked(value: boolean);
-    get checked(): boolean;
-    /**
-     * Aria indicating checked state
-     * @ignore
-     */
-    ariaChecked: string;
-    /**
-     * Getter for label
-     */
-    private labelEl;
-    /**
-     * Called when connected to DOM
-     * @returns {void}
-     */
-    connectedCallback(): void;
-    /**
-     * Called when disconnected from DOM
-     * @returns {void}
-     */
-    disconnectedCallback(): void;
-    /**
-     * Invoked whenever the element is update
-     * @param changedProperties changed properties
-     * @returns {void}
-     */
-    protected update(changedProperties: PropertyValues): void;
-    /**
-     * Invoked when the element is first updated
-     * @param changedProperties changed properties
-     * @returns {void}
-     */
-    protected firstUpdated(changedProperties: PropertyValues): void;
-    /**
-     * Manage group members state, when either one is being checked
-     * @returns {void}
-     */
-    private manageGroupState;
-    /**
-     * Run when radio button is tapped
-     * @param event Tap event
-     * @returns {void}
-     */
-    private onTap;
-    /**
-     * Handles key down event
-     * @param event Key down event object
-     * @returns {void}
-     */
-    private onKeyDown;
-    /**
-     * Change checked state and fire
-     * checked-changed event
-     * @return {void}
-     */
-    private handleChangeChecked;
-    /**
-     * Navigate to next or previous checkable sibling in the same group if present
-     * @param direction up/next; down/previous
-     * @returns {void}
-     */
-    private navigateToSibling;
-    /**
-     * A `TemplateResult` that will be used
-     * to render the updated internal template.
-     * @return Render template
-     */
-    protected render(): TemplateResult;
-}
-
-declare global {
-  interface HTMLElementTagNameMap {
-    'ef-radio-button': RadioButton;
-  }
-
-  namespace JSX {
-    interface IntrinsicElements {
-      'ef-radio-button': Partial<RadioButton> | JSXInterface.ControlHTMLAttributes<RadioButton>;
-    }
-  }
-}
-
-export {};

package/lib/radio-button/index.js

@@ -1,261 +0,0 @@
-import { __decorate } from "tslib";
-import { html, css, ControlElement } from '@refinitiv-ui/core';
-import { customElement } from '@refinitiv-ui/core/lib/decorators/custom-element.js';
-import { property } from '@refinitiv-ui/core/lib/decorators/property.js';
-import { query } from '@refinitiv-ui/core/lib/decorators/query.js';
-import { VERSION } from '../version.js';
-import { registerOverflowTooltip } from '../tooltip/index.js';
-import { applyRegistry, removeFromRegistry, getRadioGroup } from './radio-button-registry.js';
-/**
- * Basic radio button
- *
- * @fires checked-changed - Fired when the `checked` property changes.
- *
- * @attr {string} value - Value of the radio button
- * @prop {string} [value=""] - Value of the radio button
-*
- * @attr {string} name - Group multiple radio buttons by assigning the same name
- * @prop {string} [name=""] - Group multiple radio buttons by assigning the same name
- *
- * @attr {boolean} readonly - Set readonly state
- * @prop {boolean} [readonly=false] - Set readonly state
- *
- * @attr {boolean} disabled - Set disabled state
- * @prop {boolean} [disabled=false] - Set disabled state
- */
-let RadioButton = class RadioButton extends ControlElement {
-    constructor() {
-        super(...arguments);
-        this.defaultRole = 'radio';
-        this._checked = false;
-        /**
-         * Aria indicating checked state
-         * @ignore
-         */
-        this.ariaChecked = String(this.checked);
-    }
-    /**
-     * Element version number
-     * @returns version number
-     */
-    static get version() {
-        return VERSION;
-    }
-    /**
-     * A `CSSResultGroup` that will be used
-     * to style the host, slotted children
-     * and the internal template of the element.
-     * @return CSS template
-     */
-    static get styles() {
-        return css `
-      :host {
-        display: inline-block;
-      }
-      [part=check] {
-        visibility: hidden;
-      }
-      :host([checked]) [part=check] {
-        visibility: inherit;
-      }
-      [part=label],
-      [part=container] {
-        display: inline-block;
-        white-space: nowrap;
-        vertical-align: middle;
-        overflow: hidden;
-        text-overflow: ellipsis;
-      }
-      :host(:empty) [part=label], [part=label]:empty {
-        display: none;
-      }
-    `;
-    }
-    /**
-     * Radio button checked state
-     * @param value checked state
-     * @default false
-     * @returns {void}
-     */
-    set checked(value) {
-        const oldValue = this._checked;
-        if (oldValue !== value) {
-            this._checked = value;
-            this.ariaChecked = String(value);
-            void this.requestUpdate('checked', oldValue);
-        }
-    }
-    get checked() {
-        return this._checked;
-    }
-    /**
-     * Called when connected to DOM
-     * @returns {void}
-     */
-    connectedCallback() {
-        super.connectedCallback();
-        applyRegistry(this);
-        this.manageGroupState();
-    }
-    /**
-     * Called when disconnected from DOM
-     * @returns {void}
-     */
-    disconnectedCallback() {
-        removeFromRegistry(this);
-        super.disconnectedCallback();
-    }
-    /**
-     * Invoked whenever the element is update
-     * @param changedProperties changed properties
-     * @returns {void}
-     */
-    update(changedProperties) {
-        if (this.isConnected && this.hasUpdated && changedProperties.has('name')) {
-            applyRegistry(this, changedProperties.get('name'));
-        }
-        // Ensure only one radio button is checked
-        if (this.isConnected && this.hasUpdated && (changedProperties.has('checked') || (changedProperties.has('name')))) {
-            this.manageGroupState();
-        }
-        super.update(changedProperties);
-    }
-    /**
-     * Invoked when the element is first updated
-     * @param changedProperties changed properties
-     * @returns {void}
-     */
-    firstUpdated(changedProperties) {
-        super.firstUpdated(changedProperties);
-        this.addEventListener('tap', this.onTap);
-        this.addEventListener('keydown', this.onKeyDown);
-        registerOverflowTooltip(this.labelEl, () => this.textContent);
-    }
-    /**
-     * Manage group members state, when either one is being checked
-     * @returns {void}
-     */
-    manageGroupState() {
-        if (this.checked && this.name) {
-            // restore tab index when checked
-            this.tabIndex = 0;
-            getRadioGroup(this).filter(radio => radio !== this).forEach(radio => {
-                // uncheck and hide the rest of the group members from focusability
-                radio.checked = false;
-                radio.tabIndex = -1;
-            });
-        }
-    }
-    /**
-     * Run when radio button is tapped
-     * @param event Tap event
-     * @returns {void}
-     */
-    onTap(event) {
-        if (this.disabled || this.readonly || event.defaultPrevented) {
-            return;
-        }
-        this.handleChangeChecked();
-    }
-    /**
-     * Handles key down event
-     * @param event Key down event object
-     * @returns {void}
-     */
-    onKeyDown(event) {
-        if (this.disabled || event.defaultPrevented) {
-            return;
-        }
-        switch (event.key) {
-            case ' ':
-            case 'Spacebar':
-                if (this.readonly) {
-                    return;
-                }
-                this.handleChangeChecked();
-                break;
-            case 'Right':
-            case 'Down':
-            case 'ArrowRight':
-            case 'ArrowDown':
-                this.navigateToSibling('next');
-                break;
-            case 'Left':
-            case 'Up':
-            case 'ArrowLeft':
-            case 'ArrowUp':
-                this.navigateToSibling('previous');
-                break;
-            default:
-                return;
-        }
-        event.preventDefault();
-    }
-    /**
-     * Change checked state and fire
-     * checked-changed event
-     * @return {void}
-     */
-    handleChangeChecked() {
-        // Once checked, radio button cannot be unchecked
-        if (!this.checked) {
-            this.checked = true;
-            this.notifyPropertyChange('checked', this.checked);
-        }
-    }
-    /**
-     * Navigate to next or previous checkable sibling in the same group if present
-     * @param direction up/next; down/previous
-     * @returns {void}
-     */
-    navigateToSibling(direction) {
-        if (!this.name) {
-            return;
-        }
-        const group = getRadioGroup(this).filter(radio => !radio.disabled);
-        const index = group.indexOf(this);
-        let element;
-        if (direction === 'next') {
-            element = index === -1 ? group[0] : group[index + 1];
-        }
-        else {
-            element = index === -1 ? group[group.length - 1] : group[index - 1];
-        }
-        if (!element) {
-            element = direction === 'next' ? group[0] : group[group.length - 1];
-        }
-        if (!element.readonly) {
-            this.checked = false;
-            element.checked = true;
-        }
-        element.focus();
-    }
-    /**
-     * A `TemplateResult` that will be used
-     * to render the updated internal template.
-     * @return Render template
-     */
-    render() {
-        return html `
-      <div part="container">
-        <div part="check"></div>
-      </div>
-      <div part="label"><slot></slot></div>
-    `;
-    }
-};
-__decorate([
-    property({ type: Boolean, reflect: true })
-], RadioButton.prototype, "checked", null);
-__decorate([
-    property({ type: String, reflect: true, attribute: 'aria-checked' })
-], RadioButton.prototype, "ariaChecked", void 0);
-__decorate([
-    query('[part=label]', true)
-], RadioButton.prototype, "labelEl", void 0);
-RadioButton = __decorate([
-    customElement('ef-radio-button', {
-        alias: 'coral-radio-button'
-    })
-], RadioButton);
-export { RadioButton };

package/lib/radio-button/radio-button-registry.d.ts

@@ -1,22 +0,0 @@
-import type { RadioButton } from './index';
-/**
- * Remove radio button from registry
- * @param radio Radio button to remove
- * @returns {void}
- */
-declare const removeFromRegistry: (radio: RadioButton) => void;
-/**
- * Add radio button to registry group of radio has a name
- * If radio does not have the name, remove from the group
- * @param radio Radio button to add
- * @param oldGroupName group name of radio button before changed
- * @returns {void}
- */
-declare const applyRegistry: (radio: RadioButton, oldGroupName?: string) => void;
-/**
- * Get the group of same name radio buttons
- * @param radio A radio to get a group for
- * @returns collection of radio buttons
- */
-declare const getRadioGroup: (radio: RadioButton) => RadioButton[];
-export { applyRegistry, removeFromRegistry, getRadioGroup };

package/lib/radio-button/radio-button-registry.js

@@ -1,93 +0,0 @@
-const registry = [];
-/**
- * Remove radio button from registry
- * @param radio Radio button to remove
- * @returns {void}
- */
-const removeFromRegistry = (radio) => {
-    const idx = registry.indexOf(radio);
-    if (idx !== -1) {
-        registry.splice(idx, 1);
-    }
-};
-/**
- * Add radio button to registry group of radio has a name
- * If radio does not have the name, remove from the group
- * @param radio Radio button to add
- * @param oldGroupName group name of radio button before changed
- * @returns {void}
- */
-const applyRegistry = (radio, oldGroupName = '') => {
-    const isNewRadioButton = registry.indexOf(radio) === -1;
-    if (radio.name && isNewRadioButton) {
-        registry.push(radio);
-        if (registry.length === 1) {
-            return;
-        }
-        // Set tabIndex to -1 if radio either uncheck or not the first radio button in the group.
-        const radioGroup = getRadioGroup(radio);
-        if (!radio.checked && radioGroup.length > 1) {
-            radio.tabIndex = -1;
-        }
-    }
-    // Removed from the group
-    else if (!radio.name && !isNewRadioButton) {
-        removeFromRegistry(radio);
-        radio.tabIndex = 0; // Restores tabIndex and switch to single mode
-        // Re-compute tabIndex for old radio group
-        const oldRadioGroup = registry.filter(radio => radio.name === oldGroupName);
-        restoreTabIndex(oldRadioGroup);
-    }
-    // Changes group
-    else if (radio.name && !isNewRadioButton) {
-        // Re-compute tabIndex for new radio group when name attribute has changed
-        const newRadioGroup = getRadioGroup(radio);
-        if (radio.checked) {
-            radio.tabIndex = 0;
-            // uncheck and hide the rest of the group members from focusability
-            newRadioGroup.filter((newRadio) => newRadio !== radio).forEach(newRadio => {
-                newRadio.checked = false;
-                newRadio.tabIndex = -1;
-            });
-        }
-        else {
-            radio.tabIndex = -1;
-            restoreTabIndex(newRadioGroup);
-        }
-        // Re-compute tabIndex for old radio group when name attribute has changed.
-        const oldRadioGroup = registry.filter(radio => radio.name === oldGroupName);
-        restoreTabIndex(oldRadioGroup);
-    }
-};
-/**
- * Re-compute tabIndex for the radio group
- * Set tabIndex to 0 for first radio button in the group.
- * Set tabIndex to -1 for the rest of button in group.
- * @param radioGroup collection of radio buttons
- * @returns {void}
- */
-const restoreTabIndex = (radioGroup) => {
-    if (!radioGroup.length) {
-        return;
-    }
-    const checkedRadio = radioGroup.filter(radio => radio.checked);
-    if (checkedRadio.length) {
-        return;
-    }
-    radioGroup.forEach((radio, index) => {
-        radio.tabIndex = index === 0 ? 0 : -1;
-    });
-};
-/**
- * Get the group of same name radio buttons
- * @param radio A radio to get a group for
- * @returns collection of radio buttons
- */
-const getRadioGroup = (radio) => {
-    if (!registry.includes(radio)) {
-        return [];
-    }
-    const groupName = radio.name;
-    return registry.filter(radio => radio.name === groupName);
-};
-export { applyRegistry, removeFromRegistry, getRadioGroup };

package/lib/radio-button/themes/halo/dark/index.js

@@ -1,3 +0,0 @@
-import '@refinitiv-ui/elements/lib/tooltip/themes/halo/dark';
-
-elf.customStyles.define('ef-radio-button', ':host{margin:1px 0;vertical-align:middle;display:inline-flex;align-items:center;flex-wrap:nowrap;font-size:inherit;font-weight:inherit;touch-action:manipulation;--check-color:#6678FF;color:#ccc}:host(:focus){outline:0}:host [part=container]{-webkit-appearance:none;-moz-appearance:none;appearance:none;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;border-radius:100%;background-color:#0d0d0d;transition:box-shadow 150ms,border-color 150ms;box-shadow:inset 0 0 0 rgba(0,0,0,.5);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;position:relative;border:1px solid #404040;width:14px;height:14px}:host [part=check]{display:flex;justify-content:center;align-items:center;box-sizing:border-box;color:var(--check-color,#6678ff);border:none;background-color:currentColor;transform:none;border-radius:100%;margin:0;width:8px;height:8px}:host [part=label]{margin:0 7px;cursor:default}:host([disabled]) [part=check],:host([readonly]) [part=check]{color:var(--check-color,#ccc)}:host([disabled]) [part=check]{opacity:.5}:host([disabled][checked]) [part=check]{opacity:.5}:host([disabled]) [part=label]{opacity:.65}@media (-ms-high-contrast:none),(pointer:fine){:host(:focus) [part=container]{border-color:#334bff;box-shadow:0 0 0 #334bff}}:host(:not([readonly])){cursor:pointer}:host(:hover:not([checked]):not([readonly])) [part=container]{border-color:grey}:host(:hover:not([readonly])){color:#fff}:host([disabled]),:host([disabled]) [part=label]{opacity:.5}:host([checked]) [part=container]{border:1px solid #334bff}:host(:focus[readonly]:not([checked])) [part=container]{border-color:#404040}:host([focused=visible]){outline:#334bff solid 1px;outline-offset:2px}');

package/lib/radio-button/themes/halo/light/index.js

@@ -1,3 +0,0 @@
-import '@refinitiv-ui/elements/lib/tooltip/themes/halo/light';
-
-elf.customStyles.define('ef-radio-button', ':host{margin:1px 0;vertical-align:middle;display:inline-flex;align-items:center;flex-wrap:nowrap;font-size:inherit;font-weight:inherit;touch-action:manipulation;--check-color:#334BFF;color:#404040}:host(:focus){outline:0}:host [part=container]{-webkit-appearance:none;-moz-appearance:none;appearance:none;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;border-radius:100%;background-color:#fff;transition:box-shadow 150ms,border-color 150ms;box-shadow:inset 0 0 0 rgba(0,0,0,.25);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;position:relative;border:1px solid #595959;width:14px;height:14px}:host [part=check]{display:flex;justify-content:center;align-items:center;box-sizing:border-box;color:var(--check-color,#334bff);border:none;background-color:currentColor;transform:none;border-radius:100%;margin:0;width:8px;height:8px}:host [part=label]{margin:0 7px;cursor:default}:host([disabled]) [part=check],:host([readonly]) [part=check]{color:var(--check-color,#404040)}:host([disabled]) [part=check]{opacity:.5}:host([disabled][checked]) [part=check]{opacity:.5}:host([disabled]) [part=label]{opacity:.65}@media (-ms-high-contrast:none),(pointer:fine){:host(:focus) [part=container]{border-color:#334bff;box-shadow:0 0 0 #334bff}}:host(:not([readonly])){cursor:pointer}:host(:hover:not([checked]):not([readonly])) [part=container]{border-color:#0d0d0d}:host(:hover:not([readonly])){color:#0d0d0d}:host([disabled]),:host([disabled]) [part=label]{opacity:.5}:host([checked]) [part=container]{border:1px solid #334bff}:host(:focus[readonly]:not([checked])) [part=container]{border-color:#595959}:host([focused=visible]){outline:#334bff solid 1px;outline-offset:2px}');

package/lib/radio-button/themes/solar/charcoal/index.js

@@ -1,3 +0,0 @@
-import '@refinitiv-ui/elements/lib/tooltip/themes/solar/charcoal';
-
-elf.customStyles.define('ef-radio-button', ':host{margin:1px 0;vertical-align:middle;display:inline-flex;align-items:center;flex-wrap:nowrap;font-size:inherit;font-weight:inherit;touch-action:manipulation}:host(:focus){outline:0}:host [part=container]{-webkit-appearance:none;-moz-appearance:none;appearance:none;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;border-radius:100%;background-color:#000;transition:box-shadow 150ms,border-color 150ms;box-shadow:inset 0 0 0 rgba(0,0,0,.6);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;position:relative;border:1px solid #4a4a52;height:11px;width:11px}:host [part=check]{display:flex;justify-content:center;align-items:center;box-sizing:border-box;color:var(--check-color,#f93);border:none;background-color:currentColor;transform:none;border-radius:100%;margin:0;width:7px;height:7px}:host [part=label]{cursor:default;margin:0 4px}:host([disabled]) [part=check],:host([readonly]) [part=check]{color:var(--check-color,#e2e2e2)}:host([disabled]) [part=check]{opacity:.5}:host([disabled][checked]) [part=check]{opacity:.5}:host([disabled]) [part=label]{opacity:.65;opacity:rgba(194,194,194,.6)}:host([checked][disabled]) [part=check]{color:#c2c2c2}:host([checked][readonly]) [part=check]{color:rgba(194,194,194,.5)}:host([disabled]) [part=container],:host([readonly]) [part=container]{color:rgba(194,194,194,.6);border-color:rgba(74,74,82,.6);background-color:rgba(0,0,0,.6)}@media (-ms-high-contrast:none),(pointer:fine){:host(:focus) [part=container]{box-shadow:0 0 0 #f93;border:1px dotted #f93}}');