@kumori/aurora-wui-components 0.0.255-dev4009.5 → 0.0.255-dev4009.7
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.
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"axebow-box-form.d.ts","sourceRoot":"","sources":["../../../src/components/axebow-box-form/axebow-box-form.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAmB,MAAM,KAAK,CAAC;AAElD,OAAO,+BAA+B,CAAC;AACvC,OAAO,mCAAmC,CAAC;AAC3C,OAAO,uDAAuD,CAAC;AAC/D,OAAO,KAAK,EAAE,mBAAmB,EAAiC,MAAM,6BAA6B,CAAC;AAEtG,cAAc,6BAA6B,CAAC;AAE5C,qBACa,qBAAsB,SAAQ,UAAU;IACjD,MAAM,CAAC,MAAM,0BAA0B;IAEX,UAAU,SAAU;IACpB,WAAW,SAA2B;IACrC,SAAS,UAAQ;IACjB,QAAQ,UAAS;IACnB,KAAK,EAAE,mBAAmB,EAAE,CAAM;IAEpD,OAAO,CAAC,WAAW,CAAuB;IAEnD,iBAAiB;IAKjB,oBAAoB;IAKpB,OAAO,CAAC,mBAAmB,CAKzB;IAEF,OAAO,CAAC,gBAAgB;IAOxB,OAAO,CAAC,SAAS;IAOjB,OAAO,CAAC,aAAa;IAIrB,OAAO,CAAC,aAAa;IAarB,OAAO,CAAC,UAAU;IAIlB,OAAO,CAAC,WAAW;IAsBnB,OAAO,CAAC,iBAAiB;IAoBzB,OAAO,CAAC,YAAY;
|
|
1
|
+
{"version":3,"file":"axebow-box-form.d.ts","sourceRoot":"","sources":["../../../src/components/axebow-box-form/axebow-box-form.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAmB,MAAM,KAAK,CAAC;AAElD,OAAO,+BAA+B,CAAC;AACvC,OAAO,mCAAmC,CAAC;AAC3C,OAAO,uDAAuD,CAAC;AAC/D,OAAO,KAAK,EAAE,mBAAmB,EAAiC,MAAM,6BAA6B,CAAC;AAEtG,cAAc,6BAA6B,CAAC;AAE5C,qBACa,qBAAsB,SAAQ,UAAU;IACjD,MAAM,CAAC,MAAM,0BAA0B;IAEX,UAAU,SAAU;IACpB,WAAW,SAA2B;IACrC,SAAS,UAAQ;IACjB,QAAQ,UAAS;IACnB,KAAK,EAAE,mBAAmB,EAAE,CAAM;IAEpD,OAAO,CAAC,WAAW,CAAuB;IAEnD,iBAAiB;IAKjB,oBAAoB;IAKpB,OAAO,CAAC,mBAAmB,CAKzB;IAEF,OAAO,CAAC,gBAAgB;IAOxB,OAAO,CAAC,SAAS;IAOjB,OAAO,CAAC,aAAa;IAIrB,OAAO,CAAC,aAAa;IAarB,OAAO,CAAC,UAAU;IAIlB,OAAO,CAAC,WAAW;IAsBnB,OAAO,CAAC,iBAAiB;IAoBzB,OAAO,CAAC,YAAY;IA6IpB,MAAM;CA8BT;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,0BAA0B,EAAE,qBAAqB,CAAC;KACnD;CACF"}
|
|
@@ -6,7 +6,8 @@ export declare class AxebowIcon extends LitElement {
|
|
|
6
6
|
filled: boolean;
|
|
7
7
|
size: string;
|
|
8
8
|
marginBottom: number;
|
|
9
|
-
|
|
9
|
+
clickable: boolean;
|
|
10
|
+
static styles: import('lit').CSSResult[];
|
|
10
11
|
private _getFontSize;
|
|
11
12
|
render(): import('lit-html').TemplateResult<1>;
|
|
12
13
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"axebow-icon.d.ts","sourceRoot":"","sources":["../../../src/components/axebow-icon/axebow-icon.ts"],"names":[],"mappings":"AACA,OAAO,EAAmB,UAAU,
|
|
1
|
+
{"version":3,"file":"axebow-icon.d.ts","sourceRoot":"","sources":["../../../src/components/axebow-icon/axebow-icon.ts"],"names":[],"mappings":"AACA,OAAO,EAAmB,UAAU,EAAO,MAAM,KAAK,CAAC;AAGvD,qBACa,UAAW,SAAQ,UAAU;IACZ,QAAQ,SAAU;IAClB,SAAS,SAA2B;IACpC,MAAM,SAAK;IACV,MAAM,UAAS;IAChB,IAAI,EAAE,MAAM,CAAY;IACxB,YAAY,SAAK;IACD,SAAS,UAAS;IAE9D,MAAM,CAAC,MAAM,4BAoBX;IAEF,OAAO,CAAC,YAAY;IAkCpB,MAAM;CAmBP"}
|
package/dist/index.js
CHANGED
|
@@ -144,9 +144,27 @@ var AxebowIcon = class AxebowIcon extends LitElement {
|
|
|
144
144
|
this.filled = false;
|
|
145
145
|
this.size = "medium";
|
|
146
146
|
this.marginBottom = 0;
|
|
147
|
+
this.clickable = false;
|
|
147
148
|
}
|
|
148
149
|
static {
|
|
149
|
-
this.styles = unsafeCSS(tailwind_default)
|
|
150
|
+
this.styles = [unsafeCSS(tailwind_default), css`
|
|
151
|
+
:host {
|
|
152
|
+
display: inline-flex;
|
|
153
|
+
align-items: center;
|
|
154
|
+
justify-content: center;
|
|
155
|
+
vertical-align: middle;
|
|
156
|
+
}
|
|
157
|
+
:host([clickable]),
|
|
158
|
+
span.is-clickable {
|
|
159
|
+
cursor: pointer;
|
|
160
|
+
transition: opacity 0.15s ease, filter 0.15s ease;
|
|
161
|
+
}
|
|
162
|
+
:host([clickable]):hover,
|
|
163
|
+
span.is-clickable:hover {
|
|
164
|
+
opacity: 0.6;
|
|
165
|
+
filter: grayscale(0.4);
|
|
166
|
+
}
|
|
167
|
+
`];
|
|
150
168
|
}
|
|
151
169
|
_getFontSize() {
|
|
152
170
|
switch (this.size.replace(/^text-/, "")) {
|
|
@@ -175,7 +193,7 @@ var AxebowIcon = class AxebowIcon extends LitElement {
|
|
|
175
193
|
const fontSize = this._getFontSize();
|
|
176
194
|
return html`
|
|
177
195
|
<span
|
|
178
|
-
class="font-[Material_Symbols_Outlined]
|
|
196
|
+
class="font-[Material_Symbols_Outlined] inline-block align-middle whitespace-nowrap ${this.clickable ? "is-clickable" : ""} ${this.filled ? filled : outlined}"
|
|
179
197
|
style="color: ${this.iconColor}; transform: rotate(${this.rotate}deg); font-size: ${fontSize}; margin-bottom: ${this.size === "large" || this.size === "3xl" ? "0.375rem" : this.size === "x-large" || this.size === "5xl" ? "0.5rem" : `${this.marginBottom}px`};"
|
|
180
198
|
>
|
|
181
199
|
${this.iconName}
|
|
@@ -189,6 +207,10 @@ __decorate([property({ type: Number })], AxebowIcon.prototype, "rotate", void 0)
|
|
|
189
207
|
__decorate([property({ type: Boolean })], AxebowIcon.prototype, "filled", void 0);
|
|
190
208
|
__decorate([property({ type: String })], AxebowIcon.prototype, "size", void 0);
|
|
191
209
|
__decorate([property({ type: Number })], AxebowIcon.prototype, "marginBottom", void 0);
|
|
210
|
+
__decorate([property({
|
|
211
|
+
type: Boolean,
|
|
212
|
+
reflect: true
|
|
213
|
+
})], AxebowIcon.prototype, "clickable", void 0);
|
|
192
214
|
AxebowIcon = __decorate([customElement("axebow-icon")], AxebowIcon);
|
|
193
215
|
//#endregion
|
|
194
216
|
//#region src/components/axebow-filter-bar/axebow-filter-bar.ts
|
|
@@ -8866,11 +8888,10 @@ var AxebowResourceBoxForm = class AxebowResourceBoxForm extends LitElement {
|
|
|
8866
8888
|
_renderField(item) {
|
|
8867
8889
|
const itemType = item.type || "enabled";
|
|
8868
8890
|
const textToCopy = item.copyValue !== void 0 ? item.copyValue : item.value;
|
|
8869
|
-
|
|
8870
|
-
|
|
8871
|
-
|
|
8872
|
-
|
|
8873
|
-
return html`
|
|
8891
|
+
const hasMenu = !!item.menuOptions && item.menuOptions.length > 0 && !!item.menuId;
|
|
8892
|
+
const hasContent = !!textToCopy;
|
|
8893
|
+
const isMenuOpen = this._openMenuId === item.menuId && hasContent;
|
|
8894
|
+
if (itemType === "text") return html`
|
|
8874
8895
|
<div class="flex flex-col gap-0.5 w-full pt-1">
|
|
8875
8896
|
<div class="flex items-center justify-between gap-2 w-full relative">
|
|
8876
8897
|
<span class="text-sm font-semibold text-(--axebow-strong-gray) leading-tight flex items-center gap-1 break-all">
|
|
@@ -8931,37 +8952,37 @@ var AxebowResourceBoxForm = class AxebowResourceBoxForm extends LitElement {
|
|
|
8931
8952
|
${item.tag && item.value ? html`<p class="m-0 text-sm text-(--axebow-gray) leading-snug break-all font-normal">${item.value}</p>` : ""}
|
|
8932
8953
|
</div>
|
|
8933
8954
|
`;
|
|
8934
|
-
}
|
|
8935
8955
|
return html`
|
|
8936
|
-
<
|
|
8937
|
-
|
|
8938
|
-
|
|
8939
|
-
|
|
8940
|
-
|
|
8941
|
-
|
|
8942
|
-
|
|
8943
|
-
|
|
8944
|
-
|
|
8945
|
-
|
|
8946
|
-
|
|
8947
|
-
|
|
8948
|
-
|
|
8949
|
-
|
|
8950
|
-
|
|
8956
|
+
<div class="relative w-full">
|
|
8957
|
+
<axebow-form-panel-field
|
|
8958
|
+
class="w-full"
|
|
8959
|
+
style="width: 100%;"
|
|
8960
|
+
.label=${item.tag}
|
|
8961
|
+
.value=${item.value || ""}
|
|
8962
|
+
.copyValue=${item.copyValue !== void 0 ? item.copyValue : ""}
|
|
8963
|
+
.mandatory=${Boolean(item.required)}
|
|
8964
|
+
?disabled=${itemType === "disabled"}
|
|
8965
|
+
.showActionIcon=${Boolean(hasMenu || item.canCopy)}
|
|
8966
|
+
actionIcon=${hasMenu ? "add_circle" : "content_copy"}
|
|
8967
|
+
.showSecondaryActionIcon=${Boolean(item.canLink)}
|
|
8968
|
+
secondaryActionIcon="open_in_new"
|
|
8969
|
+
.showDropdown=${Boolean(item.options && item.options.length > 0)}
|
|
8970
|
+
.options=${item.options || []}
|
|
8971
|
+
@focus=${(_e) => {
|
|
8951
8972
|
this.dispatchEvent(new CustomEvent("item-focus", {
|
|
8952
8973
|
detail: { item },
|
|
8953
8974
|
bubbles: true,
|
|
8954
8975
|
composed: true
|
|
8955
8976
|
}));
|
|
8956
8977
|
}}
|
|
8957
|
-
|
|
8978
|
+
@blur=${(_e) => {
|
|
8958
8979
|
this.dispatchEvent(new CustomEvent("item-blur", {
|
|
8959
8980
|
detail: { item },
|
|
8960
8981
|
bubbles: true,
|
|
8961
8982
|
composed: true
|
|
8962
8983
|
}));
|
|
8963
8984
|
}}
|
|
8964
|
-
|
|
8985
|
+
@change=${(e) => {
|
|
8965
8986
|
item.value = e.detail?.value ?? e.target.value;
|
|
8966
8987
|
this.dispatchEvent(new CustomEvent("item-change", {
|
|
8967
8988
|
detail: { item },
|
|
@@ -8969,9 +8990,32 @@ var AxebowResourceBoxForm = class AxebowResourceBoxForm extends LitElement {
|
|
|
8969
8990
|
composed: true
|
|
8970
8991
|
}));
|
|
8971
8992
|
}}
|
|
8972
|
-
|
|
8973
|
-
|
|
8974
|
-
|
|
8993
|
+
@action-click=${(e) => {
|
|
8994
|
+
if (hasMenu) this._toggleMenu(item, hasContent, e);
|
|
8995
|
+
else this._copyToClipboard(textToCopy, e);
|
|
8996
|
+
}}
|
|
8997
|
+
@secondary-action-click=${(e) => this._openLink(item.linkHref || item.value, e)}
|
|
8998
|
+
></axebow-form-panel-field>
|
|
8999
|
+
${hasMenu && isMenuOpen ? html`
|
|
9000
|
+
<div class="absolute right-0 top-full mt-1 z-50 min-w-[200px] bg-white rounded-lg shadow-[0_4px_12px_rgba(0,0,0,0.1)] border border-solid border-(--axebow-border-gray) py-1.5 flex flex-col axebow-scrollbar" style="max-height: 250px; overflow-y: auto;">
|
|
9001
|
+
${item.menuOptions.map((option) => html`
|
|
9002
|
+
<div
|
|
9003
|
+
class="flex items-center gap-2.5 px-4 py-2 cursor-pointer hover:bg-(--axebow-anti-flash-white) transition-colors"
|
|
9004
|
+
@click=${(e) => this._handleMenuOption(item, option, textToCopy, e)}
|
|
9005
|
+
>
|
|
9006
|
+
<axebow-icon
|
|
9007
|
+
.iconName=${option.icon}
|
|
9008
|
+
.iconColor=${option.variant === "danger" ? "var(--axebow-error)" : "var(--axebow-primary)"}
|
|
9009
|
+
size="md"
|
|
9010
|
+
></axebow-icon>
|
|
9011
|
+
<span class="text-sm font-medium ${option.variant === "danger" ? "text-(--axebow-error)" : "text-(--axebow-primary)"}">
|
|
9012
|
+
${option.label}
|
|
9013
|
+
</span>
|
|
9014
|
+
</div>
|
|
9015
|
+
`)}
|
|
9016
|
+
</div>
|
|
9017
|
+
` : ""}
|
|
9018
|
+
</div>
|
|
8975
9019
|
`;
|
|
8976
9020
|
}
|
|
8977
9021
|
render() {
|