@knime/kds-components 0.13.0 → 0.13.2

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.
@@ -0,0 +1,8 @@
1
+ import { KdsBadgeProps, KdsBadgeSize } from './types';
2
+ declare const _default: import('vue').DefineComponent<KdsBadgeProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<KdsBadgeProps> & Readonly<{}>, {
3
+ size: KdsBadgeSize;
4
+ variant: import('./types').KdsBadgeVariant;
5
+ icon: import('packages/styles/dist/img/icons/def').IconName;
6
+ }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLSpanElement>;
7
+ export default _default;
8
+ //# sourceMappingURL=KdsBadge.vue.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"KdsBadge.vue.d.ts","sourceRoot":"","sources":["../../../src/accessories/Badge/KdsBadge.vue"],"names":[],"mappings":"AAgGA,OAAO,KAAK,EAAE,aAAa,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;;;;;;AAwF3D,wBAQG"}
@@ -0,0 +1,15 @@
1
+ export declare const kdsBadgeVariant: {
2
+ readonly NEUTRAL: "neutral";
3
+ readonly INFO: "info";
4
+ readonly WARNING: "warning";
5
+ readonly SUCCESS: "success";
6
+ readonly ERROR: "error";
7
+ readonly GHOST: "ghost";
8
+ };
9
+ export declare const kdsBadgeVariants: ("info" | "warning" | "neutral" | "success" | "error" | "ghost")[];
10
+ export declare const kdsBadgeSize: {
11
+ readonly XXSMALL: "xxsmall";
12
+ readonly XSMALL: "xsmall";
13
+ };
14
+ export declare const kdsBadgeSizes: ("xsmall" | "xxsmall")[];
15
+ //# sourceMappingURL=enums.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"enums.d.ts","sourceRoot":"","sources":["../../../src/accessories/Badge/enums.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,eAAe;;;;;;;CAOlB,CAAC;AAEX,eAAO,MAAM,gBAAgB,oEAAiC,CAAC;AAE/D,eAAO,MAAM,YAAY;;;CAGf,CAAC;AAEX,eAAO,MAAM,aAAa,0BAA8B,CAAC"}
@@ -0,0 +1,4 @@
1
+ export { default as KdsBadge } from './KdsBadge.vue';
2
+ export { kdsBadgeSize, kdsBadgeSizes, kdsBadgeVariant, kdsBadgeVariants, } from './enums';
3
+ export type * from './types';
4
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/accessories/Badge/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AACrD,OAAO,EACL,YAAY,EACZ,aAAa,EACb,eAAe,EACf,gBAAgB,GACjB,MAAM,SAAS,CAAC;AACjB,mBAAmB,SAAS,CAAC"}
@@ -0,0 +1,15 @@
1
+ import { KdsIconName } from '../Icon';
2
+ import { kdsBadgeSize, kdsBadgeVariant } from './enums';
3
+ export type KdsBadgeVariant = (typeof kdsBadgeVariant)[keyof typeof kdsBadgeVariant];
4
+ export type KdsBadgeSize = (typeof kdsBadgeSize)[keyof typeof kdsBadgeSize];
5
+ export type KdsBadgeProps = {
6
+ /** Text content of the badge. */
7
+ label: string;
8
+ /** Visual variant of the badge. */
9
+ variant?: KdsBadgeVariant;
10
+ /** Size of the badge. Defaults to "xsmall". */
11
+ size?: KdsBadgeSize;
12
+ /** Icon shown next to the label. */
13
+ icon?: KdsIconName;
14
+ };
15
+ //# sourceMappingURL=types.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/accessories/Badge/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAE3C,OAAO,EAAE,YAAY,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAExD,MAAM,MAAM,eAAe,GACzB,CAAC,OAAO,eAAe,CAAC,CAAC,MAAM,OAAO,eAAe,CAAC,CAAC;AAEzD,MAAM,MAAM,YAAY,GAAG,CAAC,OAAO,YAAY,CAAC,CAAC,MAAM,OAAO,YAAY,CAAC,CAAC;AAE5E,MAAM,MAAM,aAAa,GAAG;IAC1B,iCAAiC;IACjC,KAAK,EAAE,MAAM,CAAC;IAEd,mCAAmC;IACnC,OAAO,CAAC,EAAE,eAAe,CAAC;IAE1B,+CAA+C;IAC/C,IAAI,CAAC,EAAE,YAAY,CAAC;IAEpB,oCAAoC;IACpC,IAAI,CAAC,EAAE,WAAW,CAAC;CACpB,CAAC"}
@@ -1,5 +1,7 @@
1
1
  export * from './Avatar';
