@duyluonganduin/acl-web-components 0.0.26 → 0.0.28
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +2 -0
- package/dist/acl-web-components.cjs +1 -1
- package/dist/acl-web-components.d.ts +107 -0
- package/dist/acl-web-components.iife.js +309 -119
- package/dist/acl-web-components.js +86 -75
- package/dist/anduin-navigation-BgreqvTv.cjs +2610 -0
- package/dist/{anduin-suggestion-D3Sl4vcX.js → anduin-navigation-DjjsY3gb.js} +1654 -1201
- package/dist/jsx.d.ts +50 -0
- package/dist/react.cjs +1 -1
- package/dist/react.d.ts +119 -0
- package/dist/react.js +132 -104
- package/package.json +1 -1
- package/dist/anduin-suggestion-ChXDlWeZ.cjs +0 -2420
package/README.md
CHANGED
|
@@ -191,6 +191,8 @@ Once enabled, all component props are typed:
|
|
|
191
191
|
| Tag | `<anduin-tag>` | `variant`, `icon`, `disabled` |
|
|
192
192
|
| Tag Close | `<anduin-tag-close>` | — |
|
|
193
193
|
| Textarea | `<anduin-textarea>` | `value`, `disabled`, `readonly`, `placeholder`, `inputid`, `rows`, `status` |
|
|
194
|
+
| Toggle Group | `<anduin-toggle-group>` | `mode` (`single`/`multiple`), `default-value`, `value`, `size`, `variant`, `gap` |
|
|
195
|
+
| Toggle Group Item | `<anduin-toggle-group-item>` | `value`, `start-icon`, `disabled` |
|
|
194
196
|
| Tooltip | `<anduin-tooltip>` | `placement`, `disabled` |
|
|
195
197
|
| Tooltip Trigger | `<anduin-tooltip-trigger>` | — |
|
|
196
198
|
| Tooltip Content | `<anduin-tooltip-content>` | — |
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("./anduin-
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("./anduin-navigation-BgreqvTv.cjs"),i=':root{--color-gray-0: oklch(1 0 0);--color-gray-1: oklch(.9846 .0017 247.84);--color-gray-2: oklch(.9515 .0046 258.32);--color-gray-3: oklch(.9336 .0058 264.53);--color-gray-4: oklch(.8618 .0141 258.35);--color-gray-5: oklch(.7073 .0268 263.28);--color-gray-6: oklch(.6528 .0316 266.24);--color-gray-7: oklch(.5371 .0337 264.24);--color-gray-8: oklch(.3544 .0326 260.94);--color-gray-9: oklch(.2776 .0341 255.81);--color-danger-1: oklch(.9437 .0174 17.47);--color-danger-2: oklch(.8643 .0573 18.32);--color-danger-3: oklch(.712 .1517 21.64);--color-danger-4: oklch(.5948 .2165 26.91);--color-danger-5: oklch(.531 .2147 28.91);--color-primary-1: oklch(.9474 .0256 221.57);--color-primary-2: oklch(.8652 .066 236.86);--color-primary-3: oklch(.7219 .1335 240.15);--color-primary-4: oklch(.5679 .1784 254.76);--color-primary-5: oklch(.4682 .1548 255.23);--color-success-1: oklch(.9276 .0541 150.91);--color-success-2: oklch(.8592 .1078 149.75);--color-success-3: oklch(.6953 .1711 149.14);--color-success-4: oklch(.6149 .1634 148.21);--color-success-5: oklch(.5075 .136 146.46);--color-warning-1: oklch(.9549 .0496 88.08);--color-warning-2: oklch(.912 .0811 83.56);--color-warning-3: oklch(.8282 .1628 78.73);--color-warning-4: oklch(.7325 .1512 75.97);--color-warning-5: oklch(.5329 .1098 82);--color-semantic-gray-0: oklch(1 0 0);--color-semantic-gray-1: oklch(.9846 .0017 247.84);--color-semantic-gray-2: oklch(.9515 .0046 258.32);--color-semantic-gray-3: oklch(.9336 .0058 264.53);--color-semantic-gray-4: oklch(.8618 .0141 258.35);--color-semantic-gray-5: oklch(.7073 .0268 263.28);--color-semantic-gray-6: oklch(.6528 .0316 266.24);--color-semantic-gray-7: oklch(.5371 .0337 264.24);--color-semantic-gray-8: oklch(.3544 .0326 260.94);--color-semantic-gray-9: oklch(.2776 .0341 255.81);--color-semantic-danger-1: oklch(.9437 .0174 17.47);--color-semantic-danger-2: oklch(.8643 .0573 18.32);--color-semantic-danger-3: oklch(.712 .1517 21.64);--color-semantic-danger-4: oklch(.5948 .2165 26.91);--color-semantic-danger-5: oklch(.531 .2147 28.91);--color-semantic-primary-1: oklch(.9474 .0256 221.57);--color-semantic-primary-2: oklch(.8652 .066 236.86);--color-semantic-primary-3: oklch(.7219 .1335 240.15);--color-semantic-primary-4: oklch(.5679 .1784 254.76);--color-semantic-primary-5: oklch(.4682 .1548 255.23);--color-semantic-success-1: oklch(.9276 .0541 150.91);--color-semantic-success-2: oklch(.8592 .1078 149.75);--color-semantic-success-3: oklch(.6953 .1711 149.14);--color-semantic-success-4: oklch(.6149 .1634 148.21);--color-semantic-success-5: oklch(.5075 .136 146.46);--color-semantic-warning-1: oklch(.9549 .0496 88.08);--color-semantic-warning-2: oklch(.912 .0811 83.56);--color-semantic-warning-3: oklch(.8282 .1628 78.73);--color-semantic-warning-4: oklch(.7325 .1512 75.97);--color-semantic-warning-5: oklch(.5329 .1098 82);--color-purple-50: oklch(.9676 .016 286.1);--color-purple-100: oklch(.9434 .0255 288.32);--color-purple-200: oklch(.8927 .0519 287.71);--color-purple-300: oklch(.81 .0925 287.61);--color-purple-400: oklch(.7048 .1478 287.77);--color-purple-500: oklch(.5961 .2043 286.53);--color-purple-600: oklch(.5316 .2303 286.64);--color-purple-700: oklch(.471 .2307 285.3);--color-purple-800: oklch(.4148 .2014 285.43);--color-purple-900: oklch(.3654 .17 286.37);--color-purple-950: oklch(.2734 .1288 284.42);--color-white: var(--color-gray-0);--font-sans: system-ui, -apple-system, Roboto, Oxygen, Cantarell, Ubuntu, "Segoe UI", sans-serif;--font-mono: monospace;--text-9: 9px;--text-10: 10px;--text-11: 11px;--text-12: 12px;--text-13: 13px;--text-15: 15px;--text-17: 17px;--text-20: 20px;--text-23: 23px;--text-26: 26px;--text-30: 30px;--text-35: 35px;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--leading-16: 16px;--leading-20: 20px;--leading-24: 24px;--leading-28: 28px;--leading-32: 32px;--leading-40: 40px;--leading-44: 44px;--leading-r1p5: 1.5;--radius-0: 0;--radius-2: 2px;--radius-3: 3px;--radius-4: 4px;--radius-6: 6px;--radius-8: 8px;--radius-12: 12px;--radius-16: 16px;--radius-20: 20px;--radius-24: 24px;--radius-full: 9999px;--shadow-1: 0px 1px 2px rgba(29, 41, 57, .07);--shadow-2: 0px 1px 2px rgba(29, 41, 57, .04), 0px 2px 8px rgba(29, 41, 57, .08);--shadow-3: 0px 2px 8px rgba(29, 41, 57, .08), 0px 8px 24px rgba(29, 41, 57, .12);--shadow-4: 0px 4px 8px rgba(29, 41, 57, .08), 0px 16px 48px rgba(29, 41, 57, .16);--spacing-px: 1px;--spacing-0: 0;--spacing-2: 2px;--spacing-4: 4px;--spacing-6: 6px;--spacing-8: 8px;--spacing-12: 12px;--spacing-16: 16px;--spacing-20: 20px;--spacing-24: 24px;--spacing-28: 28px;--spacing-32: 32px;--spacing-40: 40px;--spacing-48: 48px;--spacing-56: 56px;--spacing-64: 64px;--spacing-128: 128px;--spacing-256: 256px;--z-0: 0;--z-1: 1;--z-2: 2;--z-3: 3;--z-4: 4;--z-5: 5;--z-999: 999;--z-9999: 9999}body{font-family:var(--font-sans);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:var(--text-13)}';if(typeof document<"u"&&!document.getElementById("acl-tokens")){const o=document.createElement("style");o.id="acl-tokens",o.textContent=i,document.head.appendChild(o)}exports.AnduinAvatar=n.AnduinAvatar;exports.AnduinBadge=n.AnduinBadge;exports.AnduinBadgeCount=n.AnduinBadgeCount;exports.AnduinButton=n.AnduinButton;exports.AnduinCallout=n.AnduinCallout;exports.AnduinCheckbox=n.AnduinCheckbox;exports.AnduinDivider=n.AnduinDivider;exports.AnduinDot=n.AnduinDot;exports.AnduinDrawer=n.AnduinDrawer;exports.AnduinDrawerClose=n.AnduinDrawerClose;exports.AnduinDropdown=n.AnduinDropdown;exports.AnduinField=n.AnduinField;exports.AnduinFieldDescription=n.AnduinFieldDescription;exports.AnduinFieldError=n.AnduinFieldError;exports.AnduinFieldGroup=n.AnduinFieldGroup;exports.AnduinFieldLabel=n.AnduinFieldLabel;exports.AnduinFileIcon=n.AnduinFileIcon;exports.AnduinIcon=n.AnduinIcon;exports.AnduinInput=n.AnduinInput;exports.AnduinLoadingState=n.AnduinLoadingState;exports.AnduinMenu=n.AnduinMenu;exports.AnduinMenuItem=n.AnduinMenuItem;exports.AnduinModal=n.AnduinModal;exports.AnduinModalClose=n.AnduinModalClose;exports.AnduinNavigation=n.AnduinNavigation;exports.AnduinNavigationItem=n.AnduinNavigationItem;exports.AnduinPopover=n.AnduinPopover;exports.AnduinPopoverClose=n.AnduinPopoverClose;exports.AnduinProgress=n.AnduinProgress;exports.AnduinRadio=n.AnduinRadio;exports.AnduinRadioGroup=n.AnduinRadioGroup;exports.AnduinSkeleton=n.AnduinSkeleton;exports.AnduinSparkleSpinner=n.AnduinSparkleSpinner;exports.AnduinSpinner=n.AnduinSpinner;exports.AnduinSuggestion=n.AnduinSuggestion;exports.AnduinSwitcher=n.AnduinSwitcher;exports.AnduinTabContent=n.AnduinTabContent;exports.AnduinTabTrigger=n.AnduinTabTrigger;exports.AnduinTabs=n.AnduinTabs;exports.AnduinTabsList=n.AnduinTabsList;exports.AnduinTag=n.AnduinTag;exports.AnduinTagClose=n.AnduinTagClose;exports.AnduinTextarea=n.AnduinTextarea;exports.AnduinToast=n.AnduinToast;exports.AnduinToaster=n.AnduinToaster;exports.AnduinToggleGroup=n.AnduinToggleGroup;exports.AnduinToggleGroupItem=n.AnduinToggleGroupItem;exports.AnduinTooltip=n.AnduinTooltip;exports.AnduinTooltipContent=n.AnduinTooltipContent;exports.AnduinTooltipTrigger=n.AnduinTooltipTrigger;exports.AnduinWell=n.AnduinWell;exports.AnduinWellClose=n.AnduinWellClose;exports.BADGE_STYLES=n.BADGE_STYLES;exports.CHECKBOX_CHANGE=n.CHECKBOX_CHANGE;exports.DRAWER_AFTER_CLOSE_EVENT=n.DRAWER_AFTER_CLOSE_EVENT;exports.DRAWER_CLOSE_EVENT=n.DRAWER_CLOSE_EVENT;exports.DROPDOWN_CHANGE=n.DROPDOWN_CHANGE;exports.FIELD_LABEL_CLICK=n.FIELD_LABEL_CLICK;exports.FIELD_LABEL_CLICK_COORDINATED=n.FIELD_LABEL_CLICK_COORDINATED;exports.FILE_ICONS=n.FILE_ICONS;exports.INPUT_CHANGE=n.INPUT_CHANGE;exports.INPUT_CLEAR=n.INPUT_CLEAR;exports.MENU_ITEM_CLICK=n.MENU_ITEM_CLICK;exports.MODAL_AFTER_CLOSE_EVENT=n.MODAL_AFTER_CLOSE_EVENT;exports.MODAL_CLOSE_EVENT=n.MODAL_CLOSE_EVENT;exports.NAVIGATION_CHANGE=n.NAVIGATION_CHANGE;exports.NAVIGATION_ITEM_CLICK=n.NAVIGATION_ITEM_CLICK;exports.POPOVER_CLOSE=n.POPOVER_CLOSE;exports.RADIO_CHANGE=n.RADIO_CHANGE;exports.RADIO_GROUP_CHANGE=n.RADIO_GROUP_CHANGE;exports.SUGGESTION_CHANGE=n.SUGGESTION_CHANGE;exports.SUGGESTION_CLEAR=n.SUGGESTION_CLEAR;exports.SUGGESTION_SELECT=n.SUGGESTION_SELECT;exports.SWITCHER_CHANGE=n.SWITCHER_CHANGE;exports.TAB_CHANGE=n.TAB_CHANGE;exports.TAB_TRIGGER_CLICK=n.TAB_TRIGGER_CLICK;exports.TAB_VALUE_CHANGED=n.TAB_VALUE_CHANGED;exports.TAG_CLOSE_CLICK=n.TAG_CLOSE_CLICK;exports.TEXTAREA_CHANGE=n.TEXTAREA_CHANGE;exports.TOGGLE_GROUP_CHANGE=n.TOGGLE_GROUP_CHANGE;exports.TOGGLE_GROUP_ITEM_CHANGE=n.TOGGLE_GROUP_ITEM_CHANGE;exports.TOGGLE_GROUP_ITEM_CLICK=n.TOGGLE_GROUP_ITEM_CLICK;exports.TOGGLE_GROUP_ITEM_DESELECT=n.TOGGLE_GROUP_ITEM_DESELECT;exports.TOGGLE_GROUP_ITEM_SELECT=n.TOGGLE_GROUP_ITEM_SELECT;exports.TOOLTIP_CONTENT_POPUP_MOUNTED=n.TOOLTIP_CONTENT_POPUP_MOUNTED;exports.TOOLTIP_CONTENT_POPUP_UNMOUNTED=n.TOOLTIP_CONTENT_POPUP_UNMOUNTED;exports.TOOLTIP_HIDE=n.TOOLTIP_HIDE;exports.TOOLTIP_SHOW=n.TOOLTIP_SHOW;exports.TOOLTIP_TRIGGER_MOUNTED=n.TOOLTIP_TRIGGER_MOUNTED;exports.TOOLTIP_VISIBILITY_CHANGED=n.TOOLTIP_VISIBILITY_CHANGED;exports.WELL_CLOSE_CLICK=n.WELL_CLOSE_CLICK;exports.getBadgeVariantClass=n.getBadgeVariantClass;exports.resolveFileIcon=n.resolveFileIcon;exports.toast=n.toast;
|
|
@@ -277,6 +277,51 @@ export declare class AnduinModalClose extends HTMLElement {
|
|
|
277
277
|
private _onClick;
|
|
278
278
|
}
|
|
279
279
|
|
|
280
|
+
/**
|
|
281
|
+
* Horizontal navigation bar — a row of items where exactly one is active.
|
|
282
|
+
* Recommended for navigating between top-level pages of an application.
|
|
283
|
+
*
|
|
284
|
+
* Theming: `theme="light"` (default) or `theme="dark"`. For a custom light
|
|
285
|
+
* theme, set any of these CSS custom properties on the element:
|
|
286
|
+
* --nav-color, --nav-hover-color, --nav-hover-bg,
|
|
287
|
+
* --nav-active-color, --nav-active-bg, --nav-surface
|
|
288
|
+
*/
|
|
289
|
+
export declare class AnduinNavigation extends LitElement {
|
|
290
|
+
static styles: CSSResult;
|
|
291
|
+
/** Initially active item value (uncontrolled usage). */
|
|
292
|
+
defaultValue: string;
|
|
293
|
+
/** Controlled active item value. Leave unset for uncontrolled usage. */
|
|
294
|
+
value: string | null;
|
|
295
|
+
theme: NavigationTheme;
|
|
296
|
+
alignment: NavigationAlignment;
|
|
297
|
+
private internalValue;
|
|
298
|
+
private get isControlled();
|
|
299
|
+
private get selection();
|
|
300
|
+
connectedCallback(): void;
|
|
301
|
+
disconnectedCallback(): void;
|
|
302
|
+
updated(): void;
|
|
303
|
+
private get items();
|
|
304
|
+
private syncItems;
|
|
305
|
+
private onItemClick;
|
|
306
|
+
render(): TemplateResult<1>;
|
|
307
|
+
}
|
|
308
|
+
|
|
309
|
+
export declare class AnduinNavigationItem extends LitElement {
|
|
310
|
+
static styles: CSSResult;
|
|
311
|
+
/** Unique value identifying this item within the bar. */
|
|
312
|
+
value: string;
|
|
313
|
+
/** anduin-icon name shown before the label. */
|
|
314
|
+
startIcon: string;
|
|
315
|
+
/** Renders an <a> instead of a <button> when provided. */
|
|
316
|
+
href: string;
|
|
317
|
+
disabled: boolean;
|
|
318
|
+
selected: boolean;
|
|
319
|
+
theme: NavigationTheme;
|
|
320
|
+
private onClick;
|
|
321
|
+
updated(changed: Map<string, unknown>): void;
|
|
322
|
+
render(): TemplateResult<1>;
|
|
323
|
+
}
|
|
324
|
+
|
|
280
325
|
export declare class AnduinPopover extends LitElement {
|
|
281
326
|
static styles: CSSResult;
|
|
282
327
|
open: boolean;
|
|
@@ -513,6 +558,44 @@ export declare class AnduinToaster extends LitElement {
|
|
|
513
558
|
render(): TemplateResult<1>;
|
|
514
559
|
}
|
|
515
560
|
|
|
561
|
+
export declare class AnduinToggleGroup extends LitElement {
|
|
562
|
+
static styles: CSSResult;
|
|
563
|
+
mode: ToggleGroupMode;
|
|
564
|
+
defaultValue: string;
|
|
565
|
+
/** Controlled selected value (space-separated in multiple mode). Leave unset for uncontrolled usage. */
|
|
566
|
+
value: string | null;
|
|
567
|
+
size: ToggleGroupSize;
|
|
568
|
+
variant: ToggleGroupVariant;
|
|
569
|
+
/** Detach the items into individually rounded pills with 8px gaps, wrapping onto multiple lines. */
|
|
570
|
+
gap: boolean;
|
|
571
|
+
private internalValue;
|
|
572
|
+
private get isControlled();
|
|
573
|
+
private get selection();
|
|
574
|
+
connectedCallback(): void;
|
|
575
|
+
disconnectedCallback(): void;
|
|
576
|
+
updated(): void;
|
|
577
|
+
private get items();
|
|
578
|
+
private syncItems;
|
|
579
|
+
private onItemClick;
|
|
580
|
+
render(): TemplateResult<1>;
|
|
581
|
+
}
|
|
582
|
+
|
|
583
|
+
export declare class AnduinToggleGroupItem extends LitElement {
|
|
584
|
+
static styles: CSSResult;
|
|
585
|
+
value: string;
|
|
586
|
+
startIcon: string;
|
|
587
|
+
disabled: boolean;
|
|
588
|
+
selected: boolean;
|
|
589
|
+
groupSize: ToggleGroupSize;
|
|
590
|
+
groupVariant: ToggleGroupVariant;
|
|
591
|
+
groupMode: ToggleGroupMode;
|
|
592
|
+
/** Called by the parent group when the user's action changes this item's selection. */
|
|
593
|
+
emitSelectionChange(selected: boolean): void;
|
|
594
|
+
updated(changed: Map<string, unknown>): void;
|
|
595
|
+
private onClick;
|
|
596
|
+
render(): TemplateResult<1>;
|
|
597
|
+
}
|
|
598
|
+
|
|
516
599
|
export declare class AnduinTooltip extends LitElement {
|
|
517
600
|
static styles: CSSResult;
|
|
518
601
|
disabled: boolean;
|
|
@@ -642,6 +725,14 @@ export declare const MODAL_AFTER_CLOSE_EVENT = "anduin-after-close";
|
|
|
642
725
|
*/
|
|
643
726
|
export declare const MODAL_CLOSE_EVENT = "anduin-close";
|
|
644
727
|
|
|
728
|
+
export declare const NAVIGATION_CHANGE = "anduin-navigation:change";
|
|
729
|
+
|
|
730
|
+
export declare const NAVIGATION_ITEM_CLICK = "anduin-navigation-item:item-click";
|
|
731
|
+
|
|
732
|
+
export declare type NavigationAlignment = 'left' | 'center' | 'right';
|
|
733
|
+
|
|
734
|
+
export declare type NavigationTheme = 'light' | 'dark';
|
|
735
|
+
|
|
645
736
|
export declare const POPOVER_CLOSE = "anduin-popover:close";
|
|
646
737
|
|
|
647
738
|
export declare const RADIO_CHANGE = "anduin-radio:change";
|
|
@@ -697,6 +788,22 @@ export declare type ToastPosition = "top-left" | "top-center" | "top-right" | "b
|
|
|
697
788
|
|
|
698
789
|
export declare type ToastVariant = "gray" | "primary" | "success" | "warning" | "danger";
|
|
699
790
|
|
|
791
|
+
export declare const TOGGLE_GROUP_CHANGE = "anduin-toggle-group:change";
|
|
792
|
+
|
|
793
|
+
export declare const TOGGLE_GROUP_ITEM_CHANGE = "anduin-toggle-group-item:change";
|
|
794
|
+
|
|
795
|
+
export declare const TOGGLE_GROUP_ITEM_CLICK = "anduin-toggle-group-item:item-click";
|
|
796
|
+
|
|
797
|
+
export declare const TOGGLE_GROUP_ITEM_DESELECT = "anduin-toggle-group-item:deselect";
|
|
798
|
+
|
|
799
|
+
export declare const TOGGLE_GROUP_ITEM_SELECT = "anduin-toggle-group-item:select";
|
|
800
|
+
|
|
801
|
+
export declare type ToggleGroupMode = 'single' | 'multiple';
|
|
802
|
+
|
|
803
|
+
export declare type ToggleGroupSize = 'small' | 'medium' | 'large' | 'free';
|
|
804
|
+
|
|
805
|
+
export declare type ToggleGroupVariant = 'gray' | 'primary';
|
|
806
|
+
|
|
700
807
|
export declare const TOOLTIP_CONTENT_POPUP_MOUNTED = "anduin-tooltip:content-popup-mounted";
|
|
701
808
|
|
|
702
809
|
export declare const TOOLTIP_CONTENT_POPUP_UNMOUNTED = "anduin-tooltip:content-popup-unmounted";
|