@trimble-oss/moduswebcomponents
Version:
Modus Web Components is a modern, accessible UI library built with Stencil JS that provides reusable web components following Trimble's Modus design system. This updated version focuses on improved flexibility, enhanced theming options, comprehensive cust
132 lines (126 loc) • 20.7 kB
JavaScript
import { h, p as proxyCustomElement, H, e as createEvent, c as Host } from './p-BMvVSi6Y.js';
import { K as KEY, i as inheritAriaAttributes } from './p-COxr4v9W.js';
const convertPropsToClasses = ({ active, disabled, hasError, size, variant, }) => {
let classes = '';
if (active) {
classes = `${classes} modus-wc-chip--active`;
}
if (disabled) {
classes = `${classes} modus-wc-chip--disabled`;
}
if (hasError) {
classes = `${classes} modus-wc-chip--error`;
}
if (size) {
classes = `${classes} modus-wc-btn-${size}`;
}
if (variant) {
switch (variant) {
case 'outline':
classes = `${classes} modus-wc-chip--outline`;
break;
}
}
return classes.trim();
};
const CancelCircleSolidIcon = ({ className, onClick, }) => (h("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "currentColor", class: `mi-solid mi-cancel-circle ${className || ''}`, onClick: onClick || undefined, viewBox: "0 0 24 24" },
h("path", { d: "M12 2C6.47 2 2 6.47 2 12s4.47 10 10 10 10-4.47 10-10S17.53 2 12 2m4.3 14.3a.996.996 0 0 1-1.41 0L12 13.41 9.11 16.3a.996.996 0 1 1-1.41-1.41L10.59 12 7.7 9.11A.996.996 0 1 1 9.11 7.7L12 10.59l2.89-2.89a.996.996 0 1 1 1.41 1.41L13.41 12l2.89 2.89c.38.38.38 1.02 0 1.41" })));
const modusWcChipCss = "modus-wc-chip .modus-wc-chip.modus-wc-btn{background-color:var(--modus-wc-color-base-100);border-color:transparent;box-sizing:border-box;color:var(--modus-wc-color-base-content);--rounded-btn:var(--modus-wc-border-radius-chip)}modus-wc-chip .modus-wc-chip.modus-wc-btn.modus-wc-btn-sm{height:var(--modus-wc-spacing-xl);min-height:var(--modus-wc-spacing-xl);padding:var(--modus-wc-spacing-xs) var(--modus-wc-spacing-sm)}modus-wc-chip .modus-wc-chip.modus-wc-btn.modus-wc-btn-sm .modus-wc-avatar{height:var(--modus-wc-spacing-lg);width:var(--modus-wc-spacing-lg)}modus-wc-chip .modus-wc-chip.modus-wc-btn.modus-wc-btn-sm .modus-wc-chip-remove-icon{height:var(--modus-wc-spacing-lg);width:var(--modus-wc-spacing-lg)}modus-wc-chip .modus-wc-chip.modus-wc-btn.modus-wc-btn-md{height:var(--modus-wc-spacing-2xl);min-height:var(--modus-wc-spacing-2xl);padding:var(--modus-wc-spacing-sm) var(--modus-wc-spacing-sm)}modus-wc-chip .modus-wc-chip.modus-wc-btn.modus-wc-btn-md .modus-wc-avatar{height:var(--modus-wc-spacing-lg);width:var(--modus-wc-spacing-lg)}modus-wc-chip .modus-wc-chip.modus-wc-btn.modus-wc-btn-md .modus-wc-chip-remove-icon{height:var(--modus-wc-spacing-lg);width:var(--modus-wc-spacing-lg)}modus-wc-chip .modus-wc-chip.modus-wc-btn.modus-wc-btn-lg{height:var(--modus-wc-spacing-3xl);min-height:var(--modus-wc-spacing-3xl);padding:var(--modus-wc-spacing-md) var(--modus-wc-spacing-md)}modus-wc-chip .modus-wc-chip.modus-wc-btn.modus-wc-btn-lg .modus-wc-avatar{height:var(--modus-wc-spacing-xl);width:var(--modus-wc-spacing-xl)}modus-wc-chip .modus-wc-chip.modus-wc-btn.modus-wc-btn-lg .modus-wc-chip-remove-icon{height:var(--modus-wc-spacing-xl);width:var(--modus-wc-spacing-xl)}modus-wc-chip .modus-wc-chip.modus-wc-btn.modus-wc-chip--active{background-color:var(--modus-wc-color-primary);border-color:transparent;color:var(--modus-wc-color-base-content)}modus-wc-chip .modus-wc-chip.modus-wc-btn.modus-wc-chip--active.modus-wc-chip--outline{background-color:var(--modus-wc-color-primary);border-color:var(--modus-wc-color-primary);color:var(--modus-wc-color-primary)}modus-wc-chip .modus-wc-chip.modus-wc-btn.modus-wc-chip--active.modus-wc-chip--outline .modus-wc-chip-label{color:var(--modus-wc-color-base-content)}modus-wc-chip .modus-wc-chip.modus-wc-btn.modus-wc-chip--error{background-color:var(--modus-wc-color-red-pale);border-color:transparent;color:var(--modus-wc-color-red-dark)}modus-wc-chip .modus-wc-chip.modus-wc-btn.modus-wc-chip--error.modus-wc-chip--outline{background-color:var(--modus-wc-color-red-pale);border-color:var(--modus-wc-color-red-dark)}modus-wc-chip .modus-wc-chip.modus-wc-btn.modus-wc-chip--outline{background-color:transparent;border-color:var(--modus-wc-color-base-200)}modus-wc-chip .modus-wc-chip.modus-wc-btn:hover:not(.modus-wc-chip--active):not(.modus-wc-chip--error){background-color:var(--modus-wc-color-base-100);border-color:transparent;color:var(--modus-wc-color-base-content)}modus-wc-chip .modus-wc-chip.modus-wc-btn:hover:not(.modus-wc-chip--active):not(.modus-wc-chip--error).modus-wc-chip--outline{background-color:var(--modus-wc-color-base-100);border-color:var(--modus-wc-color-base-200);color:var(--modus-wc-color-base-content)}modus-wc-chip .modus-wc-chip.modus-wc-btn:active:not(.modus-wc-chip--error):not(.modus-wc-chip--active){background-color:var(--modus-wc-color-primary);border-color:transparent;color:var(--modus-wc-color-primary-content)}modus-wc-chip .modus-wc-chip.modus-wc-btn:active:not(.modus-wc-chip--error):not(.modus-wc-chip--active).modus-wc-chip--outline{background-color:var(--modus-wc-color-base-100);background-color:transparent;border-color:var(--modus-wc-color-primary);color:var(--modus-wc-color-primary)}modus-wc-chip .modus-wc-chip.modus-wc-btn:active:not(.modus-wc-chip--error):not(.modus-wc-chip--active).modus-wc-chip--outline .modus-wc-chip-label{color:var(--modus-wc-color-primary)}modus-wc-chip .modus-wc-chip.modus-wc-btn:focus{outline-offset:0}modus-wc-chip .modus-wc-chip.modus-wc-chip--disabled{opacity:0.3}modus-wc-chip .modus-wc-chip.modus-wc-chip--disabled .modus-wc-avatar{filter:grayscale(100%)}modus-wc-chip .modus-wc-chip .modus-wc-avatar{display:flex}[data-theme=modus-classic-light] modus-wc-chip .modus-wc-chip.modus-wc-btn,[data-theme=modus-classic-dark] modus-wc-chip .modus-wc-chip.modus-wc-btn{background-color:var(--modus-wc-color-gray-1);border-color:transparent;box-sizing:border-box;color:var(--modus-wc-color-base-content);font-size:var(--modus-wc-font-size-md);--rounded-btn:var(--modus-wc-border-radius-xl)}[data-theme=modus-classic-light] modus-wc-chip .modus-wc-chip.modus-wc-btn.modus-wc-btn-sm,[data-theme=modus-classic-dark] modus-wc-chip .modus-wc-chip.modus-wc-btn.modus-wc-btn-sm{font-size:var(--modus-wc-font-size-md);height:var(--modus-wc-spacing-xl);min-height:var(--modus-wc-spacing-xl);padding:var(--modus-wc-spacing-xs) var(--modus-wc-spacing-sm)}[data-theme=modus-classic-light] modus-wc-chip .modus-wc-chip.modus-wc-btn.modus-wc-btn-sm .modus-wc-avatar,[data-theme=modus-classic-dark] modus-wc-chip .modus-wc-chip.modus-wc-btn.modus-wc-btn-sm .modus-wc-avatar{height:var(--modus-wc-spacing-lg);width:var(--modus-wc-spacing-lg)}[data-theme=modus-classic-light] modus-wc-chip .modus-wc-chip.modus-wc-btn.modus-wc-btn-sm .modus-wc-chip-remove-icon,[data-theme=modus-classic-dark] modus-wc-chip .modus-wc-chip.modus-wc-btn.modus-wc-btn-sm .modus-wc-chip-remove-icon{height:var(--modus-wc-spacing-lg);width:var(--modus-wc-spacing-lg)}[data-theme=modus-classic-light] modus-wc-chip .modus-wc-chip.modus-wc-btn.modus-wc-btn-md,[data-theme=modus-classic-dark] modus-wc-chip .modus-wc-chip.modus-wc-btn.modus-wc-btn-md{font-size:var(--modus-wc-font-size-md);height:var(--modus-wc-spacing-2xl);min-height:var(--modus-wc-spacing-2xl);padding:var(--modus-wc-spacing-sm) var(--modus-wc-spacing-md);--rounded-btn:var(--modus-wc-border-radius-2xl)}[data-theme=modus-classic-light] modus-wc-chip .modus-wc-chip.modus-wc-btn.modus-wc-btn-md .modus-wc-avatar,[data-theme=modus-classic-dark] modus-wc-chip .modus-wc-chip.modus-wc-btn.modus-wc-btn-md .modus-wc-avatar{height:var(--modus-wc-spacing-lg);width:var(--modus-wc-spacing-lg)}[data-theme=modus-classic-light] modus-wc-chip .modus-wc-chip.modus-wc-btn.modus-wc-btn-md .modus-wc-chip-remove-icon,[data-theme=modus-classic-dark] modus-wc-chip .modus-wc-chip.modus-wc-btn.modus-wc-btn-md .modus-wc-chip-remove-icon{height:var(--modus-wc-spacing-lg);width:var(--modus-wc-spacing-lg)}[data-theme=modus-classic-light] modus-wc-chip .modus-wc-chip.modus-wc-btn.modus-wc-btn-lg,[data-theme=modus-classic-dark] modus-wc-chip .modus-wc-chip.modus-wc-btn.modus-wc-btn-lg{font-size:var(--modus-wc-font-size-xl);height:var(--modus-wc-spacing-3xl);min-height:var(--modus-wc-spacing-3xl);padding:var(--modus-wc-spacing-md) var(--modus-wc-spacing-lg);--rounded-btn:var(--modus-wc-border-radius-3xl)}[data-theme=modus-classic-light] modus-wc-chip .modus-wc-chip.modus-wc-btn.modus-wc-btn-lg .modus-wc-avatar,[data-theme=modus-classic-dark] modus-wc-chip .modus-wc-chip.modus-wc-btn.modus-wc-btn-lg .modus-wc-avatar{height:var(--modus-wc-spacing-xl);width:var(--modus-wc-spacing-xl)}[data-theme=modus-classic-light] modus-wc-chip .modus-wc-chip.modus-wc-btn.modus-wc-btn-lg .modus-wc-chip-remove-icon,[data-theme=modus-classic-dark] modus-wc-chip .modus-wc-chip.modus-wc-btn.modus-wc-btn-lg .modus-wc-chip-remove-icon{height:var(--modus-wc-spacing-xl);width:var(--modus-wc-spacing-xl)}[data-theme=modus-classic-light] modus-wc-chip .modus-wc-chip.modus-wc-btn.modus-wc-chip--active,[data-theme=modus-classic-dark] modus-wc-chip .modus-wc-chip.modus-wc-btn.modus-wc-chip--active{background-color:color-mix(in sRGB, var(--modus-wc-color-highlight-blue) 15%, transparent);border-color:transparent;color:var(--modus-wc-color-base-content)}[data-theme=modus-classic-light] modus-wc-chip .modus-wc-chip.modus-wc-btn.modus-wc-chip--active.modus-wc-chip--outline,[data-theme=modus-classic-dark] modus-wc-chip .modus-wc-chip.modus-wc-btn.modus-wc-chip--active.modus-wc-chip--outline{background-color:var(--modus-wc-color-primary);border-color:var(--modus-wc-color-primary);color:var(--modus-wc-color-primary)}[data-theme=modus-classic-light] modus-wc-chip .modus-wc-chip.modus-wc-btn.modus-wc-chip--active.modus-wc-chip--outline .modus-wc-chip-label,[data-theme=modus-classic-dark] modus-wc-chip .modus-wc-chip.modus-wc-btn.modus-wc-chip--active.modus-wc-chip--outline .modus-wc-chip-label{color:var(--modus-wc-color-base-content)}[data-theme=modus-classic-light] modus-wc-chip .modus-wc-chip.modus-wc-btn.modus-wc-chip--error,[data-theme=modus-classic-dark] modus-wc-chip .modus-wc-chip.modus-wc-btn.modus-wc-chip--error{background-color:var(--modus-wc-color-red-pale);border-color:transparent;color:var(--modus-wc-color-red-dark)}[data-theme=modus-classic-light] modus-wc-chip .modus-wc-chip.modus-wc-btn.modus-wc-chip--error.modus-wc-chip--outline,[data-theme=modus-classic-dark] modus-wc-chip .modus-wc-chip.modus-wc-btn.modus-wc-chip--error.modus-wc-chip--outline{background-color:var(--modus-wc-color-red-pale);border-color:var(--modus-wc-color-red-dark)}[data-theme=modus-classic-light] modus-wc-chip .modus-wc-chip.modus-wc-btn.modus-wc-chip--outline,[data-theme=modus-classic-dark] modus-wc-chip .modus-wc-chip.modus-wc-btn.modus-wc-chip--outline{background-color:transparent;border-color:var(--modus-wc-color-base-200)}[data-theme=modus-classic-light] modus-wc-chip .modus-wc-chip.modus-wc-btn:hover:not(.modus-wc-chip--active):not(.modus-wc-chip--error),[data-theme=modus-classic-dark] modus-wc-chip .modus-wc-chip.modus-wc-btn:hover:not(.modus-wc-chip--active):not(.modus-wc-chip--error){background-color:var(--modus-wc-color-base-100);border-color:transparent;color:var(--modus-wc-color-base-content)}[data-theme=modus-classic-light] modus-wc-chip .modus-wc-chip.modus-wc-btn:hover:not(.modus-wc-chip--active):not(.modus-wc-chip--error).modus-wc-chip--outline,[data-theme=modus-classic-dark] modus-wc-chip .modus-wc-chip.modus-wc-btn:hover:not(.modus-wc-chip--active):not(.modus-wc-chip--error).modus-wc-chip--outline{background-color:var(--modus-wc-color-base-100);border-color:var(--modus-wc-color-base-200);color:var(--modus-wc-color-base-content)}[data-theme=modus-classic-light] modus-wc-chip .modus-wc-chip.modus-wc-btn:active:not(.modus-wc-chip--error):not(.modus-wc-chip--active),[data-theme=modus-classic-dark] modus-wc-chip .modus-wc-chip.modus-wc-btn:active:not(.modus-wc-chip--error):not(.modus-wc-chip--active){background-color:color-mix(in sRGB, var(--modus-wc-color-highlight-blue) 15%, transparent);border-color:transparent;color:var(--modus-wc-color-gray-10)}[data-theme=modus-classic-light] modus-wc-chip .modus-wc-chip.modus-wc-btn:active:not(.modus-wc-chip--error):not(.modus-wc-chip--active).modus-wc-chip--outline,[data-theme=modus-classic-dark] modus-wc-chip .modus-wc-chip.modus-wc-btn:active:not(.modus-wc-chip--error):not(.modus-wc-chip--active).modus-wc-chip--outline{background-color:var(--modus-wc-color-base-100);background-color:transparent;background-color:color-mix(in sRGB, var(--modus-wc-color-highlight-blue) 15%, transparent);background-color:color-mix(in sRGB, var(--modus-wc-color-highlight-blue) 15%, transparent)}[data-theme=modus-classic-light] modus-wc-chip .modus-wc-chip.modus-wc-btn:active:not(.modus-wc-chip--error):not(.modus-wc-chip--active).modus-wc-chip--outline .modus-wc-chip-label,[data-theme=modus-classic-dark] modus-wc-chip .modus-wc-chip.modus-wc-btn:active:not(.modus-wc-chip--error):not(.modus-wc-chip--active).modus-wc-chip--outline .modus-wc-chip-label{color:var(--modus-wc-color-primary)}[data-theme=modus-classic-light] modus-wc-chip .modus-wc-chip.modus-wc-btn:focus,[data-theme=modus-classic-dark] modus-wc-chip .modus-wc-chip.modus-wc-btn:focus{outline-offset:0}[data-theme=modus-classic-light] modus-wc-chip .modus-wc-chip.modus-wc-chip--disabled,[data-theme=modus-classic-dark] modus-wc-chip .modus-wc-chip.modus-wc-chip--disabled{opacity:0.3}[data-theme=modus-classic-light] modus-wc-chip .modus-wc-chip.modus-wc-chip--disabled .modus-wc-avatar,[data-theme=modus-classic-dark] modus-wc-chip .modus-wc-chip.modus-wc-chip--disabled .modus-wc-avatar{filter:grayscale(100%)}[data-theme=modus-classic-light] modus-wc-chip .modus-wc-chip .modus-wc-avatar,[data-theme=modus-classic-dark] modus-wc-chip .modus-wc-chip .modus-wc-avatar{display:flex}[data-theme=modus-classic-dark] modus-wc-chip .modus-wc-chip.modus-wc-btn{background-color:var(--modus-wc-color-gray-1);border-color:var(--modus-wc-color-gray-1);color:var(--modus-wc-color-gray-9)}[data-theme=modus-classic-dark] modus-wc-chip .modus-wc-chip.modus-wc-btn.modus-wc-chip--active{background-color:var(--modus-wc-color-highlight-blue);border-color:transparent;color:var(--modus-wc-color-gray-10)}[data-theme=modus-classic-dark] modus-wc-chip .modus-wc-chip.modus-wc-btn.modus-wc-chip--active.modus-wc-chip--outline{background-color:color-mix(in sRGB, var(--modus-wc-color-blue-dark) 50%, transparent);border-color:var(--modus-wc-color-highlight-blue);color:var(--modus-wc-color-gray-1)}[data-theme=modus-classic-dark] modus-wc-chip .modus-wc-chip.modus-wc-btn.modus-wc-chip--active.modus-wc-chip--outline .modus-wc-chip-label{color:var(--modus-wc-color-gray-1)}[data-theme=modus-classic-dark] modus-wc-chip .modus-wc-chip.modus-wc-btn.modus-wc-chip--error{background-color:var(--modus-wc-color-red-pale);border-color:transparent;color:var(--modus-wc-color-red-dark)}[data-theme=modus-classic-dark] modus-wc-chip .modus-wc-chip.modus-wc-btn.modus-wc-chip--error.modus-wc-chip--outline{background-color:var(--modus-wc-color-red-pale);border-color:var(--modus-wc-color-red-dark);color:var(--modus-wc-color-red-dark)}[data-theme=modus-classic-dark] modus-wc-chip .modus-wc-chip.modus-wc-btn.modus-wc-chip--outline{background-color:transparent;border-color:var(--modus-wc-color-gray-1);color:var(--modus-wc-color-gray-1)}[data-theme=modus-classic-dark] modus-wc-chip .modus-wc-chip.modus-wc-btn:hover:not(.modus-wc-chip--active):not(.modus-wc-chip--error){background-color:var(--modus-wc-color-gray-0);border-color:transparent;color:var(--modus-wc-color-gray-9)}[data-theme=modus-classic-dark] modus-wc-chip .modus-wc-chip.modus-wc-btn:hover:not(.modus-wc-chip--active):not(.modus-wc-chip--error).modus-wc-chip--outline{background-color:color-mix(in sRGB, var(--modus-wc-color-gray-1) 12%, transparent);border-color:var(--modus-wc-color-gray-5);color:var(--modus-wc-color-gray-1)}[data-theme=modus-classic-dark] modus-wc-chip .modus-wc-chip.modus-wc-btn:active:not(.modus-wc-chip--error):not(.modus-wc-chip--active){background-color:var(--modus-wc-color-highlight-blue);border-color:transparent;color:var(--modus-wc-color-gray-10)}[data-theme=modus-classic-dark] modus-wc-chip .modus-wc-chip.modus-wc-btn:active:not(.modus-wc-chip--error):not(.modus-wc-chip--active).modus-wc-chip--outline{background-color:color-mix(in sRGB, var(--modus-wc-color-blue-dark) 50%, transparent);border-color:var(--modus-wc-color-highlight-blue);color:var(--modus-wc-color-gray-1)}[data-theme=modus-classic-dark] modus-wc-chip .modus-wc-chip.modus-wc-btn:active:not(.modus-wc-chip--error):not(.modus-wc-chip--active).modus-wc-chip--outline .modus-wc-chip-label{color:var(--modus-wc-color-gray-1)}[data-theme=modus-classic-dark] modus-wc-chip .modus-wc-chip.modus-wc-chip--disabled{opacity:0.6}";
const ModusWcChip = /*@__PURE__*/ proxyCustomElement(class ModusWcChip extends H {
constructor() {
super();
this.__registerHost();
this.chipClick = createEvent(this, "chipClick");
this.chipRemove = createEvent(this, "chipRemove");
this.inheritedAttributes = {};
/** Active state of chip. */
this.active = false;
/** Custom CSS class to apply to the inner div. */
this.customClass = '';
/** Whether the chip is disabled. */
this.disabled = false;
/** Whether the chip has an error. */
this.hasError = false;
/** The label to display in the chip. */
this.label = '';
/** Whether to show the close icon on right side of the chip. */
this.showRemove = false;
/** The size of the chip. */
this.size = 'md';
/** The variant of the chip. */
this.variant = 'filled';
this.handleKeyDown = (event) => {
if (!this.disabled &&
(event.key === KEY.Enter || event.key === KEY.Space)) {
event.preventDefault();
this.chipClick.emit(event);
}
};
this.handleKeyUp = (event) => {
if (!this.disabled && event.key === KEY.Escape) {
event.preventDefault();
this.chipRemove.emit(event);
}
};
this.handleChipClick = (event) => {
if (!this.disabled) {
this.chipClick.emit(event);
}
};
this.handleChipRemove = (event) => {
if (!this.disabled) {
this.chipRemove.emit(event);
}
};
}
componentWillLoad() {
if (!this.el.ariaLabel) {
this.el.ariaLabel = this.label || 'Chip';
}
this.inheritedAttributes = inheritAriaAttributes(this.el);
}
getClasses() {
const classList = ['modus-wc-chip', 'modus-wc-btn'];
const propClasses = convertPropsToClasses({
active: this.active,
disabled: this.disabled,
hasError: this.hasError,
size: this.size,
variant: this.variant,
});
// The order CSS classes are added matters to CSS specificity
if (propClasses)
classList.push(propClasses);
if (this.customClass)
classList.push(this.customClass);
return classList.join(' ');
}
render() {
return (h(Host, { key: 'e4cc13daefdfe5aa9444572364eedccdf8881f64' }, h("button", Object.assign({ key: 'c02f8289ccd8b5787396dc9adcbff628f217d95d', "aria-disabled": this.disabled, class: this.getClasses(), disabled: this.disabled, onClick: this.handleChipClick, onKeyDown: this.handleKeyDown, onKeyUp: this.handleKeyUp, tabIndex: 0, type: "button" }, this.inheritedAttributes), h("slot", { key: '553d3f41635b4d0a3bc91acbe9c4449856780275' }), this.label && h("span", { key: '0a8ed9107a6ccf10a7bdaf940c9a533a5371e5ff', class: "modus-wc-chip-label" }, this.label), this.showRemove && (h(CancelCircleSolidIcon, { key: '69272d5d6545126de654f3c4311f784ad958c4c8', className: "modus-wc-chip-remove-icon", onClick: this.handleChipRemove })))));
}
get el() { return this; }
static get style() { return modusWcChipCss; }
}, [4, "modus-wc-chip", {
"active": [4],
"customClass": [1, "custom-class"],
"disabled": [4],
"hasError": [4, "has-error"],
"label": [1],
"showRemove": [4, "show-remove"],
"size": [1],
"variant": [1]
}]);
function defineCustomElement() {
if (typeof customElements === "undefined") {
return;
}
const components = ["modus-wc-chip"];
components.forEach(tagName => { switch (tagName) {
case "modus-wc-chip":
if (!customElements.get(tagName)) {
customElements.define(tagName, ModusWcChip);
}
break;
} });
}
export { ModusWcChip as M, defineCustomElement as d };