revotech-ui-kit 0.0.4-beta → 0.0.6-beta
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/index.ts +1 -1
- package/dist/sw.js +1 -1
- package/dist/sw.js.map +1 -1
- package/package.json +3 -2
- package/src/components/atoms/alert/alert.atom.ts +5 -1
- package/src/components/atoms/button/button.atom.ts +6 -0
- package/src/index.ts +1 -1
- package/dist/183c6c38.js +0 -1
- package/dist/public/globals.css +0 -2215
- package/dist/public/tailwind-lib.css +0 -115
- package/dist/src/assets/icons/arrows.icon.js +0 -20
- package/dist/src/assets/icons/arrows.icon.js.map +0 -1
- package/dist/src/assets/icons/index.js +0 -4
- package/dist/src/assets/icons/index.js.map +0 -1
- package/dist/src/assets/icons/search.icon.js +0 -19
- package/dist/src/assets/icons/search.icon.js.map +0 -1
- package/dist/src/assets/icons/tick.icon.js +0 -20
- package/dist/src/assets/icons/tick.icon.js.map +0 -1
- package/dist/src/components/atoms/alert/alert-description.js +0 -18
- package/dist/src/components/atoms/alert/alert-description.js.map +0 -1
- package/dist/src/components/atoms/alert/alert-title.js +0 -20
- package/dist/src/components/atoms/alert/alert-title.js.map +0 -1
- package/dist/src/components/atoms/alert/alert.atom.js +0 -55
- package/dist/src/components/atoms/alert/alert.atom.js.map +0 -1
- package/dist/src/components/atoms/alert/alert.stories.js +0 -62
- package/dist/src/components/atoms/alert/alert.stories.js.map +0 -1
- package/dist/src/components/atoms/alert/alert.styles.js +0 -21
- package/dist/src/components/atoms/alert/alert.styles.js.map +0 -1
- package/dist/src/components/atoms/alert/alert.types.js +0 -2
- package/dist/src/components/atoms/alert/alert.types.js.map +0 -1
- package/dist/src/components/atoms/badge/badge.atom.js +0 -43
- package/dist/src/components/atoms/badge/badge.atom.js.map +0 -1
- package/dist/src/components/atoms/badge/badge.stories.js +0 -110
- package/dist/src/components/atoms/badge/badge.stories.js.map +0 -1
- package/dist/src/components/atoms/badge/badge.style.js +0 -17
- package/dist/src/components/atoms/badge/badge.style.js.map +0 -1
- package/dist/src/components/atoms/badge/badge.type.js +0 -2
- package/dist/src/components/atoms/badge/badge.type.js.map +0 -1
- package/dist/src/components/atoms/button/button.atom.js +0 -67
- package/dist/src/components/atoms/button/button.atom.js.map +0 -1
- package/dist/src/components/atoms/button/button.stories.js +0 -204
- package/dist/src/components/atoms/button/button.stories.js.map +0 -1
- package/dist/src/components/atoms/button/button.style.js +0 -24
- package/dist/src/components/atoms/button/button.style.js.map +0 -1
- package/dist/src/components/atoms/button/button.type.js +0 -2
- package/dist/src/components/atoms/button/button.type.js.map +0 -1
- package/dist/src/components/atoms/card/card-content.js +0 -17
- package/dist/src/components/atoms/card/card-content.js.map +0 -1
- package/dist/src/components/atoms/card/card-description.js +0 -17
- package/dist/src/components/atoms/card/card-description.js.map +0 -1
- package/dist/src/components/atoms/card/card-footer.js +0 -17
- package/dist/src/components/atoms/card/card-footer.js.map +0 -1
- package/dist/src/components/atoms/card/card-header.js +0 -17
- package/dist/src/components/atoms/card/card-header.js.map +0 -1
- package/dist/src/components/atoms/card/card-title.js +0 -17
- package/dist/src/components/atoms/card/card-title.js.map +0 -1
- package/dist/src/components/atoms/card/card.atom.js +0 -25
- package/dist/src/components/atoms/card/card.atom.js.map +0 -1
- package/dist/src/components/atoms/card/card.stories.js +0 -136
- package/dist/src/components/atoms/card/card.stories.js.map +0 -1
- package/dist/src/components/atoms/checkbox/checkbox.atom.js +0 -87
- package/dist/src/components/atoms/checkbox/checkbox.atom.js.map +0 -1
- package/dist/src/components/atoms/checkbox/checkbox.stories.js +0 -244
- package/dist/src/components/atoms/checkbox/checkbox.stories.js.map +0 -1
- package/dist/src/components/atoms/checkbox/checkbox.style.js +0 -3
- package/dist/src/components/atoms/checkbox/checkbox.style.js.map +0 -1
- package/dist/src/components/atoms/checkbox/checkbox.type.js +0 -2
- package/dist/src/components/atoms/checkbox/checkbox.type.js.map +0 -1
- package/dist/src/components/atoms/combo-box/combo-box-input.js +0 -47
- package/dist/src/components/atoms/combo-box/combo-box-input.js.map +0 -1
- package/dist/src/components/atoms/combo-box/combo-box-item.js +0 -85
- package/dist/src/components/atoms/combo-box/combo-box-item.js.map +0 -1
- package/dist/src/components/atoms/combo-box/combo-box-list.js +0 -67
- package/dist/src/components/atoms/combo-box/combo-box-list.js.map +0 -1
- package/dist/src/components/atoms/combo-box/combo-box.atom.js +0 -199
- package/dist/src/components/atoms/combo-box/combo-box.atom.js.map +0 -1
- package/dist/src/components/atoms/combo-box/combo-box.stories.js +0 -86
- package/dist/src/components/atoms/combo-box/combo-box.stories.js.map +0 -1
- package/dist/src/components/atoms/command-empty/command-empty.atom.js +0 -54
- package/dist/src/components/atoms/command-empty/command-empty.atom.js.map +0 -1
- package/dist/src/components/atoms/command-group/command-group.atom.js +0 -71
- package/dist/src/components/atoms/command-group/command-group.atom.js.map +0 -1
- package/dist/src/components/atoms/command-item/command-item.atom.js +0 -80
- package/dist/src/components/atoms/command-item/command-item.atom.js.map +0 -1
- package/dist/src/components/atoms/command-list/command-list.atom.js +0 -36
- package/dist/src/components/atoms/command-list/command-list.atom.js.map +0 -1
- package/dist/src/components/atoms/command-separator/command-separator.atom.js +0 -52
- package/dist/src/components/atoms/command-separator/command-separator.atom.js.map +0 -1
- package/dist/src/components/atoms/dialog/dialog-close.js +0 -47
- package/dist/src/components/atoms/dialog/dialog-close.js.map +0 -1
- package/dist/src/components/atoms/dialog/dialog-content.js +0 -72
- package/dist/src/components/atoms/dialog/dialog-content.js.map +0 -1
- package/dist/src/components/atoms/dialog/dialog-footer.js +0 -22
- package/dist/src/components/atoms/dialog/dialog-footer.js.map +0 -1
- package/dist/src/components/atoms/dialog/dialog-header.js +0 -40
- package/dist/src/components/atoms/dialog/dialog-header.js.map +0 -1
- package/dist/src/components/atoms/dialog/dialog-overly.js +0 -20
- package/dist/src/components/atoms/dialog/dialog-overly.js.map +0 -1
- package/dist/src/components/atoms/dialog/dialog-trigger.js +0 -54
- package/dist/src/components/atoms/dialog/dialog-trigger.js.map +0 -1
- package/dist/src/components/atoms/dialog/dialog.atom.js +0 -79
- package/dist/src/components/atoms/dialog/dialog.atom.js.map +0 -1
- package/dist/src/components/atoms/dialog/dialog.stories.js +0 -88
- package/dist/src/components/atoms/dialog/dialog.stories.js.map +0 -1
- package/dist/src/components/atoms/dropdownMenu/dropdown-menu-checkbox-Item.js +0 -117
- package/dist/src/components/atoms/dropdownMenu/dropdown-menu-checkbox-Item.js.map +0 -1
- package/dist/src/components/atoms/dropdownMenu/dropdown-menu-content.js +0 -81
- package/dist/src/components/atoms/dropdownMenu/dropdown-menu-content.js.map +0 -1
- package/dist/src/components/atoms/dropdownMenu/dropdown-menu-group.js +0 -71
- package/dist/src/components/atoms/dropdownMenu/dropdown-menu-group.js.map +0 -1
- package/dist/src/components/atoms/dropdownMenu/dropdown-menu-item.js +0 -80
- package/dist/src/components/atoms/dropdownMenu/dropdown-menu-item.js.map +0 -1
- package/dist/src/components/atoms/dropdownMenu/dropdown-menu-radio-item.js +0 -118
- package/dist/src/components/atoms/dropdownMenu/dropdown-menu-radio-item.js.map +0 -1
- package/dist/src/components/atoms/dropdownMenu/dropdown-menu-seperator.js +0 -52
- package/dist/src/components/atoms/dropdownMenu/dropdown-menu-seperator.js.map +0 -1
- package/dist/src/components/atoms/dropdownMenu/dropdown-menu-shortcut.js +0 -20
- package/dist/src/components/atoms/dropdownMenu/dropdown-menu-shortcut.js.map +0 -1
- package/dist/src/components/atoms/dropdownMenu/dropdown-menu.atom.js +0 -79
- package/dist/src/components/atoms/dropdownMenu/dropdown-menu.atom.js.map +0 -1
- package/dist/src/components/atoms/dropdownMenu/dropdownMenu.stories.js +0 -211
- package/dist/src/components/atoms/dropdownMenu/dropdownMenu.stories.js.map +0 -1
- package/dist/src/components/atoms/dropdownMenu/dropdownMenu.style.js +0 -4
- package/dist/src/components/atoms/dropdownMenu/dropdownMenu.style.js.map +0 -1
- package/dist/src/components/atoms/index.js +0 -14
- package/dist/src/components/atoms/index.js.map +0 -1
- package/dist/src/components/atoms/input/input.atom.js +0 -93
- package/dist/src/components/atoms/input/input.atom.js.map +0 -1
- package/dist/src/components/atoms/input/input.stories.js +0 -382
- package/dist/src/components/atoms/input/input.stories.js.map +0 -1
- package/dist/src/components/atoms/input/input.styles.js +0 -2
- package/dist/src/components/atoms/input/input.styles.js.map +0 -1
- package/dist/src/components/atoms/input/input.type.js +0 -2
- package/dist/src/components/atoms/input/input.type.js.map +0 -1
- package/dist/src/components/atoms/label/label.atom.js +0 -68
- package/dist/src/components/atoms/label/label.atom.js.map +0 -1
- package/dist/src/components/atoms/label/label.stories.js +0 -85
- package/dist/src/components/atoms/label/label.stories.js.map +0 -1
- package/dist/src/components/atoms/label/label.style.js +0 -3
- package/dist/src/components/atoms/label/label.style.js.map +0 -1
- package/dist/src/components/atoms/popover/popover-content.js +0 -64
- package/dist/src/components/atoms/popover/popover-content.js.map +0 -1
- package/dist/src/components/atoms/popover/popover-trigger.js +0 -51
- package/dist/src/components/atoms/popover/popover-trigger.js.map +0 -1
- package/dist/src/components/atoms/popover/popover.atom.js +0 -40
- package/dist/src/components/atoms/popover/popover.atom.js.map +0 -1
- package/dist/src/components/atoms/popover/popover.stories.js +0 -69
- package/dist/src/components/atoms/popover/popover.stories.js.map +0 -1
- package/dist/src/components/atoms/popover/popover.style.js +0 -21
- package/dist/src/components/atoms/popover/popover.style.js.map +0 -1
- package/dist/src/components/atoms/popover/popover.types.js +0 -4
- package/dist/src/components/atoms/popover/popover.types.js.map +0 -1
- package/dist/src/components/atoms/toggle/defs.js +0 -30
- package/dist/src/components/atoms/toggle/defs.js.map +0 -1
- package/dist/src/components/atoms/toggle/toggle.atom.js +0 -72
- package/dist/src/components/atoms/toggle/toggle.atom.js.map +0 -1
- package/dist/src/components/atoms/toggle/toggle.stories.js +0 -189
- package/dist/src/components/atoms/toggle/toggle.stories.js.map +0 -1
- package/dist/src/components/atoms/toggle/toggle.style.js +0 -19
- package/dist/src/components/atoms/toggle/toggle.style.js.map +0 -1
- package/dist/src/components/command/command.js +0 -410
- package/dist/src/components/command/command.js.map +0 -1
- package/dist/src/components/command/command.stories.js +0 -153
- package/dist/src/components/command/command.stories.js.map +0 -1
- package/dist/src/components/index.js +0 -3
- package/dist/src/components/index.js.map +0 -1
- package/dist/src/components/molecules/command/command.molecules.js +0 -27
- package/dist/src/components/molecules/command/command.molecules.js.map +0 -1
- package/dist/src/components/molecules/command-input/command-input.atom.js +0 -127
- package/dist/src/components/molecules/command-input/command-input.atom.js.map +0 -1
- package/dist/src/components/molecules/dropdownMenu/dropdownMenu.molecules.js +0 -2
- package/dist/src/components/molecules/dropdownMenu/dropdownMenu.molecules.js.map +0 -1
- package/dist/src/components/molecules/index.js +0 -2
- package/dist/src/components/molecules/index.js.map +0 -1
- package/dist/src/helpers/base-element.js +0 -64
- package/dist/src/helpers/base-element.js.map +0 -1
- package/dist/src/helpers/index.js +0 -4
- package/dist/src/helpers/index.js.map +0 -1
- package/dist/src/helpers/mouse-conroller.helper.js +0 -33
- package/dist/src/helpers/mouse-conroller.helper.js.map +0 -1
- package/dist/src/helpers/style.helpers.js +0 -6
- package/dist/src/helpers/style.helpers.js.map +0 -1
- package/dist/src/index.js +0 -2
- package/dist/src/index.js.map +0 -1
- package/dist/src/interfaces/actionable.interface.js +0 -2
- package/dist/src/interfaces/actionable.interface.js.map +0 -1
- package/dist/src/interfaces/atomic.interface.js +0 -2
- package/dist/src/interfaces/atomic.interface.js.map +0 -1
- package/dist/src/interfaces/changeable.interface.js +0 -2
- package/dist/src/interfaces/changeable.interface.js.map +0 -1
- package/dist/src/interfaces/child-support-atomic.interface.js +0 -2
- package/dist/src/interfaces/child-support-atomic.interface.js.map +0 -1
- package/dist/src/interfaces/index.js +0 -7
- package/dist/src/interfaces/index.js.map +0 -1
- package/dist/src/interfaces/intractable.interface.js +0 -2
- package/dist/src/interfaces/intractable.interface.js.map +0 -1
- package/dist/src/interfaces/variant.interface.js +0 -2
- package/dist/src/interfaces/variant.interface.js.map +0 -1
- package/dist/src/lib/index.js +0 -2
- package/dist/src/lib/index.js.map +0 -1
- package/dist/src/lib/next/next.lib.js +0 -2
- package/dist/src/lib/next/next.lib.js.map +0 -1
- package/dist/src/lib/react/react.lib.js +0 -16
- package/dist/src/lib/react/react.lib.js.map +0 -1
- package/dist/src/lib/tw-styles.js +0 -1956
- package/dist/src/lib/tw-styles.js.map +0 -1
- package/dist/src/styles/index.js +0 -2
- package/dist/src/styles/index.js.map +0 -1
- package/dist/src/styles/tw.styles.js +0 -2218
- package/dist/src/styles/tw.styles.js.map +0 -1
- package/dist/src/wc-ui-app.js +0 -88
- package/dist/src/wc-ui-app.js.map +0 -1
- package/dist/test/wc-ui-app.test.js +0 -18
- package/dist/test/wc-ui-app.test.js.map +0 -1
- package/dist/tsconfig.tsbuildinfo +0 -1
@@ -1,19 +0,0 @@
|
|
1
|
-
import { cva } from 'class-variance-authority';
|
2
|
-
export const toggleStyle = cva('inline-flex items-center justify-center rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=on]:bg-accent data-[state=on]:text-accent-foreground bg-transparent h-10 px-3', {
|
3
|
-
variants: {
|
4
|
-
variant: {
|
5
|
-
default: ` hover:bg-muted hover:text-muted-foreground`,
|
6
|
-
outline: ` border border-input hover:bg-accent hover:text-accent-foreground`,
|
7
|
-
},
|
8
|
-
size: {
|
9
|
-
sm: 'h-9 px-2.5',
|
10
|
-
md: 'h-10 px-3',
|
11
|
-
lg: 'h-11 px-5',
|
12
|
-
},
|
13
|
-
},
|
14
|
-
defaultVariants: {
|
15
|
-
variant: 'default',
|
16
|
-
size: 'sm',
|
17
|
-
},
|
18
|
-
});
|
19
|
-
//# sourceMappingURL=toggle.style.js.map
|
@@ -1 +0,0 @@
|
|
1
|
-
{"version":3,"file":"toggle.style.js","sourceRoot":"","sources":["../../../../../src/components/atoms/toggle/toggle.style.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,0BAA0B,CAAC;AAE/C,MAAM,CAAC,MAAM,WAAW,GAAG,GAAG,CAC5B,gWAAgW,EAChW;IACE,QAAQ,EAAE;QACR,OAAO,EAAE;YACP,OAAO,EAAE,6CAA6C;YACtD,OAAO,EAAE,mEAAmE;SAC7E;QACD,IAAI,EAAE;YACJ,EAAE,EAAE,YAAY;YAChB,EAAE,EAAE,WAAW;YACf,EAAE,EAAE,WAAW;SAChB;KACF;IACD,eAAe,EAAE;QACf,OAAO,EAAE,SAAS;QAClB,IAAI,EAAE,IAAI;KACX;CACF,CACF,CAAC","sourcesContent":["import { cva } from 'class-variance-authority';\n\nexport const toggleStyle = cva(\n 'inline-flex items-center justify-center rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=on]:bg-accent data-[state=on]:text-accent-foreground bg-transparent h-10 px-3',\n {\n variants: {\n variant: {\n default: ` hover:bg-muted hover:text-muted-foreground`,\n outline: ` border border-input hover:bg-accent hover:text-accent-foreground`,\n },\n size: {\n sm: 'h-9 px-2.5',\n md: 'h-10 px-3',\n lg: 'h-11 px-5',\n },\n },\n defaultVariants: {\n variant: 'default',\n size: 'sm',\n },\n }\n);\n"]}
|
@@ -1,410 +0,0 @@
|
|
1
|
-
var CommandGroup_1, CommandSeparator_1, CommandEmpty_1, CommandItem_1;
|
2
|
-
import { __decorate } from "tslib";
|
3
|
-
import { LitElement, html, css, nothing } from 'lit';
|
4
|
-
import { property, customElement, queryAssignedElements, } from 'lit/decorators.js';
|
5
|
-
import { cn } from '../../helpers';
|
6
|
-
import { TWStyles } from '../../styles';
|
7
|
-
let Command = class Command extends LitElement {
|
8
|
-
render() {
|
9
|
-
return html `
|
10
|
-
<div
|
11
|
-
class="${cn('flex h-full w-full flex-col overflow-hidden rounded-md bg-popover text-popover-foreground border shadow-md', this.className)}"
|
12
|
-
id="rtgcmdr1"
|
13
|
-
rtgcmd-root
|
14
|
-
>
|
15
|
-
<slot></slot>
|
16
|
-
</div>
|
17
|
-
`;
|
18
|
-
}
|
19
|
-
};
|
20
|
-
Command.styles = [css ``, TWStyles];
|
21
|
-
__decorate([
|
22
|
-
queryAssignedElements({ selector: 'input[rtgcmd-input]' })
|
23
|
-
], Command.prototype, "_input", void 0);
|
24
|
-
Command = __decorate([
|
25
|
-
customElement('rtg-command')
|
26
|
-
], Command);
|
27
|
-
export { Command };
|
28
|
-
let CommandList = class CommandList extends LitElement {
|
29
|
-
get identifier() {
|
30
|
-
var _a, _b;
|
31
|
-
const parent = (_b = (_a = this.parentElement) === null || _a === void 0 ? void 0 : _a.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector('div[rtgcmd-root]');
|
32
|
-
if (parent) {
|
33
|
-
return `${parent.getAttribute('id')}l`;
|
34
|
-
}
|
35
|
-
return `rtgcmdrxl`;
|
36
|
-
}
|
37
|
-
render() {
|
38
|
-
return html `
|
39
|
-
<div
|
40
|
-
class="${cn('max-h-[300px] overflow-y-auto overflow-x-hidden', this.className)}"
|
41
|
-
role="listbox"
|
42
|
-
id="${this.identifier}"
|
43
|
-
style="--rtgcmd-list-height: 265.0px;"
|
44
|
-
rtgcmd-list
|
45
|
-
>
|
46
|
-
<div>
|
47
|
-
<slot></slot>
|
48
|
-
</div>
|
49
|
-
</div>
|
50
|
-
`;
|
51
|
-
}
|
52
|
-
};
|
53
|
-
CommandList.styles = [css ``, TWStyles];
|
54
|
-
CommandList = __decorate([
|
55
|
-
customElement('rtg-command-list')
|
56
|
-
], CommandList);
|
57
|
-
export { CommandList };
|
58
|
-
let CommandGroup = CommandGroup_1 = class CommandGroup extends LitElement {
|
59
|
-
constructor() {
|
60
|
-
super(...arguments);
|
61
|
-
this.heading = '';
|
62
|
-
this._id = '';
|
63
|
-
this._hidden = '';
|
64
|
-
}
|
65
|
-
get identifier() {
|
66
|
-
var _a, _b;
|
67
|
-
if (this._id !== '') {
|
68
|
-
return this._id;
|
69
|
-
}
|
70
|
-
const parent = (_b = (_a = this.parentElement) === null || _a === void 0 ? void 0 : _a.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector('div[rtgcmd-list]');
|
71
|
-
if (parent) {
|
72
|
-
this._id = `${parent.getAttribute('id')}g${CommandGroup_1._counter++}`;
|
73
|
-
}
|
74
|
-
else {
|
75
|
-
this._id = `rtgcmdrxlxg${CommandGroup_1._counter++}`;
|
76
|
-
}
|
77
|
-
return this._id;
|
78
|
-
}
|
79
|
-
render() {
|
80
|
-
// eslint-disable-next-line lit/attribute-value-entities
|
81
|
-
const c = 'overflow-hidden p-1 text-foreground [&_[rtgcmd-group-heading]]:px-2 [&_[rtgcmd-group-heading]]:py-1.5 [&_[rtgcmd-group-heading]]:text-xs [&_[rtgcmd-group-heading]]:font-medium [&_[rtgcmd-group-heading]]:text-muted-foreground';
|
82
|
-
return html `${this._hidden === 'true'
|
83
|
-
? nothing
|
84
|
-
: html `
|
85
|
-
<div
|
86
|
-
class="${c}"
|
87
|
-
rtgcmd-group
|
88
|
-
role="presentation"
|
89
|
-
id="${this.identifier}"
|
90
|
-
>
|
91
|
-
<div
|
92
|
-
rtgcmd-group-heading
|
93
|
-
aria-hidden="true"
|
94
|
-
id="${this.identifier}h"
|
95
|
-
>
|
96
|
-
${this.heading}
|
97
|
-
</div>
|
98
|
-
<div
|
99
|
-
rtgcmd-group-items
|
100
|
-
role="group"
|
101
|
-
aria-labelledby="${this.identifier}h"
|
102
|
-
>
|
103
|
-
<slot></slot>
|
104
|
-
</div>
|
105
|
-
</div>
|
106
|
-
`}`;
|
107
|
-
}
|
108
|
-
};
|
109
|
-
CommandGroup._counter = 0;
|
110
|
-
CommandGroup.styles = [css ``, TWStyles];
|
111
|
-
__decorate([
|
112
|
-
property({ type: String })
|
113
|
-
], CommandGroup.prototype, "heading", void 0);
|
114
|
-
__decorate([
|
115
|
-
property({ attribute: 'id', type: String })
|
116
|
-
], CommandGroup.prototype, "_id", void 0);
|
117
|
-
__decorate([
|
118
|
-
property({ attribute: 'aria-hidden', type: String })
|
119
|
-
], CommandGroup.prototype, "_hidden", void 0);
|
120
|
-
CommandGroup = CommandGroup_1 = __decorate([
|
121
|
-
customElement('rtg-command-group')
|
122
|
-
], CommandGroup);
|
123
|
-
export { CommandGroup };
|
124
|
-
let CommandSeparator = CommandSeparator_1 = class CommandSeparator extends LitElement {
|
125
|
-
constructor() {
|
126
|
-
super(...arguments);
|
127
|
-
this._id = '';
|
128
|
-
this._hidden = '';
|
129
|
-
}
|
130
|
-
get identifier() {
|
131
|
-
var _a, _b;
|
132
|
-
if (this._id !== '') {
|
133
|
-
return this._id;
|
134
|
-
}
|
135
|
-
const parent = (_b = (_a = this.parentElement) === null || _a === void 0 ? void 0 : _a.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector('div[rtgcmd-list]');
|
136
|
-
if (parent) {
|
137
|
-
this._id = `${parent.getAttribute('id')}s${CommandSeparator_1._counter++}`;
|
138
|
-
}
|
139
|
-
else {
|
140
|
-
this._id = `rtgcmdrxlxs${CommandSeparator_1._counter++}`;
|
141
|
-
}
|
142
|
-
return this._id;
|
143
|
-
}
|
144
|
-
render() {
|
145
|
-
return html `${this._hidden === 'true'
|
146
|
-
? nothing
|
147
|
-
: html `
|
148
|
-
<div
|
149
|
-
class="${cn('-mx-1 h-px bg-border', this.className)}"
|
150
|
-
rtgcmd-separator
|
151
|
-
role="separator"
|
152
|
-
id="${this.identifier}"
|
153
|
-
></div>
|
154
|
-
`}`;
|
155
|
-
}
|
156
|
-
};
|
157
|
-
CommandSeparator._counter = 0;
|
158
|
-
CommandSeparator.styles = [css ``, TWStyles];
|
159
|
-
__decorate([
|
160
|
-
property({ type: String })
|
161
|
-
], CommandSeparator.prototype, "_id", void 0);
|
162
|
-
__decorate([
|
163
|
-
property({ attribute: 'aria-hidden', type: String })
|
164
|
-
], CommandSeparator.prototype, "_hidden", void 0);
|
165
|
-
CommandSeparator = CommandSeparator_1 = __decorate([
|
166
|
-
customElement('rtg-command-separator')
|
167
|
-
], CommandSeparator);
|
168
|
-
export { CommandSeparator };
|
169
|
-
let CommandEmpty = CommandEmpty_1 = class CommandEmpty extends LitElement {
|
170
|
-
constructor() {
|
171
|
-
super(...arguments);
|
172
|
-
this._id = '';
|
173
|
-
this._hidden = 'true';
|
174
|
-
}
|
175
|
-
get identifier() {
|
176
|
-
var _a, _b;
|
177
|
-
if (this._id !== '') {
|
178
|
-
return this._id;
|
179
|
-
}
|
180
|
-
const parent = (_b = (_a = this.parentElement) === null || _a === void 0 ? void 0 : _a.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector('div[rtgcmd-list]');
|
181
|
-
if (parent) {
|
182
|
-
this._id = `${parent.getAttribute('id')}e${CommandEmpty_1._counter++}`;
|
183
|
-
}
|
184
|
-
else {
|
185
|
-
this._id = `rtgcmdrxlxe${CommandEmpty_1._counter++}`;
|
186
|
-
}
|
187
|
-
return this._id;
|
188
|
-
}
|
189
|
-
render() {
|
190
|
-
return html `${this._hidden === 'true'
|
191
|
-
? nothing
|
192
|
-
: html `
|
193
|
-
<div
|
194
|
-
class="${cn('py-6 text-center text-sm', this.className)}"
|
195
|
-
rtgcmd-empty
|
196
|
-
role="presentation"
|
197
|
-
id="${this.identifier}"
|
198
|
-
>
|
199
|
-
<slot></slot>
|
200
|
-
</div>
|
201
|
-
`}`;
|
202
|
-
}
|
203
|
-
};
|
204
|
-
CommandEmpty._counter = 0;
|
205
|
-
CommandEmpty.styles = [css ``, TWStyles];
|
206
|
-
__decorate([
|
207
|
-
property({ type: String })
|
208
|
-
], CommandEmpty.prototype, "_id", void 0);
|
209
|
-
__decorate([
|
210
|
-
property({ attribute: 'aria-hidden', type: String })
|
211
|
-
], CommandEmpty.prototype, "_hidden", void 0);
|
212
|
-
CommandEmpty = CommandEmpty_1 = __decorate([
|
213
|
-
customElement('rtg-command-empty')
|
214
|
-
], CommandEmpty);
|
215
|
-
export { CommandEmpty };
|
216
|
-
let CommandItem = CommandItem_1 = class CommandItem extends LitElement {
|
217
|
-
constructor() {
|
218
|
-
super(...arguments);
|
219
|
-
this._id = '';
|
220
|
-
this._hidden = '';
|
221
|
-
this.selected = false;
|
222
|
-
}
|
223
|
-
get identifier() {
|
224
|
-
var _a, _b;
|
225
|
-
if (this._id !== '') {
|
226
|
-
return this._id;
|
227
|
-
}
|
228
|
-
const parent = (_b = (_a = this.parentElement) === null || _a === void 0 ? void 0 : _a.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector('div[rtgcmd-group]');
|
229
|
-
if (parent) {
|
230
|
-
this._id = `${parent.getAttribute('id')}li${CommandItem_1._counter++}`;
|
231
|
-
}
|
232
|
-
else {
|
233
|
-
this._id = `rtgcmdrxgxli${CommandItem_1._counter++}`;
|
234
|
-
}
|
235
|
-
return this._id;
|
236
|
-
}
|
237
|
-
get value() {
|
238
|
-
var _a;
|
239
|
-
return ((_a = this.textContent) === null || _a === void 0 ? void 0 : _a.trim()) || '';
|
240
|
-
}
|
241
|
-
handleMouseEvent(e) {
|
242
|
-
if (e.type === 'mouseover' || e.type === 'focus') {
|
243
|
-
this.selected = true;
|
244
|
-
}
|
245
|
-
if (e.type === 'mouseleave') {
|
246
|
-
this.selected = false;
|
247
|
-
}
|
248
|
-
}
|
249
|
-
render() {
|
250
|
-
return html ` ${this._hidden === 'true'
|
251
|
-
? nothing
|
252
|
-
: html `
|
253
|
-
<div
|
254
|
-
class="${cn('relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none aria-selected:bg-accent aria-selected:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50', this.className)}"
|
255
|
-
@mouseover="${this.handleMouseEvent}"
|
256
|
-
@mouseleave="${this.handleMouseEvent}"
|
257
|
-
@focus="${this.handleMouseEvent}"
|
258
|
-
rtgcmd-item
|
259
|
-
role="option"
|
260
|
-
aria-selected="${this.selected}"
|
261
|
-
data-selected="${this.selected}"
|
262
|
-
data-value="${this.value}"
|
263
|
-
id="${this.identifier}"
|
264
|
-
aria-hidden="${this.hidden}"
|
265
|
-
>
|
266
|
-
<slot></slot>
|
267
|
-
</div>
|
268
|
-
`}`;
|
269
|
-
}
|
270
|
-
};
|
271
|
-
CommandItem._counter = 0;
|
272
|
-
CommandItem.styles = [css ``, TWStyles];
|
273
|
-
__decorate([
|
274
|
-
property({ type: String })
|
275
|
-
], CommandItem.prototype, "_id", void 0);
|
276
|
-
__decorate([
|
277
|
-
property({ attribute: 'aria-hidden', type: String })
|
278
|
-
], CommandItem.prototype, "_hidden", void 0);
|
279
|
-
__decorate([
|
280
|
-
property({ attribute: 'data-value', type: String })
|
281
|
-
], CommandItem.prototype, "value", null);
|
282
|
-
__decorate([
|
283
|
-
property({ type: Boolean })
|
284
|
-
], CommandItem.prototype, "selected", void 0);
|
285
|
-
CommandItem = CommandItem_1 = __decorate([
|
286
|
-
customElement('rtg-command-item')
|
287
|
-
], CommandItem);
|
288
|
-
export { CommandItem };
|
289
|
-
let CommandInput = class CommandInput extends LitElement {
|
290
|
-
constructor() {
|
291
|
-
super(...arguments);
|
292
|
-
this.placeholder = 'Type a command or search...';
|
293
|
-
this._value = '';
|
294
|
-
}
|
295
|
-
get identifier() {
|
296
|
-
var _a, _b;
|
297
|
-
const parent = (_b = (_a = this.parentElement) === null || _a === void 0 ? void 0 : _a.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector('div[rtgcmd-root]');
|
298
|
-
if (parent) {
|
299
|
-
return `${parent.getAttribute('id')}i`;
|
300
|
-
}
|
301
|
-
return `rtgcmdrxi`;
|
302
|
-
}
|
303
|
-
filterItems() {
|
304
|
-
const parent = this.parentElement;
|
305
|
-
if (parent) {
|
306
|
-
let isEmpty = true;
|
307
|
-
const groups = parent.querySelectorAll('rtg-command-list > rtg-command-group');
|
308
|
-
if (groups) {
|
309
|
-
groups.forEach(group => {
|
310
|
-
var _a, _b;
|
311
|
-
let hidden = true;
|
312
|
-
const items = group.querySelectorAll('rtg-command-item');
|
313
|
-
if (items) {
|
314
|
-
items.forEach(item => {
|
315
|
-
const value = (item === null || item === void 0 ? void 0 : item.value) || '';
|
316
|
-
if (value.toLowerCase().includes(this._value.toLowerCase())) {
|
317
|
-
hidden = false;
|
318
|
-
isEmpty = false;
|
319
|
-
item.setAttribute('aria-hidden', 'false');
|
320
|
-
}
|
321
|
-
else {
|
322
|
-
item.setAttribute('aria-hidden', 'true');
|
323
|
-
}
|
324
|
-
});
|
325
|
-
}
|
326
|
-
group.setAttribute('aria-hidden', hidden ? 'true' : 'false');
|
327
|
-
let separator = group.previousElementSibling;
|
328
|
-
if (separator) {
|
329
|
-
separator.setAttribute('aria-hidden', hidden ||
|
330
|
-
((_a = separator.previousElementSibling) === null || _a === void 0 ? void 0 : _a.getAttribute('aria-hidden')) === 'true'
|
331
|
-
? 'true'
|
332
|
-
: 'false');
|
333
|
-
}
|
334
|
-
separator = group.nextElementSibling;
|
335
|
-
if (separator) {
|
336
|
-
separator.setAttribute('aria-hidden', hidden ||
|
337
|
-
((_b = separator.nextElementSibling) === null || _b === void 0 ? void 0 : _b.getAttribute('aria-hidden')) ===
|
338
|
-
'true'
|
339
|
-
? 'true'
|
340
|
-
: 'false');
|
341
|
-
}
|
342
|
-
});
|
343
|
-
}
|
344
|
-
const empty = parent.querySelector('rtg-command-empty');
|
345
|
-
if (empty) {
|
346
|
-
empty.setAttribute('aria-hidden', isEmpty ? 'false' : 'true');
|
347
|
-
}
|
348
|
-
}
|
349
|
-
}
|
350
|
-
handleChange(e) {
|
351
|
-
const input = e.target;
|
352
|
-
if (input) {
|
353
|
-
this._value = input.value;
|
354
|
-
this.filterItems();
|
355
|
-
}
|
356
|
-
}
|
357
|
-
render() {
|
358
|
-
return html `
|
359
|
-
<div
|
360
|
-
class="${cn('flex items-center border-b px-3', this.className)}"
|
361
|
-
name="rtgcmd-input-container"
|
362
|
-
>
|
363
|
-
<svg
|
364
|
-
xmlns="http://www.w3.org/2000/svg"
|
365
|
-
width="24"
|
366
|
-
height="24"
|
367
|
-
viewBox="0 0 24 24"
|
368
|
-
fill="none"
|
369
|
-
stroke="currentColor"
|
370
|
-
stroke-width="2"
|
371
|
-
stroke-linecap="round"
|
372
|
-
stroke-linejoin="round"
|
373
|
-
class="mr-2 h-4 w-4 shrink-0 opacity-50"
|
374
|
-
>
|
375
|
-
<circle cx="11" cy="11" r="8"></circle>
|
376
|
-
<path d="m21 21-4.3-4.3"></path>
|
377
|
-
</svg>
|
378
|
-
<input
|
379
|
-
class="flex h-11 w-full rounded-md bg-transparent py-3 text-sm outline-none placeholder:text-muted-foreground disabled:cursor-not-allowed disabled:opacity-50"
|
380
|
-
placeholder="${this.placeholder}"
|
381
|
-
rtgcmd-input
|
382
|
-
@input="${this.handleChange}"
|
383
|
-
autocomplete="off"
|
384
|
-
autocorrect="off"
|
385
|
-
spellcheck="false"
|
386
|
-
aria-autocomplete="list"
|
387
|
-
role="combobox"
|
388
|
-
aria-expanded="true"
|
389
|
-
aria-controls=":r1oe:"
|
390
|
-
aria-labelledby=":r1of:"
|
391
|
-
id="${this.identifier}"
|
392
|
-
type="text"
|
393
|
-
data-value="${this._value}"
|
394
|
-
/>
|
395
|
-
</div>
|
396
|
-
`;
|
397
|
-
}
|
398
|
-
};
|
399
|
-
CommandInput.styles = [css ``, TWStyles];
|
400
|
-
__decorate([
|
401
|
-
property({ type: String })
|
402
|
-
], CommandInput.prototype, "placeholder", void 0);
|
403
|
-
__decorate([
|
404
|
-
property({ attribute: 'value', type: String })
|
405
|
-
], CommandInput.prototype, "_value", void 0);
|
406
|
-
CommandInput = __decorate([
|
407
|
-
customElement('rtg-command-input')
|
408
|
-
], CommandInput);
|
409
|
-
export { CommandInput };
|
410
|
-
//# sourceMappingURL=command.js.map
|
@@ -1 +0,0 @@
|
|
1
|
-
{"version":3,"file":"command.js","sourceRoot":"","sources":["../../../../src/components/command/command.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, html, css, nothing } from 'lit';\nimport {\n property,\n customElement,\n queryAssignedElements,\n} from 'lit/decorators.js';\nimport { cn } from '../../helpers';\nimport { TWStyles } from '../../styles';\n\n@customElement('rtg-command')\nexport class Command extends LitElement {\n static styles = [css``, TWStyles];\n\n @queryAssignedElements({ selector: 'input[rtgcmd-input]' })\n _input!: Array<HTMLElement>;\n\n render() {\n return html`\n <div\n class=\"${cn(\n 'flex h-full w-full flex-col overflow-hidden rounded-md bg-popover text-popover-foreground border shadow-md',\n this.className\n )}\"\n id=\"rtgcmdr1\"\n rtgcmd-root\n >\n <slot></slot>\n </div>\n `;\n }\n}\n\n@customElement('rtg-command-list')\nexport class CommandList extends LitElement {\n static styles = [css``, TWStyles];\n\n private get identifier() {\n const parent =\n this.parentElement?.shadowRoot?.querySelector('div[rtgcmd-root]');\n if (parent) {\n return `${parent.getAttribute('id')}l`;\n }\n return `rtgcmdrxl`;\n }\n\n render() {\n return html`\n <div\n class=\"${cn(\n 'max-h-[300px] overflow-y-auto overflow-x-hidden',\n this.className\n )}\"\n role=\"listbox\"\n id=\"${this.identifier}\"\n style=\"--rtgcmd-list-height: 265.0px;\"\n rtgcmd-list\n >\n <div>\n <slot></slot>\n </div>\n </div>\n `;\n }\n}\n\n@customElement('rtg-command-group')\nexport class CommandGroup extends LitElement {\n @property({ type: String }) heading = '';\n\n @property({ attribute: 'id', type: String }) _id = '';\n\n @property({ attribute: 'aria-hidden', type: String }) _hidden = '';\n\n private static _counter = 0;\n\n static styles = [css``, TWStyles];\n\n private get identifier() {\n if (this._id !== '') {\n return this._id;\n }\n const parent =\n this.parentElement?.shadowRoot?.querySelector('div[rtgcmd-list]');\n if (parent) {\n this._id = `${parent.getAttribute('id')}g${CommandGroup._counter++}`;\n } else {\n this._id = `rtgcmdrxlxg${CommandGroup._counter++}`;\n }\n return this._id;\n }\n\n render() {\n // eslint-disable-next-line lit/attribute-value-entities\n const c =\n 'overflow-hidden p-1 text-foreground [&_[rtgcmd-group-heading]]:px-2 [&_[rtgcmd-group-heading]]:py-1.5 [&_[rtgcmd-group-heading]]:text-xs [&_[rtgcmd-group-heading]]:font-medium [&_[rtgcmd-group-heading]]:text-muted-foreground';\n return html`${this._hidden === 'true'\n ? nothing\n : html`\n <div\n class=\"${c}\"\n rtgcmd-group\n role=\"presentation\"\n id=\"${this.identifier}\"\n >\n <div\n rtgcmd-group-heading\n aria-hidden=\"true\"\n id=\"${this.identifier}h\"\n >\n ${this.heading}\n </div>\n <div\n rtgcmd-group-items\n role=\"group\"\n aria-labelledby=\"${this.identifier}h\"\n >\n <slot></slot>\n </div>\n </div>\n `}`;\n }\n}\n\n@customElement('rtg-command-separator')\nexport class CommandSeparator extends LitElement {\n @property({ type: String }) _id = '';\n\n @property({ attribute: 'aria-hidden', type: String }) _hidden = '';\n\n private static _counter = 0;\n\n static styles = [css``, TWStyles];\n\n private get identifier() {\n if (this._id !== '') {\n return this._id;\n }\n const parent =\n this.parentElement?.shadowRoot?.querySelector('div[rtgcmd-list]');\n if (parent) {\n this._id = `${parent.getAttribute('id')}s${CommandSeparator._counter++}`;\n } else {\n this._id = `rtgcmdrxlxs${CommandSeparator._counter++}`;\n }\n return this._id;\n }\n\n render() {\n return html`${this._hidden === 'true'\n ? nothing\n : html`\n <div\n class=\"${cn('-mx-1 h-px bg-border', this.className)}\"\n rtgcmd-separator\n role=\"separator\"\n id=\"${this.identifier}\"\n ></div>\n `}`;\n }\n}\n\n@customElement('rtg-command-empty')\nexport class CommandEmpty extends LitElement {\n @property({ type: String }) _id = '';\n\n @property({ attribute: 'aria-hidden', type: String }) _hidden = 'true';\n\n private static _counter = 0;\n\n static styles = [css``, TWStyles];\n\n private get identifier() {\n if (this._id !== '') {\n return this._id;\n }\n const parent =\n this.parentElement?.shadowRoot?.querySelector('div[rtgcmd-list]');\n if (parent) {\n this._id = `${parent.getAttribute('id')}e${CommandEmpty._counter++}`;\n } else {\n this._id = `rtgcmdrxlxe${CommandEmpty._counter++}`;\n }\n return this._id;\n }\n\n render() {\n return html`${this._hidden === 'true'\n ? nothing\n : html`\n <div\n class=\"${cn('py-6 text-center text-sm', this.className)}\"\n rtgcmd-empty\n role=\"presentation\"\n id=\"${this.identifier}\"\n >\n <slot></slot>\n </div>\n `}`;\n }\n}\n\n@customElement('rtg-command-item')\nexport class CommandItem extends LitElement {\n @property({ type: String }) _id = '';\n\n @property({ attribute: 'aria-hidden', type: String }) _hidden = '';\n\n private static _counter = 0;\n\n static styles = [css``, TWStyles];\n\n private get identifier() {\n if (this._id !== '') {\n return this._id;\n }\n const parent =\n this.parentElement?.shadowRoot?.querySelector('div[rtgcmd-group]');\n if (parent) {\n this._id = `${parent.getAttribute('id')}li${CommandItem._counter++}`;\n } else {\n this._id = `rtgcmdrxgxli${CommandItem._counter++}`;\n }\n return this._id;\n }\n\n @property({ attribute: 'data-value', type: String })\n public get value() {\n return this.textContent?.trim() || '';\n }\n\n @property({ type: Boolean }) selected = false;\n\n private handleMouseEvent(e: Event) {\n if (e.type === 'mouseover' || e.type === 'focus') {\n this.selected = true;\n }\n if (e.type === 'mouseleave') {\n this.selected = false;\n }\n }\n\n render() {\n return html` ${this._hidden === 'true'\n ? nothing\n : html`\n <div\n class=\"${cn(\n 'relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none aria-selected:bg-accent aria-selected:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50',\n this.className\n )}\"\n @mouseover=\"${this.handleMouseEvent}\"\n @mouseleave=\"${this.handleMouseEvent}\"\n @focus=\"${this.handleMouseEvent}\"\n rtgcmd-item\n role=\"option\"\n aria-selected=\"${this.selected}\"\n data-selected=\"${this.selected}\"\n data-value=\"${this.value}\"\n id=\"${this.identifier}\"\n aria-hidden=\"${this.hidden}\"\n >\n <slot></slot>\n </div>\n `}`;\n }\n}\n\n@customElement('rtg-command-input')\nexport class CommandInput extends LitElement {\n @property({ type: String }) placeholder = 'Type a command or search...';\n\n @property({ attribute: 'value', type: String }) _value = '';\n\n static styles = [css``, TWStyles];\n\n private get identifier() {\n const parent =\n this.parentElement?.shadowRoot?.querySelector('div[rtgcmd-root]');\n if (parent) {\n return `${parent.getAttribute('id')}i`;\n }\n return `rtgcmdrxi`;\n }\n\n private filterItems() {\n const parent = this.parentElement;\n if (parent) {\n let isEmpty = true;\n const groups = parent.querySelectorAll(\n 'rtg-command-list > rtg-command-group'\n );\n if (groups) {\n groups.forEach(group => {\n let hidden = true;\n const items = group.querySelectorAll('rtg-command-item');\n if (items) {\n items.forEach(item => {\n const value = (item as CommandItem)?.value || '';\n if (value.toLowerCase().includes(this._value.toLowerCase())) {\n hidden = false;\n isEmpty = false;\n item.setAttribute('aria-hidden', 'false');\n } else {\n item.setAttribute('aria-hidden', 'true');\n }\n });\n }\n group.setAttribute('aria-hidden', hidden ? 'true' : 'false');\n let separator = group.previousElementSibling as CommandSeparator;\n if (separator) {\n separator.setAttribute(\n 'aria-hidden',\n hidden ||\n separator.previousElementSibling?.getAttribute(\n 'aria-hidden'\n ) === 'true'\n ? 'true'\n : 'false'\n );\n }\n separator = group.nextElementSibling as CommandSeparator;\n if (separator) {\n separator.setAttribute(\n 'aria-hidden',\n hidden ||\n separator.nextElementSibling?.getAttribute('aria-hidden') ===\n 'true'\n ? 'true'\n : 'false'\n );\n }\n });\n }\n\n const empty = parent.querySelector('rtg-command-empty');\n if (empty) {\n empty.setAttribute('aria-hidden', isEmpty ? 'false' : 'true');\n }\n }\n }\n\n private handleChange(e: Event) {\n const input = e.target as HTMLInputElement;\n if (input) {\n this._value = input.value;\n this.filterItems();\n }\n }\n\n render() {\n return html`\n <div\n class=\"${cn('flex items-center border-b px-3', this.className)}\"\n name=\"rtgcmd-input-container\"\n >\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n class=\"mr-2 h-4 w-4 shrink-0 opacity-50\"\n >\n <circle cx=\"11\" cy=\"11\" r=\"8\"></circle>\n <path d=\"m21 21-4.3-4.3\"></path>\n </svg>\n <input\n class=\"flex h-11 w-full rounded-md bg-transparent py-3 text-sm outline-none placeholder:text-muted-foreground disabled:cursor-not-allowed disabled:opacity-50\"\n placeholder=\"${this.placeholder}\"\n rtgcmd-input\n @input=\"${this.handleChange}\"\n autocomplete=\"off\"\n autocorrect=\"off\"\n spellcheck=\"false\"\n aria-autocomplete=\"list\"\n role=\"combobox\"\n aria-expanded=\"true\"\n aria-controls=\":r1oe:\"\n aria-labelledby=\":r1of:\"\n id=\"${this.identifier}\"\n type=\"text\"\n data-value=\"${this._value}\"\n />\n </div>\n `;\n }\n}\n"]}
|
@@ -1,153 +0,0 @@
|
|
1
|
-
import { html } from 'lit';
|
2
|
-
// eslint-disable-next-line import/extensions
|
3
|
-
import './command';
|
4
|
-
export default {
|
5
|
-
title: 'Components/command',
|
6
|
-
component: 'rtg-command',
|
7
|
-
tags: ['autodocs'],
|
8
|
-
};
|
9
|
-
export const Default = () => html `
|
10
|
-
<rtg-command class="w-full max-w-md">
|
11
|
-
<rtg-command-input placeholder="Search ...."></rtg-command-input>
|
12
|
-
<rtg-command-list>
|
13
|
-
<rtg-command-empty>No items found!</rtg-command-empty>
|
14
|
-
<rtg-command-group heading="Suggestions">
|
15
|
-
<rtg-command-item>
|
16
|
-
<svg
|
17
|
-
xmlns="http://www.w3.org/2000/svg"
|
18
|
-
width="24"
|
19
|
-
height="24"
|
20
|
-
viewBox="0 0 24 24"
|
21
|
-
fill="none"
|
22
|
-
stroke="currentColor"
|
23
|
-
stroke-width="2"
|
24
|
-
stroke-linecap="round"
|
25
|
-
stroke-linejoin="round"
|
26
|
-
class="mr-2 h-4 w-4"
|
27
|
-
>
|
28
|
-
<rect width="18" height="18" x="3" y="4" rx="2" ry="2"></rect>
|
29
|
-
<line x1="16" x2="16" y1="2" y2="6"></line>
|
30
|
-
<line x1="8" x2="8" y1="2" y2="6"></line>
|
31
|
-
<line x1="3" x2="21" y1="10" y2="10"></line>
|
32
|
-
</svg>
|
33
|
-
<span>Calendar</span>
|
34
|
-
</rtg-command-item>
|
35
|
-
<rtg-command-item>
|
36
|
-
<svg
|
37
|
-
xmlns="http://www.w3.org/2000/svg"
|
38
|
-
width="24"
|
39
|
-
height="24"
|
40
|
-
viewBox="0 0 24 24"
|
41
|
-
fill="none"
|
42
|
-
stroke="currentColor"
|
43
|
-
stroke-width="2"
|
44
|
-
stroke-linecap="round"
|
45
|
-
stroke-linejoin="round"
|
46
|
-
class="mr-2 h-4 w-4"
|
47
|
-
>
|
48
|
-
<circle cx="12" cy="12" r="10"></circle>
|
49
|
-
<path d="M8 14s1.5 2 4 2 4-2 4-2"></path>
|
50
|
-
<line x1="9" x2="9.01" y1="9" y2="9"></line>
|
51
|
-
<line x1="15" x2="15.01" y1="9" y2="9"></line>
|
52
|
-
</svg>
|
53
|
-
<span>Search Emoji</span>
|
54
|
-
</rtg-command-item>
|
55
|
-
<rtg-command-item>
|
56
|
-
<svg
|
57
|
-
xmlns="http://www.w3.org/2000/svg"
|
58
|
-
width="24"
|
59
|
-
height="24"
|
60
|
-
viewBox="0 0 24 24"
|
61
|
-
fill="none"
|
62
|
-
stroke="currentColor"
|
63
|
-
stroke-width="2"
|
64
|
-
stroke-linecap="round"
|
65
|
-
stroke-linejoin="round"
|
66
|
-
class="mr-2 h-4 w-4"
|
67
|
-
>
|
68
|
-
<rect width="16" height="20" x="4" y="2" rx="2"></rect>
|
69
|
-
<line x1="8" x2="16" y1="6" y2="6"></line>
|
70
|
-
<line x1="16" x2="16" y1="14" y2="18"></line>
|
71
|
-
<path d="M16 10h.01"></path>
|
72
|
-
<path d="M12 10h.01"></path>
|
73
|
-
<path d="M8 10h.01"></path>
|
74
|
-
<path d="M12 14h.01"></path>
|
75
|
-
<path d="M8 14h.01"></path>
|
76
|
-
<path d="M12 18h.01"></path>
|
77
|
-
<path d="M8 18h.01"></path>
|
78
|
-
</svg>
|
79
|
-
<span>Calculator</span>
|
80
|
-
</rtg-command-item>
|
81
|
-
</rtg-command-group>
|
82
|
-
<rtg-command-separator></rtg-command-separator>
|
83
|
-
<rtg-command-group heading="Settings">
|
84
|
-
<rtg-command-item onclick="javascript:alert('Profile Clicked!')">
|
85
|
-
<svg
|
86
|
-
xmlns="http://www.w3.org/2000/svg"
|
87
|
-
width="24"
|
88
|
-
height="24"
|
89
|
-
viewBox="0 0 24 24"
|
90
|
-
fill="none"
|
91
|
-
stroke="currentColor"
|
92
|
-
stroke-width="2"
|
93
|
-
stroke-linecap="round"
|
94
|
-
stroke-linejoin="round"
|
95
|
-
class="mr-2 h-4 w-4"
|
96
|
-
>
|
97
|
-
<path d="M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2"></path>
|
98
|
-
<circle cx="12" cy="7" r="4"></circle>
|
99
|
-
</svg>
|
100
|
-
<span>Profile</span>
|
101
|
-
<span class="ml-auto text-xs tracking-widest text-muted-foreground"
|
102
|
-
>⌘P</span
|
103
|
-
>
|
104
|
-
</rtg-command-item>
|
105
|
-
<rtg-command-item>
|
106
|
-
<svg
|
107
|
-
xmlns="http://www.w3.org/2000/svg"
|
108
|
-
width="24"
|
109
|
-
height="24"
|
110
|
-
viewBox="0 0 24 24"
|
111
|
-
fill="none"
|
112
|
-
stroke="currentColor"
|
113
|
-
stroke-width="2"
|
114
|
-
stroke-linecap="round"
|
115
|
-
stroke-linejoin="round"
|
116
|
-
class="mr-2 h-4 w-4"
|
117
|
-
>
|
118
|
-
<rect width="20" height="14" x="2" y="5" rx="2"></rect>
|
119
|
-
<line x1="2" x2="22" y1="10" y2="10"></line>
|
120
|
-
</svg>
|
121
|
-
<span>Billing</span
|
122
|
-
><span class="ml-auto text-xs tracking-widest text-muted-foreground"
|
123
|
-
>⌘B</span
|
124
|
-
>
|
125
|
-
</rtg-command-item>
|
126
|
-
<rtg-command-item>
|
127
|
-
<svg
|
128
|
-
xmlns="http://www.w3.org/2000/svg"
|
129
|
-
width="24"
|
130
|
-
height="24"
|
131
|
-
viewBox="0 0 24 24"
|
132
|
-
fill="none"
|
133
|
-
stroke="currentColor"
|
134
|
-
stroke-width="2"
|
135
|
-
stroke-linecap="round"
|
136
|
-
stroke-linejoin="round"
|
137
|
-
class="mr-2 h-4 w-4"
|
138
|
-
>
|
139
|
-
<path
|
140
|
-
d="M12.22 2h-.44a2 2 0 0 0-2 2v.18a2 2 0 0 1-1 1.73l-.43.25a2 2 0 0 1-2 0l-.15-.08a2 2 0 0 0-2.73.73l-.22.38a2 2 0 0 0 .73 2.73l.15.1a2 2 0 0 1 1 1.72v.51a2 2 0 0 1-1 1.74l-.15.09a2 2 0 0 0-.73 2.73l.22.38a2 2 0 0 0 2.73.73l.15-.08a2 2 0 0 1 2 0l.43.25a2 2 0 0 1 1 1.73V20a2 2 0 0 0 2 2h.44a2 2 0 0 0 2-2v-.18a2 2 0 0 1 1-1.73l.43-.25a2 2 0 0 1 2 0l.15.08a2 2 0 0 0 2.73-.73l.22-.39a2 2 0 0 0-.73-2.73l-.15-.08a2 2 0 0 1-1-1.74v-.5a2 2 0 0 1 1-1.74l.15-.09a2 2 0 0 0 .73-2.73l-.22-.38a2 2 0 0 0-2.73-.73l-.15.08a2 2 0 0 1-2 0l-.43-.25a2 2 0 0 1-1-1.73V4a2 2 0 0 0-2-2z"
|
141
|
-
></path>
|
142
|
-
<circle cx="12" cy="12" r="3"></circle>
|
143
|
-
</svg>
|
144
|
-
<span>Settings</span>
|
145
|
-
<span class="ml-auto text-xs tracking-widest text-muted-foreground">
|
146
|
-
⌘S</span
|
147
|
-
>
|
148
|
-
</rtg-command-item>
|
149
|
-
</rtg-command-group></rtg-command-list
|
150
|
-
>
|
151
|
-
</rtg-command>
|
152
|
-
`;
|
153
|
-
//# sourceMappingURL=command.stories.js.map
|
@@ -1 +0,0 @@
|
|
1
|
-
{"version":3,"file":"command.stories.js","sourceRoot":"","sources":["../../../../src/components/command/command.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAC3B,6CAA6C;AAC7C,OAAO,WAAW,CAAC;AAGnB,eAAe;IACb,KAAK,EAAE,oBAAoB;IAC3B,SAAS,EAAE,aAAa;IACxB,IAAI,EAAE,CAAC,UAAU,CAAC;CACX,CAAC;AACV,MAAM,CAAC,MAAM,OAAO,GAAG,GAAG,EAAE,CAAC,IAAI,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA+IhC,CAAC","sourcesContent":["import { html } from 'lit';\n// eslint-disable-next-line import/extensions\nimport './command';\nimport { Meta } from '@storybook/web-components';\n\nexport default {\n title: 'Components/command',\n component: 'rtg-command',\n tags: ['autodocs'],\n} as Meta;\nexport const Default = () => html`\n <rtg-command class=\"w-full max-w-md\">\n <rtg-command-input placeholder=\"Search ....\"></rtg-command-input>\n <rtg-command-list>\n <rtg-command-empty>No items found!</rtg-command-empty>\n <rtg-command-group heading=\"Suggestions\">\n <rtg-command-item>\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n class=\"mr-2 h-4 w-4\"\n >\n <rect width=\"18\" height=\"18\" x=\"3\" y=\"4\" rx=\"2\" ry=\"2\"></rect>\n <line x1=\"16\" x2=\"16\" y1=\"2\" y2=\"6\"></line>\n <line x1=\"8\" x2=\"8\" y1=\"2\" y2=\"6\"></line>\n <line x1=\"3\" x2=\"21\" y1=\"10\" y2=\"10\"></line>\n </svg>\n <span>Calendar</span>\n </rtg-command-item>\n <rtg-command-item>\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n class=\"mr-2 h-4 w-4\"\n >\n <circle cx=\"12\" cy=\"12\" r=\"10\"></circle>\n <path d=\"M8 14s1.5 2 4 2 4-2 4-2\"></path>\n <line x1=\"9\" x2=\"9.01\" y1=\"9\" y2=\"9\"></line>\n <line x1=\"15\" x2=\"15.01\" y1=\"9\" y2=\"9\"></line>\n </svg>\n <span>Search Emoji</span>\n </rtg-command-item>\n <rtg-command-item>\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n class=\"mr-2 h-4 w-4\"\n >\n <rect width=\"16\" height=\"20\" x=\"4\" y=\"2\" rx=\"2\"></rect>\n <line x1=\"8\" x2=\"16\" y1=\"6\" y2=\"6\"></line>\n <line x1=\"16\" x2=\"16\" y1=\"14\" y2=\"18\"></line>\n <path d=\"M16 10h.01\"></path>\n <path d=\"M12 10h.01\"></path>\n <path d=\"M8 10h.01\"></path>\n <path d=\"M12 14h.01\"></path>\n <path d=\"M8 14h.01\"></path>\n <path d=\"M12 18h.01\"></path>\n <path d=\"M8 18h.01\"></path>\n </svg>\n <span>Calculator</span>\n </rtg-command-item>\n </rtg-command-group>\n <rtg-command-separator></rtg-command-separator>\n <rtg-command-group heading=\"Settings\">\n <rtg-command-item onclick=\"javascript:alert('Profile Clicked!')\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n class=\"mr-2 h-4 w-4\"\n >\n <path d=\"M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2\"></path>\n <circle cx=\"12\" cy=\"7\" r=\"4\"></circle>\n </svg>\n <span>Profile</span>\n <span class=\"ml-auto text-xs tracking-widest text-muted-foreground\"\n >⌘P</span\n >\n </rtg-command-item>\n <rtg-command-item>\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n class=\"mr-2 h-4 w-4\"\n >\n <rect width=\"20\" height=\"14\" x=\"2\" y=\"5\" rx=\"2\"></rect>\n <line x1=\"2\" x2=\"22\" y1=\"10\" y2=\"10\"></line>\n </svg>\n <span>Billing</span\n ><span class=\"ml-auto text-xs tracking-widest text-muted-foreground\"\n >⌘B</span\n >\n </rtg-command-item>\n <rtg-command-item>\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n class=\"mr-2 h-4 w-4\"\n >\n <path\n d=\"M12.22 2h-.44a2 2 0 0 0-2 2v.18a2 2 0 0 1-1 1.73l-.43.25a2 2 0 0 1-2 0l-.15-.08a2 2 0 0 0-2.73.73l-.22.38a2 2 0 0 0 .73 2.73l.15.1a2 2 0 0 1 1 1.72v.51a2 2 0 0 1-1 1.74l-.15.09a2 2 0 0 0-.73 2.73l.22.38a2 2 0 0 0 2.73.73l.15-.08a2 2 0 0 1 2 0l.43.25a2 2 0 0 1 1 1.73V20a2 2 0 0 0 2 2h.44a2 2 0 0 0 2-2v-.18a2 2 0 0 1 1-1.73l.43-.25a2 2 0 0 1 2 0l.15.08a2 2 0 0 0 2.73-.73l.22-.39a2 2 0 0 0-.73-2.73l-.15-.08a2 2 0 0 1-1-1.74v-.5a2 2 0 0 1 1-1.74l.15-.09a2 2 0 0 0 .73-2.73l-.22-.38a2 2 0 0 0-2.73-.73l-.15.08a2 2 0 0 1-2 0l-.43-.25a2 2 0 0 1-1-1.73V4a2 2 0 0 0-2-2z\"\n ></path>\n <circle cx=\"12\" cy=\"12\" r=\"3\"></circle>\n </svg>\n <span>Settings</span>\n <span class=\"ml-auto text-xs tracking-widest text-muted-foreground\">\n ⌘S</span\n >\n </rtg-command-item>\n </rtg-command-group></rtg-command-list\n >\n </rtg-command>\n`;\n"]}
|
@@ -1 +0,0 @@
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC;AACxB,cAAc,aAAa,CAAC","sourcesContent":["export * from './atoms';\nexport * from './molecules';\n"]}
|