@kanso-protocol/table-toolbar 1.0.1 → 2.0.0
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.
|
@@ -73,20 +73,20 @@ class KpTableToolbarComponent {
|
|
|
73
73
|
}
|
|
74
74
|
|
|
75
75
|
@if (showFilter) {
|
|
76
|
-
<
|
|
76
|
+
<button kpButton variant="outline" size="sm" (click)="filterClick.emit()">
|
|
77
77
|
<kp-icon kpButtonIconLeft name="filter" />
|
|
78
78
|
Filters
|
|
79
79
|
@if (activeFilterCount > 0) {
|
|
80
80
|
<kp-badge kpButtonIconRight size="xs" color="primary" appearance="subtle">{{ activeFilterCount }}</kp-badge>
|
|
81
81
|
}
|
|
82
|
-
</
|
|
82
|
+
</button>
|
|
83
83
|
}
|
|
84
84
|
|
|
85
85
|
@if (showSort) {
|
|
86
|
-
<
|
|
86
|
+
<button kpButton variant="outline" size="sm" (click)="sortClick.emit()">
|
|
87
87
|
<kp-icon kpButtonIconLeft name="arrows-up-down" />
|
|
88
88
|
<span>Sort</span>
|
|
89
|
-
</
|
|
89
|
+
</button>
|
|
90
90
|
}
|
|
91
91
|
</div>
|
|
92
92
|
|
|
@@ -121,16 +121,16 @@ class KpTableToolbarComponent {
|
|
|
121
121
|
}
|
|
122
122
|
|
|
123
123
|
@if (showColumnPicker) {
|
|
124
|
-
<
|
|
124
|
+
<button kpButton variant="outline" size="sm" [iconOnly]="true" aria-label="Columns" (click)="columnsClick.emit()">
|
|
125
125
|
<kp-icon kpButtonIconLeft name="layout-columns" />
|
|
126
|
-
</
|
|
126
|
+
</button>
|
|
127
127
|
}
|
|
128
128
|
|
|
129
129
|
@if (showExport) {
|
|
130
|
-
<
|
|
130
|
+
<button kpButton variant="ghost" size="sm" (click)="exportClick.emit()">
|
|
131
131
|
<kp-icon kpButtonIconLeft name="download" />
|
|
132
132
|
<span>Export</span>
|
|
133
|
-
</
|
|
133
|
+
</button>
|
|
134
134
|
}
|
|
135
135
|
|
|
136
136
|
@if (hasRightActions && showCreate) {
|
|
@@ -138,10 +138,10 @@ class KpTableToolbarComponent {
|
|
|
138
138
|
}
|
|
139
139
|
|
|
140
140
|
@if (showCreate) {
|
|
141
|
-
<
|
|
141
|
+
<button kpButton variant="default" color="primary" size="sm" (click)="createClick.emit()">
|
|
142
142
|
<kp-icon kpButtonIconLeft name="plus" />
|
|
143
143
|
<span>{{ createLabel }}</span>
|
|
144
|
-
</
|
|
144
|
+
</button>
|
|
145
145
|
}
|
|
146
146
|
</div>
|
|
147
147
|
} @else {
|
|
@@ -149,33 +149,33 @@ class KpTableToolbarComponent {
|
|
|
149
149
|
<span class="kp-tt__selected">
|
|
150
150
|
<strong>{{ selectedCount }}</strong> {{ selectedCount === 1 ? 'item' : 'items' }} selected
|
|
151
151
|
</span>
|
|
152
|
-
<
|
|
152
|
+
<button kpButton variant="ghost" size="sm" (click)="clearSelection.emit()">
|
|
153
153
|
<kp-icon kpButtonIconLeft name="x" />
|
|
154
154
|
<span>Clear selection</span>
|
|
155
|
-
</
|
|
155
|
+
</button>
|
|
156
156
|
</div>
|
|
157
157
|
|
|
158
158
|
<div class="kp-tt__right">
|
|
159
|
-
<
|
|
159
|
+
<button kpButton variant="outline" size="sm" (click)="bulkExport.emit()">
|
|
160
160
|
<kp-icon kpButtonIconLeft name="download" />
|
|
161
161
|
<span>Export selected</span>
|
|
162
|
-
</
|
|
163
|
-
<
|
|
162
|
+
</button>
|
|
163
|
+
<button kpButton variant="outline" size="sm" (click)="bulkTag.emit()">
|
|
164
164
|
<kp-icon kpButtonIconLeft name="tag" />
|
|
165
165
|
<span>Tag</span>
|
|
166
|
-
</
|
|
167
|
-
<
|
|
166
|
+
</button>
|
|
167
|
+
<button kpButton variant="outline" size="sm" (click)="bulkMove.emit()">
|
|
168
168
|
<kp-icon kpButtonIconLeft name="folder" />
|
|
169
169
|
<span>Move to…</span>
|
|
170
|
-
</
|
|
170
|
+
</button>
|
|
171
171
|
<span class="kp-tt__divider" aria-hidden="true"></span>
|
|
172
|
-
<
|
|
172
|
+
<button kpButton variant="outline" color="danger" size="sm" (click)="bulkDelete.emit()">
|
|
173
173
|
<kp-icon kpButtonIconLeft name="trash" />
|
|
174
174
|
<span>Delete</span>
|
|
175
|
-
</
|
|
175
|
+
</button>
|
|
176
176
|
</div>
|
|
177
177
|
}
|
|
178
|
-
`, isInline: true, styles: [":host{box-sizing:border-box;display:flex;width:100%;max-width:100%;min-width:0;overflow:hidden;align-items:center;flex-wrap:wrap;gap:12px;row-gap:8px;padding:12px 16px;background:var(--kp-color-surface-base);border-bottom:1px solid var(--kp-color-border-default);font-family:var(--kp-font-family-sans, \"Onest\", system-ui, sans-serif)}.kp-tt__left{display:flex;align-items:center;flex-wrap:wrap;gap:12px;row-gap:8px;flex:1 1 auto;min-width:0}.kp-tt__right{display:flex;align-items:center;flex-wrap:wrap;gap:8px;row-gap:8px;flex:0 1 auto;justify-content:flex-end;margin-inline-start:auto}:host kp-search-bar{display:flex!important;flex:1 1 240px;min-width:0;max-width:320px}:host kp-search-bar ::ng-deep .kp-search-bar__wrap{width:100%!important;min-width:0}.kp-tt__divider{width:1px;height:24px;background:var(--kp-color-surface-strong);margin:0 4px}.kp-tt__selected{font-size:13px;color:var(--kp-color-text-default)}.kp-tt__selected strong{color:var(--kp-color-text-strong);font-weight:600}.kp-tt__density{display:inline-flex;padding:2px;border:1px solid var(--kp-color-border-default);border-radius:6px;background:var(--kp-color-surface-subtle)}.kp-tt__density-btn{display:inline-flex;align-items:center;justify-content:center;width:28px;height:24px;padding:0;border:none;background:transparent;border-radius:4px;color:var(--kp-color-text-muted);cursor:pointer;font:inherit}.kp-tt__density-btn:hover{color:var(--kp-color-text-strong)}.kp-tt__density-btn--active{background:var(--kp-color-surface-base);color:var(--kp-color-text-strong);box-shadow:var(--kp-elevation-raised)}.kp-tt__density-btn .ti{font-size:14px;line-height:1}:host .ti{font-size:14px;line-height:1}\n"], dependencies: [{ kind: "component", type: KpButtonComponent, selector: "
|
|
178
|
+
`, isInline: true, styles: [":host{box-sizing:border-box;display:flex;width:100%;max-width:100%;min-width:0;overflow:hidden;align-items:center;flex-wrap:wrap;gap:12px;row-gap:8px;padding:12px 16px;background:var(--kp-color-surface-base);border-bottom:1px solid var(--kp-color-border-default);font-family:var(--kp-font-family-sans, \"Onest\", system-ui, sans-serif)}.kp-tt__left{display:flex;align-items:center;flex-wrap:wrap;gap:12px;row-gap:8px;flex:1 1 auto;min-width:0}.kp-tt__right{display:flex;align-items:center;flex-wrap:wrap;gap:8px;row-gap:8px;flex:0 1 auto;justify-content:flex-end;margin-inline-start:auto}:host kp-search-bar{display:flex!important;flex:1 1 240px;min-width:0;max-width:320px}:host kp-search-bar ::ng-deep .kp-search-bar__wrap{width:100%!important;min-width:0}.kp-tt__divider{width:1px;height:24px;background:var(--kp-color-surface-strong);margin:0 4px}.kp-tt__selected{font-size:13px;color:var(--kp-color-text-default)}.kp-tt__selected strong{color:var(--kp-color-text-strong);font-weight:600}.kp-tt__density{display:inline-flex;padding:2px;border:1px solid var(--kp-color-border-default);border-radius:6px;background:var(--kp-color-surface-subtle)}.kp-tt__density-btn{display:inline-flex;align-items:center;justify-content:center;width:28px;height:24px;padding:0;border:none;background:transparent;border-radius:4px;color:var(--kp-color-text-muted);cursor:pointer;font:inherit}.kp-tt__density-btn:hover{color:var(--kp-color-text-strong)}.kp-tt__density-btn--active{background:var(--kp-color-surface-base);color:var(--kp-color-text-strong);box-shadow:var(--kp-elevation-raised)}.kp-tt__density-btn .ti{font-size:14px;line-height:1}:host .ti{font-size:14px;line-height:1}\n"], dependencies: [{ kind: "component", type: KpButtonComponent, selector: "button[kpButton]", inputs: ["type", "size", "variant", "color", "disabled", "loading", "iconOnly", "forceState"] }, { kind: "component", type: KpBadgeComponent, selector: "kp-badge", inputs: ["size", "appearance", "color", "pill", "count", "showLeadingDot", "closable"], outputs: ["close"] }, { kind: "component", type: KpIconComponent, selector: "kp-icon", inputs: ["name", "size"] }, { kind: "component", type: KpSearchBarComponent, selector: "kp-search-bar", inputs: ["variant", "size", "placeholder", "value", "showShortcutHint", "shortcutHint", "groups"], outputs: ["valueChange", "search", "itemClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
179
179
|
}
|
|
180
180
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.7", ngImport: i0, type: KpTableToolbarComponent, decorators: [{
|
|
181
181
|
type: Component,
|
|
@@ -193,20 +193,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.7", ngImpor
|
|
|
193
193
|
}
|
|
194
194
|
|
|
195
195
|
@if (showFilter) {
|
|
196
|
-
<
|
|
196
|
+
<button kpButton variant="outline" size="sm" (click)="filterClick.emit()">
|
|
197
197
|
<kp-icon kpButtonIconLeft name="filter" />
|
|
198
198
|
Filters
|
|
199
199
|
@if (activeFilterCount > 0) {
|
|
200
200
|
<kp-badge kpButtonIconRight size="xs" color="primary" appearance="subtle">{{ activeFilterCount }}</kp-badge>
|
|
201
201
|
}
|
|
202
|
-
</
|
|
202
|
+
</button>
|
|
203
203
|
}
|
|
204
204
|
|
|
205
205
|
@if (showSort) {
|
|
206
|
-
<
|
|
206
|
+
<button kpButton variant="outline" size="sm" (click)="sortClick.emit()">
|
|
207
207
|
<kp-icon kpButtonIconLeft name="arrows-up-down" />
|
|
208
208
|
<span>Sort</span>
|
|
209
|
-
</
|
|
209
|
+
</button>
|
|
210
210
|
}
|
|
211
211
|
</div>
|
|
212
212
|
|
|
@@ -241,16 +241,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.7", ngImpor
|
|
|
241
241
|
}
|
|
242
242
|
|
|
243
243
|
@if (showColumnPicker) {
|
|
244
|
-
<
|
|
244
|
+
<button kpButton variant="outline" size="sm" [iconOnly]="true" aria-label="Columns" (click)="columnsClick.emit()">
|
|
245
245
|
<kp-icon kpButtonIconLeft name="layout-columns" />
|
|
246
|
-
</
|
|
246
|
+
</button>
|
|
247
247
|
}
|
|
248
248
|
|
|
249
249
|
@if (showExport) {
|
|
250
|
-
<
|
|
250
|
+
<button kpButton variant="ghost" size="sm" (click)="exportClick.emit()">
|
|
251
251
|
<kp-icon kpButtonIconLeft name="download" />
|
|
252
252
|
<span>Export</span>
|
|
253
|
-
</
|
|
253
|
+
</button>
|
|
254
254
|
}
|
|
255
255
|
|
|
256
256
|
@if (hasRightActions && showCreate) {
|
|
@@ -258,10 +258,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.7", ngImpor
|
|
|
258
258
|
}
|
|
259
259
|
|
|
260
260
|
@if (showCreate) {
|
|
261
|
-
<
|
|
261
|
+
<button kpButton variant="default" color="primary" size="sm" (click)="createClick.emit()">
|
|
262
262
|
<kp-icon kpButtonIconLeft name="plus" />
|
|
263
263
|
<span>{{ createLabel }}</span>
|
|
264
|
-
</
|
|
264
|
+
</button>
|
|
265
265
|
}
|
|
266
266
|
</div>
|
|
267
267
|
} @else {
|
|
@@ -269,30 +269,30 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.7", ngImpor
|
|
|
269
269
|
<span class="kp-tt__selected">
|
|
270
270
|
<strong>{{ selectedCount }}</strong> {{ selectedCount === 1 ? 'item' : 'items' }} selected
|
|
271
271
|
</span>
|
|
272
|
-
<
|
|
272
|
+
<button kpButton variant="ghost" size="sm" (click)="clearSelection.emit()">
|
|
273
273
|
<kp-icon kpButtonIconLeft name="x" />
|
|
274
274
|
<span>Clear selection</span>
|
|
275
|
-
</
|
|
275
|
+
</button>
|
|
276
276
|
</div>
|
|
277
277
|
|
|
278
278
|
<div class="kp-tt__right">
|
|
279
|
-
<
|
|
279
|
+
<button kpButton variant="outline" size="sm" (click)="bulkExport.emit()">
|
|
280
280
|
<kp-icon kpButtonIconLeft name="download" />
|
|
281
281
|
<span>Export selected</span>
|
|
282
|
-
</
|
|
283
|
-
<
|
|
282
|
+
</button>
|
|
283
|
+
<button kpButton variant="outline" size="sm" (click)="bulkTag.emit()">
|
|
284
284
|
<kp-icon kpButtonIconLeft name="tag" />
|
|
285
285
|
<span>Tag</span>
|
|
286
|
-
</
|
|
287
|
-
<
|
|
286
|
+
</button>
|
|
287
|
+
<button kpButton variant="outline" size="sm" (click)="bulkMove.emit()">
|
|
288
288
|
<kp-icon kpButtonIconLeft name="folder" />
|
|
289
289
|
<span>Move to…</span>
|
|
290
|
-
</
|
|
290
|
+
</button>
|
|
291
291
|
<span class="kp-tt__divider" aria-hidden="true"></span>
|
|
292
|
-
<
|
|
292
|
+
<button kpButton variant="outline" color="danger" size="sm" (click)="bulkDelete.emit()">
|
|
293
293
|
<kp-icon kpButtonIconLeft name="trash" />
|
|
294
294
|
<span>Delete</span>
|
|
295
|
-
</
|
|
295
|
+
</button>
|
|
296
296
|
</div>
|
|
297
297
|
}
|
|
298
298
|
`, styles: [":host{box-sizing:border-box;display:flex;width:100%;max-width:100%;min-width:0;overflow:hidden;align-items:center;flex-wrap:wrap;gap:12px;row-gap:8px;padding:12px 16px;background:var(--kp-color-surface-base);border-bottom:1px solid var(--kp-color-border-default);font-family:var(--kp-font-family-sans, \"Onest\", system-ui, sans-serif)}.kp-tt__left{display:flex;align-items:center;flex-wrap:wrap;gap:12px;row-gap:8px;flex:1 1 auto;min-width:0}.kp-tt__right{display:flex;align-items:center;flex-wrap:wrap;gap:8px;row-gap:8px;flex:0 1 auto;justify-content:flex-end;margin-inline-start:auto}:host kp-search-bar{display:flex!important;flex:1 1 240px;min-width:0;max-width:320px}:host kp-search-bar ::ng-deep .kp-search-bar__wrap{width:100%!important;min-width:0}.kp-tt__divider{width:1px;height:24px;background:var(--kp-color-surface-strong);margin:0 4px}.kp-tt__selected{font-size:13px;color:var(--kp-color-text-default)}.kp-tt__selected strong{color:var(--kp-color-text-strong);font-weight:600}.kp-tt__density{display:inline-flex;padding:2px;border:1px solid var(--kp-color-border-default);border-radius:6px;background:var(--kp-color-surface-subtle)}.kp-tt__density-btn{display:inline-flex;align-items:center;justify-content:center;width:28px;height:24px;padding:0;border:none;background:transparent;border-radius:4px;color:var(--kp-color-text-muted);cursor:pointer;font:inherit}.kp-tt__density-btn:hover{color:var(--kp-color-text-strong)}.kp-tt__density-btn--active{background:var(--kp-color-surface-base);color:var(--kp-color-text-strong);box-shadow:var(--kp-elevation-raised)}.kp-tt__density-btn .ti{font-size:14px;line-height:1}:host .ti{font-size:14px;line-height:1}\n"] }]
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"kanso-protocol-table-toolbar.mjs","sources":["../../../../../packages/patterns/table-toolbar/src/table-toolbar.component.ts","../../../../../packages/patterns/table-toolbar/src/kanso-protocol-table-toolbar.ts"],"sourcesContent":["import {\n ChangeDetectionStrategy,\n Component,\n EventEmitter,\n Input,\n Output,\n} from '@angular/core';\nimport { KpButtonComponent } from '@kanso-protocol/button';\nimport { KpBadgeComponent } from '@kanso-protocol/badge';\nimport { KpIconComponent } from '@kanso-protocol/icon';\nimport { KpSearchBarComponent } from '@kanso-protocol/search-bar';\n\nexport type KpTableToolbarMode = 'default' | 'bulk-select';\nexport type KpTableToolbarDensity = 'compact' | 'comfortable' | 'spacious';\n\n/**\n * Kanso Protocol — TableToolbar\n *\n * Panel that sits above a data table. Two modes:\n * - `default` — search + filter/sort + right-side actions (density, columns,\n * export, create).\n * - `bulk-select` — swaps to a selection summary with bulk actions\n * (export / tag / move / delete).\n *\n * Composes SearchBar, Button, Badge. Action slots are boolean toggles so\n * you can dial the toolbar from minimal (\"search + create\") up to a full\n * admin bar without touching templates.\n *\n * @example\n * <kp-table-toolbar\n * [showFilter]=\"true\"\n * [activeFilterCount]=\"2\"\n * (createClick)=\"openCreate()\">\n * </kp-table-toolbar>\n */\n@Component({\n selector: 'kp-table-toolbar',\n imports: [KpButtonComponent, KpBadgeComponent, KpIconComponent, KpSearchBarComponent],\n changeDetection: ChangeDetectionStrategy.OnPush,\n host: { '[class]': 'hostClasses' },\n template: `\n @if (mode === 'default') {\n <div class=\"kp-tt__left\">\n @if (showSearch) {\n <kp-search-bar\n variant=\"inline\"\n size=\"sm\"\n [placeholder]=\"searchPlaceholder\"\n [value]=\"searchValue\"\n (valueChange)=\"searchChange.emit($event)\"\n />\n }\n\n @if (showFilter) {\n <kp-button variant=\"outline\" size=\"sm\" (click)=\"filterClick.emit()\">\n <kp-icon kpButtonIconLeft name=\"filter\" />\n Filters\n @if (activeFilterCount > 0) {\n <kp-badge kpButtonIconRight size=\"xs\" color=\"primary\" appearance=\"subtle\">{{ activeFilterCount }}</kp-badge>\n }\n </kp-button>\n }\n\n @if (showSort) {\n <kp-button variant=\"outline\" size=\"sm\" (click)=\"sortClick.emit()\">\n <kp-icon kpButtonIconLeft name=\"arrows-up-down\" />\n <span>Sort</span>\n </kp-button>\n }\n </div>\n\n <div class=\"kp-tt__right\">\n @if (showDensity) {\n <div class=\"kp-tt__density\" role=\"group\" aria-label=\"Row density\">\n <button\n type=\"button\"\n class=\"kp-tt__density-btn\"\n [class.kp-tt__density-btn--active]=\"density === 'compact'\"\n (click)=\"densityChange.emit('compact')\"\n aria-label=\"Compact\">\n <kp-icon name=\"layout-list\" />\n </button>\n <button\n type=\"button\"\n class=\"kp-tt__density-btn\"\n [class.kp-tt__density-btn--active]=\"density === 'comfortable'\"\n (click)=\"densityChange.emit('comfortable')\"\n aria-label=\"Comfortable\">\n <kp-icon name=\"layout-rows\" />\n </button>\n <button\n type=\"button\"\n class=\"kp-tt__density-btn\"\n [class.kp-tt__density-btn--active]=\"density === 'spacious'\"\n (click)=\"densityChange.emit('spacious')\"\n aria-label=\"Spacious\">\n <kp-icon name=\"layout-grid\" />\n </button>\n </div>\n }\n\n @if (showColumnPicker) {\n <kp-button variant=\"outline\" size=\"sm\" [iconOnly]=\"true\" aria-label=\"Columns\" (click)=\"columnsClick.emit()\">\n <kp-icon kpButtonIconLeft name=\"layout-columns\" />\n </kp-button>\n }\n\n @if (showExport) {\n <kp-button variant=\"ghost\" size=\"sm\" (click)=\"exportClick.emit()\">\n <kp-icon kpButtonIconLeft name=\"download\" />\n <span>Export</span>\n </kp-button>\n }\n\n @if (hasRightActions && showCreate) {\n <span class=\"kp-tt__divider\" aria-hidden=\"true\"></span>\n }\n\n @if (showCreate) {\n <kp-button variant=\"default\" color=\"primary\" size=\"sm\" (click)=\"createClick.emit()\">\n <kp-icon kpButtonIconLeft name=\"plus\" />\n <span>{{ createLabel }}</span>\n </kp-button>\n }\n </div>\n } @else {\n <div class=\"kp-tt__left\">\n <span class=\"kp-tt__selected\">\n <strong>{{ selectedCount }}</strong> {{ selectedCount === 1 ? 'item' : 'items' }} selected\n </span>\n <kp-button variant=\"ghost\" size=\"sm\" (click)=\"clearSelection.emit()\">\n <kp-icon kpButtonIconLeft name=\"x\" />\n <span>Clear selection</span>\n </kp-button>\n </div>\n\n <div class=\"kp-tt__right\">\n <kp-button variant=\"outline\" size=\"sm\" (click)=\"bulkExport.emit()\">\n <kp-icon kpButtonIconLeft name=\"download\" />\n <span>Export selected</span>\n </kp-button>\n <kp-button variant=\"outline\" size=\"sm\" (click)=\"bulkTag.emit()\">\n <kp-icon kpButtonIconLeft name=\"tag\" />\n <span>Tag</span>\n </kp-button>\n <kp-button variant=\"outline\" size=\"sm\" (click)=\"bulkMove.emit()\">\n <kp-icon kpButtonIconLeft name=\"folder\" />\n <span>Move to…</span>\n </kp-button>\n <span class=\"kp-tt__divider\" aria-hidden=\"true\"></span>\n <kp-button variant=\"outline\" color=\"danger\" size=\"sm\" (click)=\"bulkDelete.emit()\">\n <kp-icon kpButtonIconLeft name=\"trash\" />\n <span>Delete</span>\n </kp-button>\n </div>\n }\n `,\n styles: [`\n :host {\n box-sizing: border-box;\n display: flex;\n width: 100%;\n max-width: 100%;\n min-width: 0;\n overflow: hidden;\n align-items: center;\n flex-wrap: wrap;\n gap: 12px;\n row-gap: 8px;\n padding: 12px 16px;\n background: var(--kp-color-surface-base);\n border-bottom: 1px solid var(--kp-color-border-default);\n font-family: var(--kp-font-family-sans, 'Onest', system-ui, sans-serif);\n }\n\n .kp-tt__left {\n display: flex;\n align-items: center;\n flex-wrap: wrap;\n gap: 12px;\n row-gap: 8px;\n flex: 1 1 auto;\n min-width: 0;\n }\n\n .kp-tt__right {\n display: flex;\n align-items: center;\n flex-wrap: wrap;\n gap: 8px;\n row-gap: 8px;\n flex: 0 1 auto;\n justify-content: flex-end;\n margin-inline-start: auto;\n }\n\n /* Let SearchBar shrink inside the toolbar when the viewport is narrow.\n Need !important — SearchBar's own :host { display: inline-block }\n wins on specificity otherwise. */\n :host kp-search-bar {\n display: flex !important;\n flex: 1 1 240px;\n min-width: 0;\n max-width: 320px;\n }\n :host kp-search-bar ::ng-deep .kp-search-bar__wrap {\n width: 100% !important;\n min-width: 0;\n }\n\n .kp-tt__divider {\n width: 1px;\n height: 24px;\n background: var(--kp-color-surface-strong);\n margin: 0 4px;\n }\n\n .kp-tt__selected {\n font-size: 13px;\n color: var(--kp-color-text-default);\n }\n .kp-tt__selected strong {\n color: var(--kp-color-text-strong);\n font-weight: 600;\n }\n\n /* Density toggle — compact segmented look */\n .kp-tt__density {\n display: inline-flex;\n padding: 2px;\n border: 1px solid var(--kp-color-border-default);\n border-radius: 6px;\n background: var(--kp-color-surface-subtle);\n }\n .kp-tt__density-btn {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 28px;\n height: 24px;\n padding: 0;\n border: none;\n background: transparent;\n border-radius: 4px;\n color: var(--kp-color-text-muted);\n cursor: pointer;\n font: inherit;\n }\n .kp-tt__density-btn:hover { color: var(--kp-color-text-strong); }\n .kp-tt__density-btn--active {\n background: var(--kp-color-surface-base);\n color: var(--kp-color-text-strong);\n box-shadow: var(--kp-elevation-raised);\n }\n .kp-tt__density-btn .ti { font-size: 14px; line-height: 1; }\n\n /* Inline icons inside buttons */\n :host .ti { font-size: 14px; line-height: 1; }\n `],\n})\nexport class KpTableToolbarComponent {\n @Input() mode: KpTableToolbarMode = 'default';\n\n @Input() showSearch = true;\n @Input() searchPlaceholder = 'Search…';\n @Input() searchValue = '';\n\n @Input() showFilter = true;\n @Input() activeFilterCount = 0;\n\n @Input() showSort = false;\n @Input() showDensity = false;\n @Input() density: KpTableToolbarDensity = 'comfortable';\n\n @Input() showColumnPicker = false;\n @Input() showExport = false;\n @Input() showCreate = true;\n @Input() createLabel = 'Create new';\n\n @Input() selectedCount = 0;\n\n @Output() searchChange = new EventEmitter<string>();\n @Output() filterClick = new EventEmitter<void>();\n @Output() sortClick = new EventEmitter<void>();\n @Output() densityChange = new EventEmitter<KpTableToolbarDensity>();\n @Output() columnsClick = new EventEmitter<void>();\n @Output() exportClick = new EventEmitter<void>();\n @Output() createClick = new EventEmitter<void>();\n\n @Output() clearSelection = new EventEmitter<void>();\n @Output() bulkExport = new EventEmitter<void>();\n @Output() bulkTag = new EventEmitter<void>();\n @Output() bulkMove = new EventEmitter<void>();\n @Output() bulkDelete = new EventEmitter<void>();\n\n get hasRightActions(): boolean {\n return this.showDensity || this.showColumnPicker || this.showExport;\n }\n\n get hostClasses(): string {\n return `kp-tt kp-tt--${this.mode}`;\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"kanso-protocol-table-toolbar.mjs","sources":["../../../../../packages/patterns/table-toolbar/src/table-toolbar.component.ts","../../../../../packages/patterns/table-toolbar/src/kanso-protocol-table-toolbar.ts"],"sourcesContent":["import {\n ChangeDetectionStrategy,\n Component,\n EventEmitter,\n Input,\n Output,\n} from '@angular/core';\nimport { KpButtonComponent } from '@kanso-protocol/button';\nimport { KpBadgeComponent } from '@kanso-protocol/badge';\nimport { KpIconComponent } from '@kanso-protocol/icon';\nimport { KpSearchBarComponent } from '@kanso-protocol/search-bar';\n\nexport type KpTableToolbarMode = 'default' | 'bulk-select';\nexport type KpTableToolbarDensity = 'compact' | 'comfortable' | 'spacious';\n\n/**\n * Kanso Protocol — TableToolbar\n *\n * Panel that sits above a data table. Two modes:\n * - `default` — search + filter/sort + right-side actions (density, columns,\n * export, create).\n * - `bulk-select` — swaps to a selection summary with bulk actions\n * (export / tag / move / delete).\n *\n * Composes SearchBar, Button, Badge. Action slots are boolean toggles so\n * you can dial the toolbar from minimal (\"search + create\") up to a full\n * admin bar without touching templates.\n *\n * @example\n * <kp-table-toolbar\n * [showFilter]=\"true\"\n * [activeFilterCount]=\"2\"\n * (createClick)=\"openCreate()\">\n * </kp-table-toolbar>\n */\n@Component({\n selector: 'kp-table-toolbar',\n imports: [KpButtonComponent, KpBadgeComponent, KpIconComponent, KpSearchBarComponent],\n changeDetection: ChangeDetectionStrategy.OnPush,\n host: { '[class]': 'hostClasses' },\n template: `\n @if (mode === 'default') {\n <div class=\"kp-tt__left\">\n @if (showSearch) {\n <kp-search-bar\n variant=\"inline\"\n size=\"sm\"\n [placeholder]=\"searchPlaceholder\"\n [value]=\"searchValue\"\n (valueChange)=\"searchChange.emit($event)\"\n />\n }\n\n @if (showFilter) {\n <button kpButton variant=\"outline\" size=\"sm\" (click)=\"filterClick.emit()\">\n <kp-icon kpButtonIconLeft name=\"filter\" />\n Filters\n @if (activeFilterCount > 0) {\n <kp-badge kpButtonIconRight size=\"xs\" color=\"primary\" appearance=\"subtle\">{{ activeFilterCount }}</kp-badge>\n }\n </button>\n }\n\n @if (showSort) {\n <button kpButton variant=\"outline\" size=\"sm\" (click)=\"sortClick.emit()\">\n <kp-icon kpButtonIconLeft name=\"arrows-up-down\" />\n <span>Sort</span>\n </button>\n }\n </div>\n\n <div class=\"kp-tt__right\">\n @if (showDensity) {\n <div class=\"kp-tt__density\" role=\"group\" aria-label=\"Row density\">\n <button\n type=\"button\"\n class=\"kp-tt__density-btn\"\n [class.kp-tt__density-btn--active]=\"density === 'compact'\"\n (click)=\"densityChange.emit('compact')\"\n aria-label=\"Compact\">\n <kp-icon name=\"layout-list\" />\n </button>\n <button\n type=\"button\"\n class=\"kp-tt__density-btn\"\n [class.kp-tt__density-btn--active]=\"density === 'comfortable'\"\n (click)=\"densityChange.emit('comfortable')\"\n aria-label=\"Comfortable\">\n <kp-icon name=\"layout-rows\" />\n </button>\n <button\n type=\"button\"\n class=\"kp-tt__density-btn\"\n [class.kp-tt__density-btn--active]=\"density === 'spacious'\"\n (click)=\"densityChange.emit('spacious')\"\n aria-label=\"Spacious\">\n <kp-icon name=\"layout-grid\" />\n </button>\n </div>\n }\n\n @if (showColumnPicker) {\n <button kpButton variant=\"outline\" size=\"sm\" [iconOnly]=\"true\" aria-label=\"Columns\" (click)=\"columnsClick.emit()\">\n <kp-icon kpButtonIconLeft name=\"layout-columns\" />\n </button>\n }\n\n @if (showExport) {\n <button kpButton variant=\"ghost\" size=\"sm\" (click)=\"exportClick.emit()\">\n <kp-icon kpButtonIconLeft name=\"download\" />\n <span>Export</span>\n </button>\n }\n\n @if (hasRightActions && showCreate) {\n <span class=\"kp-tt__divider\" aria-hidden=\"true\"></span>\n }\n\n @if (showCreate) {\n <button kpButton variant=\"default\" color=\"primary\" size=\"sm\" (click)=\"createClick.emit()\">\n <kp-icon kpButtonIconLeft name=\"plus\" />\n <span>{{ createLabel }}</span>\n </button>\n }\n </div>\n } @else {\n <div class=\"kp-tt__left\">\n <span class=\"kp-tt__selected\">\n <strong>{{ selectedCount }}</strong> {{ selectedCount === 1 ? 'item' : 'items' }} selected\n </span>\n <button kpButton variant=\"ghost\" size=\"sm\" (click)=\"clearSelection.emit()\">\n <kp-icon kpButtonIconLeft name=\"x\" />\n <span>Clear selection</span>\n </button>\n </div>\n\n <div class=\"kp-tt__right\">\n <button kpButton variant=\"outline\" size=\"sm\" (click)=\"bulkExport.emit()\">\n <kp-icon kpButtonIconLeft name=\"download\" />\n <span>Export selected</span>\n </button>\n <button kpButton variant=\"outline\" size=\"sm\" (click)=\"bulkTag.emit()\">\n <kp-icon kpButtonIconLeft name=\"tag\" />\n <span>Tag</span>\n </button>\n <button kpButton variant=\"outline\" size=\"sm\" (click)=\"bulkMove.emit()\">\n <kp-icon kpButtonIconLeft name=\"folder\" />\n <span>Move to…</span>\n </button>\n <span class=\"kp-tt__divider\" aria-hidden=\"true\"></span>\n <button kpButton variant=\"outline\" color=\"danger\" size=\"sm\" (click)=\"bulkDelete.emit()\">\n <kp-icon kpButtonIconLeft name=\"trash\" />\n <span>Delete</span>\n </button>\n </div>\n }\n `,\n styles: [`\n :host {\n box-sizing: border-box;\n display: flex;\n width: 100%;\n max-width: 100%;\n min-width: 0;\n overflow: hidden;\n align-items: center;\n flex-wrap: wrap;\n gap: 12px;\n row-gap: 8px;\n padding: 12px 16px;\n background: var(--kp-color-surface-base);\n border-bottom: 1px solid var(--kp-color-border-default);\n font-family: var(--kp-font-family-sans, 'Onest', system-ui, sans-serif);\n }\n\n .kp-tt__left {\n display: flex;\n align-items: center;\n flex-wrap: wrap;\n gap: 12px;\n row-gap: 8px;\n flex: 1 1 auto;\n min-width: 0;\n }\n\n .kp-tt__right {\n display: flex;\n align-items: center;\n flex-wrap: wrap;\n gap: 8px;\n row-gap: 8px;\n flex: 0 1 auto;\n justify-content: flex-end;\n margin-inline-start: auto;\n }\n\n /* Let SearchBar shrink inside the toolbar when the viewport is narrow.\n Need !important — SearchBar's own :host { display: inline-block }\n wins on specificity otherwise. */\n :host kp-search-bar {\n display: flex !important;\n flex: 1 1 240px;\n min-width: 0;\n max-width: 320px;\n }\n :host kp-search-bar ::ng-deep .kp-search-bar__wrap {\n width: 100% !important;\n min-width: 0;\n }\n\n .kp-tt__divider {\n width: 1px;\n height: 24px;\n background: var(--kp-color-surface-strong);\n margin: 0 4px;\n }\n\n .kp-tt__selected {\n font-size: 13px;\n color: var(--kp-color-text-default);\n }\n .kp-tt__selected strong {\n color: var(--kp-color-text-strong);\n font-weight: 600;\n }\n\n /* Density toggle — compact segmented look */\n .kp-tt__density {\n display: inline-flex;\n padding: 2px;\n border: 1px solid var(--kp-color-border-default);\n border-radius: 6px;\n background: var(--kp-color-surface-subtle);\n }\n .kp-tt__density-btn {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 28px;\n height: 24px;\n padding: 0;\n border: none;\n background: transparent;\n border-radius: 4px;\n color: var(--kp-color-text-muted);\n cursor: pointer;\n font: inherit;\n }\n .kp-tt__density-btn:hover { color: var(--kp-color-text-strong); }\n .kp-tt__density-btn--active {\n background: var(--kp-color-surface-base);\n color: var(--kp-color-text-strong);\n box-shadow: var(--kp-elevation-raised);\n }\n .kp-tt__density-btn .ti { font-size: 14px; line-height: 1; }\n\n /* Inline icons inside buttons */\n :host .ti { font-size: 14px; line-height: 1; }\n `],\n})\nexport class KpTableToolbarComponent {\n @Input() mode: KpTableToolbarMode = 'default';\n\n @Input() showSearch = true;\n @Input() searchPlaceholder = 'Search…';\n @Input() searchValue = '';\n\n @Input() showFilter = true;\n @Input() activeFilterCount = 0;\n\n @Input() showSort = false;\n @Input() showDensity = false;\n @Input() density: KpTableToolbarDensity = 'comfortable';\n\n @Input() showColumnPicker = false;\n @Input() showExport = false;\n @Input() showCreate = true;\n @Input() createLabel = 'Create new';\n\n @Input() selectedCount = 0;\n\n @Output() searchChange = new EventEmitter<string>();\n @Output() filterClick = new EventEmitter<void>();\n @Output() sortClick = new EventEmitter<void>();\n @Output() densityChange = new EventEmitter<KpTableToolbarDensity>();\n @Output() columnsClick = new EventEmitter<void>();\n @Output() exportClick = new EventEmitter<void>();\n @Output() createClick = new EventEmitter<void>();\n\n @Output() clearSelection = new EventEmitter<void>();\n @Output() bulkExport = new EventEmitter<void>();\n @Output() bulkTag = new EventEmitter<void>();\n @Output() bulkMove = new EventEmitter<void>();\n @Output() bulkDelete = new EventEmitter<void>();\n\n get hasRightActions(): boolean {\n return this.showDensity || this.showColumnPicker || this.showExport;\n }\n\n get hostClasses(): string {\n return `kp-tt kp-tt--${this.mode}`;\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@kanso-protocol/table-toolbar",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "2.0.0",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"peerDependencies": {
|
|
6
6
|
"@angular/core": ">=21.0.0",
|
|
7
7
|
"@angular/common": ">=21.0.0",
|
|
8
|
-
"@kanso-protocol/core": ">=
|
|
9
|
-
"@kanso-protocol/button": ">=
|
|
10
|
-
"@kanso-protocol/badge": ">=
|
|
11
|
-
"@kanso-protocol/search-bar": ">=
|
|
8
|
+
"@kanso-protocol/core": ">=2.0.0",
|
|
9
|
+
"@kanso-protocol/button": ">=2.0.0",
|
|
10
|
+
"@kanso-protocol/badge": ">=2.0.0",
|
|
11
|
+
"@kanso-protocol/search-bar": ">=2.0.0"
|
|
12
12
|
},
|
|
13
13
|
"description": "Kanso Protocol — table-toolbar (pattern).",
|
|
14
14
|
"author": "GregNBlack",
|