2
2
  export type * from './Avatar';
3
+ export * from './Badge';
4
+ export type * from './Badge';
3
5
  export * from './ColorSwatch';
4
6
  export type * from './ColorSwatch';
5
7
  export * from './Icon';
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/accessories/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC;AACzB,mBAAmB,UAAU,CAAC;AAE9B,cAAc,eAAe,CAAC;AAC9B,mBAAmB,eAAe,CAAC;AAEnC,cAAc,QAAQ,CAAC;AACvB,mBAAmB,QAAQ,CAAC;AAE5B,cAAc,cAAc,CAAC;AAC7B,mBAAmB,cAAc,CAAC;AAElC,cAAc,kBAAkB,CAAC;AACjC,mBAAmB,kBAAkB,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/accessories/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC;AACzB,mBAAmB,UAAU,CAAC;AAE9B,cAAc,SAAS,CAAC;AACxB,mBAAmB,SAAS,CAAC;AAE7B,cAAc,eAAe,CAAC;AAC9B,mBAAmB,eAAe,CAAC;AAEnC,cAAc,QAAQ,CAAC;AACvB,mBAAmB,QAAQ,CAAC;AAE5B,cAAc,cAAc,CAAC;AAC7B,mBAAmB,cAAc,CAAC;AAElC,cAAc,kBAAkB,CAAC;AACjC,mBAAmB,kBAAkB,CAAC"}
@@ -8,8 +8,8 @@ declare const _default: import('vue').DefineComponent<__VLS_PublicProps, {}, {},
8
8
  }, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
9
9
  "onUpdate:modelValue"?: ((value: string[]) => any) | undefined;
10
10
  }>, {
11
- disabled: boolean;
12
11
  error: boolean;
12
+ disabled: boolean;
13
13
  alignment: import('./types').KdsCheckboxGroupAlignment;
14
14
  }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
15
15
  export default _default;
@@ -8,8 +8,8 @@ declare const _default: import('vue').DefineComponent<__VLS_PublicProps, {}, {},
8
8
  }, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
9
9
  "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
10
10
  }>, {
11
- disabled: boolean;
12
11
  error: boolean;
12
+ disabled: boolean;
13
13
  }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLButtonElement>;
14
14
  export default _default;
15
15
  //# sourceMappingURL=KdsRadioButton.vue.d.ts.map
@@ -9,8 +9,8 @@ declare const _default: import('vue').DefineComponent<__VLS_PublicProps, {}, {},
9
9
  "onUpdate:modelValue"?: ((value: string) => any) | undefined;
10
10
  }>, {
11
11
  size: import('./types').KdsValueSwitchSize;
12
- disabled: boolean;
13
12
  variant: import('./types').KdsValueSwitchVariant;
13
+ disabled: boolean;
14
14
  }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
15
15
  availableWidthContainer: HTMLDivElement;
16
16
  optionContainer: HTMLDivElement;
@@ -147,11 +147,11 @@ declare const __VLS_component: import('vue').DefineComponent<__VLS_PublicProps,
147
147
  role: string;
148
148
  placeholder: string;
149
149
  name: string;
150
+ error: boolean;
150
151
  disabled: boolean;
151
152
  leadingIcon: KdsIconName;
152
153
  ariaLabel: string;
153
154
  trailingIcon: KdsIconName;
154
- error: boolean;
155
155
  min: number;
156
156
  max: number;
157
157
  step: number;
