@kumori/aurora-wui-components 0.0.272-dev4127.1 → 0.0.272-dev4127.3

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.
Files changed (5) hide show
  1. package/dist/components/axebow-filter-bar/axebow-filter-bar.d.ts +2 -2
  2. package/dist/components/axebow-filter-bar/axebow-filter-bar.d.ts.map +1 -1
  3. package/dist/index.js +28 -15
  4. package/dist/index.js.map +1 -1
  5. package/package.json +1 -1
package/dist/components/axebow-filter-bar/axebow-filter-bar.d.ts CHANGED
@@ -20,8 +20,7 @@ export interface AxebowFilterBarItem {
20
20
  export declare class AxebowFilterBar extends LitElement {
21
21
  static styles: import('lit').CSSResult[];
22
22
  items: AxebowFilterBarItem[];
23
- clearAllLabel: string;
24
- onClearAll?: () => void;
23
+ clearFilterLabel: string;
25
24
  compact: boolean;
26
25
  private _resizeObserver?;
27
26
  connectedCallback(): void;
@@ -32,6 +31,7 @@ export declare class AxebowFilterBar extends LitElement {
32
31
  private _onSelectShow;
33
32
  private _updateSeparateLayout;
34
33
  private _onChange;
34
+ private _clearItem;
35
35
  private _renderItem;
36
36
  render(): import('lit-html').TemplateResult<1>;
37
37
  }
package/dist/components/axebow-filter-bar/axebow-filter-bar.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"axebow-filter-bar.d.ts","sourceRoot":"","sources":["../../../src/components/axebow-filter-bar/axebow-filter-bar.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAwB,MAAM,KAAK,CAAC;AAEvD,OAAO,+BAA+B,CAAC;AACvC,OAAO,2DAA2D,CAAC;AACnE,OAAO,2DAA2D,CAAC;AAEnE,MAAM,WAAW,qBAAqB;IACpC,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,mBAAmB;IAClC,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,MAAM,CAAC;IACpB,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,qBAAqB,EAAE,CAAC;IACjC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED;;;;GAIG;AACH,qBACa,eAAgB,SAAQ,UAAU;IAC7C,MAAM,CAAC,MAAM,4BA6DX;IAEyB,KAAK,EAAE,mBAAmB,EAAE,CAAM;IACjC,aAAa,SAAM;IACf,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IAC3B,OAAO,UAAS;IAE7C,OAAO,CAAC,eAAe,CAAC,CAAiB;IAEzC,iBAAiB;IAKjB,oBAAoB;IAKpB,YAAY;IAMZ,OAAO,CAAC,iBAAiB,EAAE,GAAG;IAM9B,OAAO,CAAC,yBAAyB;IAcjC,OAAO,CAAC,aAAa;IAOrB,OAAO,CAAC,qBAAqB;IAa7B,OAAO,CAAC,SAAS;IAajB,OAAO,CAAC,WAAW;IAuCnB,MAAM;CAkBP"}
1
+ {"version":3,"file":"axebow-filter-bar.d.ts","sourceRoot":"","sources":["../../../src/components/axebow-filter-bar/axebow-filter-bar.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAwB,MAAM,KAAK,CAAC;AAEvD,OAAO,+BAA+B,CAAC;AACvC,OAAO,2DAA2D,CAAC;AACnE,OAAO,2DAA2D,CAAC;AAEnE,MAAM,WAAW,qBAAqB;IACpC,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,mBAAmB;IAClC,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,MAAM,CAAC;IACpB,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,qBAAqB,EAAE,CAAC;IACjC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED;;;;GAIG;AACH,qBACa,eAAgB,SAAQ,UAAU;IAC7C,MAAM,CAAC,MAAM,4BA6DX;IAEyB,KAAK,EAAE,mBAAmB,EAAE,CAAM;IACjC,gBAAgB,SAAM;IACrB,OAAO,UAAS;IAE7C,OAAO,CAAC,eAAe,CAAC,CAAiB;IAEzC,iBAAiB;IAKjB,oBAAoB;IAKpB,YAAY;IAMZ,OAAO,CAAC,iBAAiB,EAAE,GAAG;IAM9B,OAAO,CAAC,yBAAyB;IAcjC,OAAO,CAAC,aAAa;IAOrB,OAAO,CAAC,qBAAqB;IAa7B,OAAO,CAAC,SAAS;IAajB,OAAO,CAAC,UAAU;IAMlB,OAAO,CAAC,WAAW;IAsDnB,MAAM;CAOP"}
package/dist/index.js CHANGED
@@ -292,7 +292,7 @@ var AxebowFilterBar = class AxebowFilterBar extends LitElement {
292
292
  constructor(..._args) {
293
293
  super(..._args);
294
294
  this.items = [];
295
- this.clearAllLabel = "";
295
+ this.clearFilterLabel = "";
296
296
  this.compact = false;
297
297
  }
298
298
  static {
@@ -410,6 +410,16 @@ var AxebowFilterBar = class AxebowFilterBar extends LitElement {
410
410
  composed: true
411
411
  }));
412
412
  }
413
+ _clearItem(key) {
414
+ this.dispatchEvent(new CustomEvent("option-change", {
415
+ detail: {
416
+ key,
417
+ value: "all"
418
+ },
419
+ bubbles: true,
420
+ composed: true
421
+ }));
422
+ }
413
423
  _renderItem(item) {
414
424
  const isLockable = item.lockable !== false;
415
425
  const hasValue = isLockable && item.value && item.value !== "all" && item.value !== "";
@@ -418,14 +428,27 @@ var AxebowFilterBar = class AxebowFilterBar extends LitElement {
418
428
  class="filter-bar-item flex flex-col gap-2 flex-1 min-w-36 max-w-95"
419
429
  ?data-separate=${item.separate}
420
430
  >
421
- <h4 class="m-0 text-base font-semibold text-black">${item.label}</h4>
431
+ <div class="flex items-center justify-between gap-2">
432
+ <h4 class="m-0 text-base font-semibold text-black">${item.label}</h4>
433
+ ${hasValue && this.clearFilterLabel ? html`
434
+ <div class="w-17 h-4.25 shrink-0">
435
+ <button
436
+ type="button"
437
+ class="w-full h-full p-0 border-0 bg-transparent cursor-pointer text-(--axebow-tertiary) text-base text-right hover:underline"
438
+ @click=${() => this._clearItem(item.key)}
439
+ >
440
+ ${this.clearFilterLabel}
441
+ </button>
442
+ </div>
443
+ ` : ""}
444
+ </div>
422
445
  <sl-select
423
446
  class="w-full"
424
447
  placeholder=${item.placeholder}
425
448
  .value=${item.value}
426
449
  ?lockable=${isLockable}
427
450
  ?has-value=${hasValue}
428
- ?clearable=${isLockable}
451
+ ?clearable=${isLockable && !this.clearFilterLabel}
429
452
  data-key=${item.key}
430
453
  @sl-change=${(e) => this._onChange(e, item.key)}
431
454
  @sl-show=${this._onSelectShow}
@@ -450,24 +473,14 @@ var AxebowFilterBar = class AxebowFilterBar extends LitElement {
450
473
  }
451
474
  render() {
452
475
  return html`
453
- <div class="filter-bar relative flex items-end gap-4 flex-wrap ${this.compact ? "" : "py-8"}">
454
- ${this.clearAllLabel ? html`
455
- <button
456
- type="button"
457
- class="absolute right-0 top-0 p-0 border-0 bg-transparent cursor-pointer text-(--axebow-tertiary) text-sm font-medium hover:underline"
458
- @click=${() => this.onClearAll?.()}
459
- >
460
- ${this.clearAllLabel}
461
- </button>
462
- ` : ""}
476
+ <div class="filter-bar flex items-end gap-4 flex-wrap ${this.compact ? "" : "py-8"}">
463
477
  ${this.items.map((item) => this._renderItem(item))}
464
478
  </div>
465
479
  `;
466
480
  }
467
481
  };
468
482
  __decorate([property({ type: Array })], AxebowFilterBar.prototype, "items", void 0);
469
- __decorate([property({ type: String })], AxebowFilterBar.prototype, "clearAllLabel", void 0);
470
- __decorate([property({ attribute: false })], AxebowFilterBar.prototype, "onClearAll", void 0);
483
+ __decorate([property({ type: String })], AxebowFilterBar.prototype, "clearFilterLabel", void 0);
471
484
  __decorate([property({ type: Boolean })], AxebowFilterBar.prototype, "compact", void 0);
472
485
  AxebowFilterBar = __decorate([customElement("axebow-filter-bar")], AxebowFilterBar);
473
486
  //#endregion