@@ -1 +1 @@
1
- {"version":3,"file":"BaseInput.vue.d.ts","sourceRoot":"","sources":["../../../src/forms/inputs/BaseInput.vue"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"BaseInput.vue.d.ts","sourceRoot":"","sources":["../../../src/forms/inputs/BaseInput.vue"],"names":[],"mappings":"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"}
package/dist/index.css CHANGED
@@ -57,29 +57,6 @@
57
57
  .kds-avatar-initials > span[data-v-d6a313f1] {
58
58
  font-size: calc(1em + calc(100cqi - 2em) / 2);
59
59
  }
60
-
61
- .kds-color-swatch {
62
- &[data-v-bdb3dd24] {
63
- display: inline-block;
64
- flex-shrink: 0;
65
- overflow: hidden;
66
- line-height: 0;
67
- border: var(--kds-border-base-muted);
68
- border-radius: var(--kds-border-radius-container-0-25x);
69
- }
70
- &.small[data-v-bdb3dd24] {
71
- width: var(--kds-dimension-icon-0-75x);
72
- height: var(--kds-dimension-icon-0-75x);
73
- }
74
- &.medium[data-v-bdb3dd24] {
75
- width: var(--kds-dimension-icon-1x);
76
- height: var(--kds-dimension-icon-1x);
77
- }
78
- &.large[data-v-bdb3dd24] {
79
- width: var(--kds-dimension-component-width-1-25x);
80
- height: var(--kds-dimension-component-height-1-25x);
81
- }
82
- }
83
60
  .kds-icon {
84
61
  &[data-v-3a57d423] {
85
62
  --icon-width: var(--kds-dimension-icon-1x);
@@ -212,6 +189,87 @@
212
189
  }
213
190
  }
214
191
 
192
+ .kds-badge {
193
+ &[data-v-5c6c74a8] {
194
+ display: inline-flex;
195
+ align-items: center;
196
+ max-width: 100%;
197
+ border-radius: var(--kds-border-radius-container-pill);
198
+ }
199
+ & .label-wrapper[data-v-5c6c74a8] {
200
+ min-width: 0;
201
+ max-width: var(--kds-dimension-component-width-16x);
202
+ padding: 0 var(--kds-spacing-container-0-12x);
203
+ overflow: hidden;
204
+ text-overflow: ellipsis;
205
+ white-space: nowrap;
206
+ }
207
+ &.xxsmall[data-v-5c6c74a8] {
208
+ height: var(--kds-dimension-component-height-1x);
209
+ padding: 0 var(--kds-spacing-container-0-25x);
210
+ font: var(--kds-font-base-title-xsmall);
211
+ }
212
+ &.xsmall[data-v-5c6c74a8] {
213
+ gap: var(--kds-spacing-container-0-12x);
214
+ height: var(--kds-dimension-component-height-1-25x);
215
+ padding: 0 var(--kds-spacing-container-0-37x);
216
+ font: var(--kds-font-base-title-small);
217
+ }
218
+ &.neutral[data-v-5c6c74a8] {
219
+ color: var(--kds-color-text-and-icon-neutral);
220
+ background-color: var(--kds-color-background-neutral-bold-initial);
221
+ border: var(--kds-border-base-subtle);
222
+ }
223
+ &.info[data-v-5c6c74a8] {
224
+ color: var(--kds-color-text-and-icon-info);
225
+ background-color: var(--kds-color-background-static-info);
226
+ border: var(--kds-border-base-info);
227
+ }
228
+ &.warning[data-v-5c6c74a8] {
229
+ color: var(--kds-color-text-and-icon-warning);
230
+ background-color: var(--kds-color-background-static-warning);
231
+ border: var(--kds-border-base-warning);
232
+ }
233
+ &.success[data-v-5c6c74a8] {
234
+ color: var(--kds-color-text-and-icon-success);
235
+ background-color: var(--kds-color-background-static-success);
236
+ border: var(--kds-border-base-success);
237
+ }
238
+ &.error[data-v-5c6c74a8] {
239
+ color: var(--kds-color-text-and-icon-danger);
240
+ background-color: var(--kds-color-background-static-danger);
241
+ border: var(--kds-border-base-danger);
242
+ }
243
+ &.ghost[data-v-5c6c74a8] {
244
+ color: var(--kds-color-text-and-icon-neutral);
245
+ background-color: transparent;
246
+ border: var(--kds-border-base-subtle);
247
+ }
248
+ }
249
+
250
+ .kds-color-swatch {
251
+ &[data-v-bdb3dd24] {
252
+ display: inline-block;
253
+ flex-shrink: 0;
254
+ overflow: hidden;
255
+ line-height: 0;
256
+ border: var(--kds-border-base-muted);
257
+ border-radius: var(--kds-border-radius-container-0-25x);
258
+ }
259
+ &.small[data-v-bdb3dd24] {
260
+ width: var(--kds-dimension-icon-0-75x);
261
+ height: var(--kds-dimension-icon-0-75x);
262
+ }
263
+ &.medium[data-v-bdb3dd24] {
264
+ width: var(--kds-dimension-icon-1x);
265
+ height: var(--kds-dimension-icon-1x);
266
+ }
267
+ &.large[data-v-bdb3dd24] {
268
+ width: var(--kds-dimension-component-width-1-25x);
269
+ height: var(--kds-dimension-component-height-1-25x);
270
+ }
271
+ }
272
+
215
273
  .kds-live-status {
216
274
  &[data-v-4dec8e94] {
217
275
  --dot-color: var(--kds-color-text-and-icon-disabled);