carbon-components-angular 5.57.3 → 5.57.4
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.
- package/contained-list/contained-list.component.d.ts +5 -1
- package/docs/documentation/components/ContainedList.html +49 -15
- package/docs/documentation/coverage.html +3 -3
- package/docs/documentation/js/search/search_index.js +2 -2
- package/docs/documentation/modules/TimePickerSelectModule/dependencies.svg +4 -4
- package/docs/documentation/modules/TimePickerSelectModule.html +4 -4
- package/docs/documentation/modules/ToggleModule/dependencies.svg +6 -6
- package/docs/documentation/modules/ToggleModule.html +6 -6
- package/docs/documentation/modules/ToggletipModule/dependencies.svg +4 -4
- package/docs/documentation/modules/ToggletipModule.html +4 -4
- package/docs/documentation/modules/TooltipModule/dependencies.svg +28 -28
- package/docs/documentation/modules/TooltipModule.html +28 -28
- package/docs/documentation/modules/TreeviewModule/dependencies.svg +37 -37
- package/docs/documentation/modules/TreeviewModule.html +37 -37
- package/docs/documentation/modules/UIShellModule/dependencies.svg +4 -4
- package/docs/documentation/modules/UIShellModule.html +4 -4
- package/docs/documentation.json +133 -123
- package/docs/storybook/contained-list-contained-list-stories.b7913db8.iframe.bundle.js +1 -0
- package/docs/storybook/iframe.html +2 -2
- package/docs/storybook/main.c0bb6f79.iframe.bundle.js +1 -0
- package/docs/storybook/project.json +1 -1
- package/docs/storybook/{runtime~main.9e428f42.iframe.bundle.js → runtime~main.530d4cf0.iframe.bundle.js} +1 -1
- package/esm2020/contained-list/contained-list.component.mjs +6 -4
- package/fesm2015/carbon-components-angular-contained-list.mjs +5 -3
- package/fesm2015/carbon-components-angular-contained-list.mjs.map +1 -1
- package/fesm2020/carbon-components-angular-contained-list.mjs +5 -3
- package/fesm2020/carbon-components-angular-contained-list.mjs.map +1 -1
- package/package.json +1 -1
- package/docs/storybook/contained-list-contained-list-stories.b87addfb.iframe.bundle.js +0 -1
- package/docs/storybook/main.23328ef9.iframe.bundle.js +0 -1
package/docs/documentation.json
CHANGED
|
@@ -25263,7 +25263,7 @@
|
|
|
25263
25263
|
},
|
|
25264
25264
|
{
|
|
25265
25265
|
"name": "ContainedList",
|
|
25266
|
-
"id": "component-ContainedList-
|
|
25266
|
+
"id": "component-ContainedList-207a5131842308ae824ff732bf4685cc678d471181ee6124ab1c65c949594670f38ee9e5277759da3118cca2b1a88763cf73ceb19a3c0b777307a4f45ee52fad",
|
|
25267
25267
|
"file": "src/contained-list/contained-list.component.ts",
|
|
25268
25268
|
"changeDetection": "ChangeDetectionStrategy.OnPush",
|
|
25269
25269
|
"encapsulation": [],
|
|
@@ -25274,7 +25274,7 @@
|
|
|
25274
25274
|
"selector": "cds-contained-list, ibm-contained-list",
|
|
25275
25275
|
"styleUrls": [],
|
|
25276
25276
|
"styles": [],
|
|
25277
|
-
"template": "<div\n\tclass=\"cds--contained-list\"\n\t[ngClass]=\"{\n\t\t'cds--contained-list--inset-rulers': isInset,\n\t\t'cds--contained-list--on-page': kind === ContainedListKind.OnPage,\n\t\t'cds--contained-list--disclosed': kind === ContainedListKind.Disclosed,\n\t\t'cds--contained-list--sm': size === ContainedListSize.Small,\n\t\t'cds--contained-list--md': size === ContainedListSize.Medium,\n\t\t'cds--contained-list--lg': size === ContainedListSize.Large,\n\t\t'cds--contained-list--xl': size === ContainedListSize.ExtraLarge,\n\t\t'cds--layout--size-sm': size === ContainedListSize.Small,\n\t\t'cds--layout--size-md': size === ContainedListSize.Medium,\n\t\t'cds--layout--size-lg': size === ContainedListSize.Large,\n\t\t'cds--layout--size-xl': size === ContainedListSize.ExtraLarge\n\t}\">\n\t<div class=\"cds--contained-list__header\">\n\t\t<div [id]=\"labelId\" class=\"cds--contained-list__label\">\n\t\t\t<ng-container *ngIf=\"!isTemplate(label)\">{{ label }}</ng-container>\n\t\t\t<ng-template *ngIf=\"isTemplate(label)\" [ngTemplateOutlet]=\"label\"></ng-template>\n\t\t</div>\n\n\t\t<div class=\"cds--contained-list__action\" *ngIf=\"action\">\n\t\t\t<ng-template [ngTemplateOutlet]=\"action\"></ng-template>\n\t\t</div>\n\t</div>\n\t<div role=\"list\" [attr.aria-labelledby]=\"labelId\">\n\t\t<ng-content></ng-content>\n\t</div>\n</div>\n\t",
|
|
25277
|
+
"template": "<div\n\tclass=\"cds--contained-list\"\n\t[ngClass]=\"{\n\t\t'cds--contained-list--inset-rulers': isInset,\n\t\t'cds--contained-list--on-page': kind === ContainedListKind.OnPage,\n\t\t'cds--contained-list--disclosed': kind === ContainedListKind.Disclosed,\n\t\t'cds--contained-list--sm': size === ContainedListSize.Small,\n\t\t'cds--contained-list--md': size === ContainedListSize.Medium,\n\t\t'cds--contained-list--lg': size === ContainedListSize.Large,\n\t\t'cds--contained-list--xl': size === ContainedListSize.ExtraLarge,\n\t\t'cds--layout--size-sm': size === ContainedListSize.Small,\n\t\t'cds--layout--size-md': size === ContainedListSize.Medium,\n\t\t'cds--layout--size-lg': size === ContainedListSize.Large,\n\t\t'cds--layout--size-xl': size === ContainedListSize.ExtraLarge\n\t}\">\n\t<div class=\"cds--contained-list__header\">\n\t\t<div [id]=\"labelId\" class=\"cds--contained-list__label\">\n\t\t\t<ng-container *ngIf=\"!isTemplate(label)\">{{ label }}</ng-container>\n\t\t\t<ng-template *ngIf=\"isTemplate(label)\" [ngTemplateOutlet]=\"label\"></ng-template>\n\t\t</div>\n\n\t\t<div class=\"cds--contained-list__action\" *ngIf=\"action\">\n\t\t\t<ng-template [ngTemplateOutlet]=\"action\" [ngTemplateOutletContext]=\"{ $implicit: actionData }\"></ng-template>\n\t\t</div>\n\t</div>\n\t<div role=\"list\" [attr.aria-labelledby]=\"labelId\">\n\t\t<ng-content></ng-content>\n\t</div>\n</div>\n\t",
|
|
25278
25278
|
"templateUrl": [],
|
|
25279
25279
|
"viewProviders": [],
|
|
25280
25280
|
"hostDirectives": [],
|
|
@@ -25285,10 +25285,20 @@
|
|
|
25285
25285
|
"deprecationMessage": "",
|
|
25286
25286
|
"rawdescription": "\n\nA slot for a possible interactive element to render within the list header.\n",
|
|
25287
25287
|
"description": "<p>A slot for a possible interactive element to render within the list header.</p>\n",
|
|
25288
|
-
"line":
|
|
25288
|
+
"line": 60,
|
|
25289
25289
|
"type": "TemplateRef<any>",
|
|
25290
25290
|
"decorators": []
|
|
25291
25291
|
},
|
|
25292
|
+
{
|
|
25293
|
+
"name": "actionData",
|
|
25294
|
+
"deprecated": false,
|
|
25295
|
+
"deprecationMessage": "",
|
|
25296
|
+
"rawdescription": "\n\nOptional interactive element data.\n",
|
|
25297
|
+
"description": "<p>Optional interactive element data.</p>\n",
|
|
25298
|
+
"line": 65,
|
|
25299
|
+
"type": "any",
|
|
25300
|
+
"decorators": []
|
|
25301
|
+
},
|
|
25292
25302
|
{
|
|
25293
25303
|
"name": "isInset",
|
|
25294
25304
|
"defaultValue": "false",
|
|
@@ -25296,7 +25306,7 @@
|
|
|
25296
25306
|
"deprecationMessage": "",
|
|
25297
25307
|
"rawdescription": "\n\nSpecify whether the dividing lines in between list items should be inset.\n",
|
|
25298
25308
|
"description": "<p>Specify whether the dividing lines in between list items should be inset.</p>\n",
|
|
25299
|
-
"line":
|
|
25309
|
+
"line": 70,
|
|
25300
25310
|
"type": "boolean",
|
|
25301
25311
|
"decorators": []
|
|
25302
25312
|
},
|
|
@@ -25307,7 +25317,7 @@
|
|
|
25307
25317
|
"deprecationMessage": "",
|
|
25308
25318
|
"rawdescription": "\n\nThe kind of ContainedList you want to display.\n",
|
|
25309
25319
|
"description": "<p>The kind of ContainedList you want to display.</p>\n",
|
|
25310
|
-
"line":
|
|
25320
|
+
"line": 75,
|
|
25311
25321
|
"type": "ContainedListKind",
|
|
25312
25322
|
"decorators": []
|
|
25313
25323
|
},
|
|
@@ -25317,7 +25327,7 @@
|
|
|
25317
25327
|
"deprecationMessage": "",
|
|
25318
25328
|
"rawdescription": "\n\nA label describing the contained list.\n",
|
|
25319
25329
|
"description": "<p>A label describing the contained list.</p>\n",
|
|
25320
|
-
"line":
|
|
25330
|
+
"line": 80,
|
|
25321
25331
|
"type": "string | TemplateRef<any>",
|
|
25322
25332
|
"decorators": []
|
|
25323
25333
|
},
|
|
@@ -25328,7 +25338,7 @@
|
|
|
25328
25338
|
"deprecationMessage": "",
|
|
25329
25339
|
"rawdescription": "\n\nLabel id for the contained list.\n",
|
|
25330
25340
|
"description": "<p>Label id for the contained list.</p>\n",
|
|
25331
|
-
"line":
|
|
25341
|
+
"line": 90,
|
|
25332
25342
|
"type": "string",
|
|
25333
25343
|
"decorators": []
|
|
25334
25344
|
},
|
|
@@ -25339,7 +25349,7 @@
|
|
|
25339
25349
|
"deprecationMessage": "",
|
|
25340
25350
|
"rawdescription": "\n\nSpecify the size of the contained list.\n",
|
|
25341
25351
|
"description": "<p>Specify the size of the contained list.</p>\n",
|
|
25342
|
-
"line":
|
|
25352
|
+
"line": 85,
|
|
25343
25353
|
"type": "ContainedListSize",
|
|
25344
25354
|
"decorators": []
|
|
25345
25355
|
}
|
|
@@ -25354,7 +25364,7 @@
|
|
|
25354
25364
|
"type": "",
|
|
25355
25365
|
"optional": false,
|
|
25356
25366
|
"description": "<p>Exposing ContainedListKind enum to the template</p>\n",
|
|
25357
|
-
"line":
|
|
25367
|
+
"line": 100,
|
|
25358
25368
|
"rawdescription": "\n\nExposing ContainedListKind enum to the template\n",
|
|
25359
25369
|
"modifierKind": [
|
|
25360
25370
|
125
|
|
@@ -25368,7 +25378,7 @@
|
|
|
25368
25378
|
"type": "",
|
|
25369
25379
|
"optional": false,
|
|
25370
25380
|
"description": "<p>Exposing ContainedListSize enum to the template</p>\n",
|
|
25371
|
-
"line":
|
|
25381
|
+
"line": 95,
|
|
25372
25382
|
"rawdescription": "\n\nExposing ContainedListSize enum to the template\n",
|
|
25373
25383
|
"modifierKind": [
|
|
25374
25384
|
125
|
|
@@ -25389,7 +25399,7 @@
|
|
|
25389
25399
|
"optional": false,
|
|
25390
25400
|
"returnType": "boolean",
|
|
25391
25401
|
"typeParameters": [],
|
|
25392
|
-
"line":
|
|
25402
|
+
"line": 102,
|
|
25393
25403
|
"deprecated": false,
|
|
25394
25404
|
"deprecationMessage": "",
|
|
25395
25405
|
"modifierKind": [
|
|
@@ -25417,7 +25427,7 @@
|
|
|
25417
25427
|
"description": "<p>Get started with importing the module:</p>\n<b>Example :</b><div><pre class=\"line-numbers\"><code class=\"language-typescript\">import { ContainedListModule } from 'carbon-components-angular';</code></pre></div><p><a href=\"../../?path=/story/components-contained-list--basic\">See demo</a></p>\n",
|
|
25418
25428
|
"rawdescription": "\n\nGet started with importing the module:\n\n```typescript\nimport { ContainedListModule } from 'carbon-components-angular';\n```\n\n[See demo](../../?path=/story/components-contained-list--basic)\n",
|
|
25419
25429
|
"type": "component",
|
|
25420
|
-
"sourceCode": "import {\n\tChangeDetectionStrategy,\n\tComponent,\n\
|
|
25430
|
+
"sourceCode": "import {\n\tChangeDetectionStrategy,\n\tComponent,\n\tInput,\n\tTemplateRef\n} from \"@angular/core\";\nimport { ContainedListKind, ContainedListSize } from \"./contained-list.enums\";\n\n/**\n * Get started with importing the module:\n *\n * ```typescript\n * import { ContainedListModule } from 'carbon-components-angular';\n * ```\n *\n * [See demo](../../?path=/story/components-contained-list--basic)\n */\n@Component({\n\tselector: \"cds-contained-list, ibm-contained-list\",\n\ttemplate: `\n\t\t<div\n\t\t\tclass=\"cds--contained-list\"\n\t\t\t[ngClass]=\"{\n\t\t\t\t'cds--contained-list--inset-rulers': isInset,\n\t\t\t\t'cds--contained-list--on-page': kind === ContainedListKind.OnPage,\n\t\t\t\t'cds--contained-list--disclosed': kind === ContainedListKind.Disclosed,\n\t\t\t\t'cds--contained-list--sm': size === ContainedListSize.Small,\n\t\t\t\t'cds--contained-list--md': size === ContainedListSize.Medium,\n\t\t\t\t'cds--contained-list--lg': size === ContainedListSize.Large,\n\t\t\t\t'cds--contained-list--xl': size === ContainedListSize.ExtraLarge,\n\t\t\t\t'cds--layout--size-sm': size === ContainedListSize.Small,\n\t\t\t\t'cds--layout--size-md': size === ContainedListSize.Medium,\n\t\t\t\t'cds--layout--size-lg': size === ContainedListSize.Large,\n\t\t\t\t'cds--layout--size-xl': size === ContainedListSize.ExtraLarge\n\t\t\t}\">\n\t\t\t<div class=\"cds--contained-list__header\">\n\t\t\t\t<div [id]=\"labelId\" class=\"cds--contained-list__label\">\n\t\t\t\t\t<ng-container *ngIf=\"!isTemplate(label)\">{{ label }}</ng-container>\n\t\t\t\t\t<ng-template *ngIf=\"isTemplate(label)\" [ngTemplateOutlet]=\"label\"></ng-template>\n\t\t\t\t</div>\n\n\t\t\t\t<div class=\"cds--contained-list__action\" *ngIf=\"action\">\n\t\t\t\t\t<ng-template [ngTemplateOutlet]=\"action\" [ngTemplateOutletContext]=\"{ $implicit: actionData }\"></ng-template>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t\t<div role=\"list\" [attr.aria-labelledby]=\"labelId\">\n\t\t\t\t<ng-content></ng-content>\n\t\t\t</div>\n\t\t</div>\n\t`,\n\tchangeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class ContainedList {\n\t/** Used to generate unique IDs */\n\tprivate static count = 0;\n\n\t/**\n\t * A slot for a possible interactive element to render within the list header.\n\t */\n\t@Input() action: TemplateRef<any>;\n\n\t/**\n\t * Optional interactive element data.\n\t */\n\t@Input() actionData: any;\n\n\t/**\n\t * Specify whether the dividing lines in between list items should be inset.\n\t */\n\t@Input() isInset = false;\n\n\t/**\n\t * The kind of ContainedList you want to display.\n\t */\n\t@Input() kind: ContainedListKind = ContainedListKind.OnPage;\n\n\t/**\n\t * A label describing the contained list.\n\t */\n\t@Input() label: string | TemplateRef<any>;\n\n\t/**\n\t * Specify the size of the contained list.\n\t */\n\t@Input() size: ContainedListSize = ContainedListSize.Large;\n\n\t/**\n\t * Label id for the contained list.\n\t */\n\t@Input() labelId = `contained-list-${ContainedList.count++}-header`;\n\n\t/**\n\t * Exposing ContainedListSize enum to the template\n\t */\n\tpublic ContainedListSize: typeof ContainedListSize = ContainedListSize;\n\n\t/**\n\t * Exposing ContainedListKind enum to the template\n\t */\n\tpublic ContainedListKind: typeof ContainedListKind = ContainedListKind;\n\n\tpublic isTemplate(value: string | TemplateRef<any>) {\n\t\treturn value instanceof TemplateRef;\n\t}\n}\n",
|
|
25421
25431
|
"assetsDirs": [],
|
|
25422
25432
|
"styleUrlsData": "",
|
|
25423
25433
|
"stylesData": "",
|
|
@@ -74846,7 +74856,7 @@
|
|
|
74846
74856
|
"name": "Basic",
|
|
74847
74857
|
"ctype": "miscellaneous",
|
|
74848
74858
|
"subtype": "variable",
|
|
74849
|
-
"file": "src/
|
|
74859
|
+
"file": "src/breadcrumb/breadcrumb.stories.ts",
|
|
74850
74860
|
"deprecated": false,
|
|
74851
74861
|
"deprecationMessage": "",
|
|
74852
74862
|
"type": "",
|
|
@@ -74856,7 +74866,7 @@
|
|
|
74856
74866
|
"name": "Basic",
|
|
74857
74867
|
"ctype": "miscellaneous",
|
|
74858
74868
|
"subtype": "variable",
|
|
74859
|
-
"file": "src/button/button.stories.ts",
|
|
74869
|
+
"file": "src/button/button-set.stories.ts",
|
|
74860
74870
|
"deprecated": false,
|
|
74861
74871
|
"deprecationMessage": "",
|
|
74862
74872
|
"type": "",
|
|
@@ -74866,7 +74876,7 @@
|
|
|
74866
74876
|
"name": "Basic",
|
|
74867
74877
|
"ctype": "miscellaneous",
|
|
74868
74878
|
"subtype": "variable",
|
|
74869
|
-
"file": "src/button/
|
|
74879
|
+
"file": "src/button/button.stories.ts",
|
|
74870
74880
|
"deprecated": false,
|
|
74871
74881
|
"deprecationMessage": "",
|
|
74872
74882
|
"type": "",
|
|
@@ -74876,7 +74886,7 @@
|
|
|
74876
74886
|
"name": "Basic",
|
|
74877
74887
|
"ctype": "miscellaneous",
|
|
74878
74888
|
"subtype": "variable",
|
|
74879
|
-
"file": "src/
|
|
74889
|
+
"file": "src/button/icon-button.stories.ts",
|
|
74880
74890
|
"deprecated": false,
|
|
74881
74891
|
"deprecationMessage": "",
|
|
74882
74892
|
"type": "",
|
|
@@ -75256,7 +75266,7 @@
|
|
|
75256
75266
|
"name": "Basic",
|
|
75257
75267
|
"ctype": "miscellaneous",
|
|
75258
75268
|
"subtype": "variable",
|
|
75259
|
-
"file": "src/
|
|
75269
|
+
"file": "src/theme/theme.stories.ts",
|
|
75260
75270
|
"deprecated": false,
|
|
75261
75271
|
"deprecationMessage": "",
|
|
75262
75272
|
"type": "",
|
|
@@ -75266,7 +75276,7 @@
|
|
|
75266
75276
|
"name": "Basic",
|
|
75267
75277
|
"ctype": "miscellaneous",
|
|
75268
75278
|
"subtype": "variable",
|
|
75269
|
-
"file": "src/
|
|
75279
|
+
"file": "src/tag/tag.stories.ts",
|
|
75270
75280
|
"deprecated": false,
|
|
75271
75281
|
"deprecationMessage": "",
|
|
75272
75282
|
"type": "",
|
|
@@ -77708,41 +77718,41 @@
|
|
|
77708
77718
|
"name": "Template",
|
|
77709
77719
|
"ctype": "miscellaneous",
|
|
77710
77720
|
"subtype": "variable",
|
|
77711
|
-
"file": "src/
|
|
77721
|
+
"file": "src/breadcrumb/breadcrumb.stories.ts",
|
|
77712
77722
|
"deprecated": false,
|
|
77713
77723
|
"deprecationMessage": "",
|
|
77714
77724
|
"type": "",
|
|
77715
|
-
"defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-
|
|
77725
|
+
"defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-breadcrumb [noTrailingSlash]=\"noTrailingSlash\">\n\t\t\t<cds-breadcrumb-item href=\"#1\">\n\t\t\t\tBreadcrumb 1\n\t\t\t</cds-breadcrumb-item>\n\t\t\t<cds-breadcrumb-item href=\"#2\">\n\t\t\t\tBreadcrumb 2\n\t\t\t</cds-breadcrumb-item>\n\t\t\t<cds-breadcrumb-item href=\"#3\">\n\t\t\t\tBreadcrumb 3\n\t\t\t</cds-breadcrumb-item>\n\t\t</cds-breadcrumb>\n\t`\n})"
|
|
77716
77726
|
},
|
|
77717
77727
|
{
|
|
77718
77728
|
"name": "Template",
|
|
77719
77729
|
"ctype": "miscellaneous",
|
|
77720
77730
|
"subtype": "variable",
|
|
77721
|
-
"file": "src/button/button.stories.ts",
|
|
77731
|
+
"file": "src/button/button-set.stories.ts",
|
|
77722
77732
|
"deprecated": false,
|
|
77723
77733
|
"deprecationMessage": "",
|
|
77724
77734
|
"type": "",
|
|
77725
|
-
"defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<button
|
|
77735
|
+
"defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-button-set>\n\t\t\t<button cdsButton=\"secondary\" [size]=\"size\" [isExpressive]=\"isExpressive\">Button</button>\n\t\t\t<button cdsButton [size]=\"size\" [isExpressive]=\"isExpressive\">Button</button>\n\t\t</cds-button-set>\n\t`\n})"
|
|
77726
77736
|
},
|
|
77727
77737
|
{
|
|
77728
77738
|
"name": "Template",
|
|
77729
77739
|
"ctype": "miscellaneous",
|
|
77730
77740
|
"subtype": "variable",
|
|
77731
|
-
"file": "src/button/
|
|
77741
|
+
"file": "src/button/button.stories.ts",
|
|
77732
77742
|
"deprecated": false,
|
|
77733
77743
|
"deprecationMessage": "",
|
|
77734
77744
|
"type": "",
|
|
77735
|
-
"defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<
|
|
77745
|
+
"defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<button\n\t\t\t[cdsButton]=\"kind\"\n\t\t\t[size]=\"size\"\n\t\t\t[isExpressive]=\"isExpressive\"\n\t\t\t[disabled]=\"disabled\"\n\t\t\t(click)=\"onClick($event)\"\n\t\t\t(mouseenter)=\"onMouseEnter($event)\"\n\t\t\t(mouseleave)=\"onMouseLeave($event)\"\n\t\t\t(focus)=\"onFocus($event)\"\n\t\t\t(blur)=\"onBlur($event)\">\n\t\t\tButton\n\t\t</button>\n\t`\n})"
|
|
77736
77746
|
},
|
|
77737
77747
|
{
|
|
77738
77748
|
"name": "Template",
|
|
77739
77749
|
"ctype": "miscellaneous",
|
|
77740
77750
|
"subtype": "variable",
|
|
77741
|
-
"file": "src/
|
|
77751
|
+
"file": "src/button/icon-button.stories.ts",
|
|
77742
77752
|
"deprecated": false,
|
|
77743
77753
|
"deprecationMessage": "",
|
|
77744
77754
|
"type": "",
|
|
77745
|
-
"defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-
|
|
77755
|
+
"defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-icon-button\n\t\t\tbuttonId=\"icon-btn1\"\n\t\t\ttype=\"button\"\n\t\t\t[kind]=\"kind\"\n\t\t\t[size]=\"size\"\n\t\t\t[align]=\"align\"\n\t\t\t[buttonNgClass]=\"buttonNgClass\"\n\t\t\t[buttonAttributes]=\"buttonAttributes\"\n\t\t\t[disabled]=\"disabled\"\n\t\t\t[showTooltipWhenDisabled]=\"showTooltipWhenDisabled\"\n\t\t\tdescription=\"Icon Description\"\n\t\t\t(click)=\"onClick($event)\"\n\t\t\t(mouseenter)=\"onMouseEnter($event)\"\n\t\t\t(mouseleave)=\"onMouseLeave($event)\"\n\t\t\t(focus)=\"onFocus($event)\"\n\t\t\t(blur)=\"onBlur($event)\">\n\t\t\t<svg class=\"cds--btn__icon\" cdsIcon=\"copy\" size=\"16\"></svg>\n\t\t</cds-icon-button>\n\t`\n})"
|
|
77746
77756
|
},
|
|
77747
77757
|
{
|
|
77748
77758
|
"name": "Template",
|
|
@@ -78118,21 +78128,21 @@
|
|
|
78118
78128
|
"name": "Template",
|
|
78119
78129
|
"ctype": "miscellaneous",
|
|
78120
78130
|
"subtype": "variable",
|
|
78121
|
-
"file": "src/
|
|
78131
|
+
"file": "src/theme/theme.stories.ts",
|
|
78122
78132
|
"deprecated": false,
|
|
78123
78133
|
"deprecationMessage": "",
|
|
78124
78134
|
"type": "",
|
|
78125
|
-
"defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<
|
|
78135
|
+
"defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<div cdsTheme>\n\t\t\t<div class=\"theme-section\">\n\t\t\t\t<p>White theme</p>\n\t\t\t</div>\n\t\t</div>\n\t\t<div cdsTheme=\"g10\">\n\t\t\t<div class=\"theme-section\">\n\t\t\t\t<p>G10 theme</p>\n\t\t\t</div>\n\t\t</div>\n\t\t<div cdsTheme=\"g90\">\n\t\t\t<div class=\"theme-section\">\n\t\t\t\t<p>G90 theme</p>\n\t\t\t</div>\n\t\t</div>\n\t\t<div cdsTheme=\"g100\">\n\t\t\t<div class=\"theme-section\">\n\t\t\t\t<p>G100 theme</p>\n\t\t\t</div>\n\t\t</div>\n\t`,\n\tstyles: [`\n\t\t.theme-section {\n\t\t\tpadding: 1rem;\n\t\t\tbackground: var(--cds-background);\n\t\t\tcolor: var(--cds-text-primary);\n\t\t}\n\t`]\n})"
|
|
78126
78136
|
},
|
|
78127
78137
|
{
|
|
78128
78138
|
"name": "Template",
|
|
78129
78139
|
"ctype": "miscellaneous",
|
|
78130
78140
|
"subtype": "variable",
|
|
78131
|
-
"file": "src/
|
|
78141
|
+
"file": "src/tag/tag.stories.ts",
|
|
78132
78142
|
"deprecated": false,
|
|
78133
78143
|
"deprecationMessage": "",
|
|
78134
78144
|
"type": "",
|
|
78135
|
-
"defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<
|
|
78145
|
+
"defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-tag\n\t\t\t[type]=\"type\"\n\t\t\t[skeleton]=\"skeleton\"\n\t\t\t[size]=\"size\">\n\t\t\t<div cdsTagIcon>\n\t\t\t\t<svg ibmIcon=\"settings\" size=\"16\"></svg>\n\t\t\t</div>\n\t\t\tRead only\n\t\t</cds-tag>\n\t`\n})"
|
|
78136
78146
|
},
|
|
78137
78147
|
{
|
|
78138
78148
|
"name": "Template",
|
|
@@ -81560,199 +81570,199 @@
|
|
|
81560
81570
|
"defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<div style=\"width: 500px\">\n\t\t\t<cds-accordion>\n\t\t\t\t<cds-accordion-item [title]=\"title\" (selected)=\"selected($event)\">\n\t\t\t\t\tLorem ipsum dolor sit amet, \\\n\t\t\t\t\tconsectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore \\\n\t\t\t\t\tet dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation \\\n\t\t\t\t\tullamco laboris nisi ut aliquip ex ea commodo consequat.\n\t\t\t\t</cds-accordion-item>\n\t\t\t\t<cds-accordion-item [title]=\"titleWithContext\" [context]=\"{ index: 2 }\" (selected)=\"selected($event)\">\n\t\t\t\t\tLorem ipsum dolor sit amet, \\\n\t\t\t\t\tconsectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore \\\n\t\t\t\t\tet dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation \\\n\t\t\t\t\tullamco laboris nisi ut aliquip ex ea commodo consequat.\n\t\t\t\t</cds-accordion-item>\n\t\t\t</cds-accordion>\n\t\t</div>\n\t\t<ng-template #title>\n\t\t\t<p class=\"cds--accordion__title\">Section 1 title</p>\n\t\t</ng-template>\n\t\t<ng-template #titleWithContext let-index=\"index\">\n\t\t\t<p class=\"cds--accordion__title\">Section {{ index }} title</p>\n\t\t</ng-template>\n\t`\n})"
|
|
81561
81571
|
}
|
|
81562
81572
|
],
|
|
81563
|
-
"src/
|
|
81573
|
+
"src/breadcrumb/breadcrumb.stories.ts": [
|
|
81564
81574
|
{
|
|
81565
81575
|
"name": "Basic",
|
|
81566
81576
|
"ctype": "miscellaneous",
|
|
81567
81577
|
"subtype": "variable",
|
|
81568
|
-
"file": "src/
|
|
81578
|
+
"file": "src/breadcrumb/breadcrumb.stories.ts",
|
|
81569
81579
|
"deprecated": false,
|
|
81570
81580
|
"deprecationMessage": "",
|
|
81571
81581
|
"type": "",
|
|
81572
81582
|
"defaultValue": "Template.bind({})"
|
|
81573
81583
|
},
|
|
81574
81584
|
{
|
|
81575
|
-
"name": "
|
|
81585
|
+
"name": "breadcrumbItems",
|
|
81576
81586
|
"ctype": "miscellaneous",
|
|
81577
81587
|
"subtype": "variable",
|
|
81578
|
-
"file": "src/
|
|
81588
|
+
"file": "src/breadcrumb/breadcrumb.stories.ts",
|
|
81579
81589
|
"deprecated": false,
|
|
81580
81590
|
"deprecationMessage": "",
|
|
81581
|
-
"type": ""
|
|
81582
|
-
|
|
81583
|
-
}
|
|
81584
|
-
],
|
|
81585
|
-
"src/button/button.stories.ts": [
|
|
81591
|
+
"type": ""
|
|
81592
|
+
},
|
|
81586
81593
|
{
|
|
81587
|
-
"name": "
|
|
81594
|
+
"name": "createBreadcrumbItems",
|
|
81588
81595
|
"ctype": "miscellaneous",
|
|
81589
81596
|
"subtype": "variable",
|
|
81590
|
-
"file": "src/
|
|
81597
|
+
"file": "src/breadcrumb/breadcrumb.stories.ts",
|
|
81591
81598
|
"deprecated": false,
|
|
81592
81599
|
"deprecationMessage": "",
|
|
81593
81600
|
"type": "",
|
|
81594
|
-
"defaultValue": "
|
|
81601
|
+
"defaultValue": "(count: number, content = \"Breadcrumb\"): Array<BreadcrumbItem> => {\n\tif (breadcrumbItems && count === breadcrumbItems.length) {\n\t\treturn breadcrumbItems;\n\t}\n\tbreadcrumbItems = Array(count).fill(0).map((x, i) => ({\n\t\tcontent: `${content} ${i + 1}`,\n\t\thref: \"#\" + (i + 1)\n\t}));\n\treturn breadcrumbItems;\n}"
|
|
81595
81602
|
},
|
|
81596
81603
|
{
|
|
81597
|
-
"name": "
|
|
81604
|
+
"name": "CurrentPage",
|
|
81598
81605
|
"ctype": "miscellaneous",
|
|
81599
81606
|
"subtype": "variable",
|
|
81600
|
-
"file": "src/
|
|
81607
|
+
"file": "src/breadcrumb/breadcrumb.stories.ts",
|
|
81601
81608
|
"deprecated": false,
|
|
81602
81609
|
"deprecationMessage": "",
|
|
81603
81610
|
"type": "",
|
|
81604
|
-
"defaultValue": "(
|
|
81611
|
+
"defaultValue": "CurrentPageTemplate.bind({})"
|
|
81605
81612
|
},
|
|
81606
81613
|
{
|
|
81607
|
-
"name": "
|
|
81614
|
+
"name": "CurrentPageTemplate",
|
|
81608
81615
|
"ctype": "miscellaneous",
|
|
81609
81616
|
"subtype": "variable",
|
|
81610
|
-
"file": "src/
|
|
81617
|
+
"file": "src/breadcrumb/breadcrumb.stories.ts",
|
|
81611
81618
|
"deprecated": false,
|
|
81612
81619
|
"deprecationMessage": "",
|
|
81613
81620
|
"type": "",
|
|
81614
|
-
"defaultValue": "
|
|
81621
|
+
"defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-breadcrumb>\n\t\t\t<cds-breadcrumb-item href=\"#1\">\n\t\t\t\tBreadcrumb 1\n\t\t\t</cds-breadcrumb-item>\n\t\t\t<cds-breadcrumb-item href=\"#2\">\n\t\t\t\tBreadcrumb 2\n\t\t\t</cds-breadcrumb-item>\n\t\t\t<cds-breadcrumb-item current=\"true\" href=\"#3\">\n\t\t\t\tBreadcrumb 3\n\t\t\t</cds-breadcrumb-item>\n\t\t</cds-breadcrumb>\n\t`\n})"
|
|
81615
81622
|
},
|
|
81616
81623
|
{
|
|
81617
|
-
"name": "
|
|
81624
|
+
"name": "Model",
|
|
81618
81625
|
"ctype": "miscellaneous",
|
|
81619
81626
|
"subtype": "variable",
|
|
81620
|
-
"file": "src/
|
|
81627
|
+
"file": "src/breadcrumb/breadcrumb.stories.ts",
|
|
81621
81628
|
"deprecated": false,
|
|
81622
81629
|
"deprecationMessage": "",
|
|
81623
81630
|
"type": "",
|
|
81624
|
-
"defaultValue": "(
|
|
81625
|
-
}
|
|
81626
|
-
],
|
|
81627
|
-
"src/breadcrumb/breadcrumb.stories.ts": [
|
|
81631
|
+
"defaultValue": "ModelTemplate.bind({})"
|
|
81632
|
+
},
|
|
81628
81633
|
{
|
|
81629
|
-
"name": "
|
|
81634
|
+
"name": "ModelTemplate",
|
|
81630
81635
|
"ctype": "miscellaneous",
|
|
81631
81636
|
"subtype": "variable",
|
|
81632
81637
|
"file": "src/breadcrumb/breadcrumb.stories.ts",
|
|
81633
81638
|
"deprecated": false,
|
|
81634
81639
|
"deprecationMessage": "",
|
|
81635
81640
|
"type": "",
|
|
81636
|
-
"defaultValue": "
|
|
81641
|
+
"defaultValue": "(args) => ({\n\tprops: {\n\t\t...args,\n\t\tcreateBreadcrumbItems\n\t},\n\ttemplate: `\n\t\t<cds-breadcrumb\n\t\t\t[noTrailingSlash]=\"noTrailingSlash\"\n\t\t\t[threshold]=\"threshold\"\n\t\t\t[items]=\"createBreadcrumbItems(itemCount, content)\">\n\t\t</cds-breadcrumb>\n\t`\n})"
|
|
81637
81642
|
},
|
|
81638
81643
|
{
|
|
81639
|
-
"name": "
|
|
81644
|
+
"name": "ModelWithTemplate",
|
|
81640
81645
|
"ctype": "miscellaneous",
|
|
81641
81646
|
"subtype": "variable",
|
|
81642
81647
|
"file": "src/breadcrumb/breadcrumb.stories.ts",
|
|
81643
81648
|
"deprecated": false,
|
|
81644
81649
|
"deprecationMessage": "",
|
|
81645
|
-
"type": ""
|
|
81650
|
+
"type": "",
|
|
81651
|
+
"defaultValue": "ModelWTemplate.bind({})"
|
|
81646
81652
|
},
|
|
81647
81653
|
{
|
|
81648
|
-
"name": "
|
|
81654
|
+
"name": "ModelWTemplate",
|
|
81649
81655
|
"ctype": "miscellaneous",
|
|
81650
81656
|
"subtype": "variable",
|
|
81651
81657
|
"file": "src/breadcrumb/breadcrumb.stories.ts",
|
|
81652
81658
|
"deprecated": false,
|
|
81653
81659
|
"deprecationMessage": "",
|
|
81654
81660
|
"type": "",
|
|
81655
|
-
"defaultValue": "(
|
|
81661
|
+
"defaultValue": "(args) => ({\n\tprops: {\n\t\t...args,\n\t\tcreateBreadcrumbItems,\n\t\twithTemplate\n\t},\n\ttemplate: `\n\t\t<ng-template #breadcrumbTemplate let-item>\n\t\t\t{{ templateContent }}{{ item.content }}\n\t\t</ng-template>\n\t\t<cds-breadcrumb\n\t\t\t[noTrailingSlash]=\"noTrailingSlash\"\n\t\t\t[threshold]=\"threshold\"\n\t\t\t[items]=\"withTemplate(breadcrumbTemplate, createBreadcrumbItems(itemCount, content))\">\n\t\t</cds-breadcrumb>\n\t`\n})"
|
|
81656
81662
|
},
|
|
81657
81663
|
{
|
|
81658
|
-
"name": "
|
|
81664
|
+
"name": "Skeleton",
|
|
81659
81665
|
"ctype": "miscellaneous",
|
|
81660
81666
|
"subtype": "variable",
|
|
81661
81667
|
"file": "src/breadcrumb/breadcrumb.stories.ts",
|
|
81662
81668
|
"deprecated": false,
|
|
81663
81669
|
"deprecationMessage": "",
|
|
81664
81670
|
"type": "",
|
|
81665
|
-
"defaultValue": "
|
|
81671
|
+
"defaultValue": "WithSkeleton.bind({})"
|
|
81666
81672
|
},
|
|
81667
81673
|
{
|
|
81668
|
-
"name": "
|
|
81674
|
+
"name": "Template",
|
|
81669
81675
|
"ctype": "miscellaneous",
|
|
81670
81676
|
"subtype": "variable",
|
|
81671
81677
|
"file": "src/breadcrumb/breadcrumb.stories.ts",
|
|
81672
81678
|
"deprecated": false,
|
|
81673
81679
|
"deprecationMessage": "",
|
|
81674
81680
|
"type": "",
|
|
81675
|
-
"defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-breadcrumb>\n\t\t\t<cds-breadcrumb-item href=\"#1\">\n\t\t\t\tBreadcrumb 1\n\t\t\t</cds-breadcrumb-item>\n\t\t\t<cds-breadcrumb-item href=\"#2\">\n\t\t\t\tBreadcrumb 2\n\t\t\t</cds-breadcrumb-item>\n\t\t\t<cds-breadcrumb-item
|
|
81681
|
+
"defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-breadcrumb [noTrailingSlash]=\"noTrailingSlash\">\n\t\t\t<cds-breadcrumb-item href=\"#1\">\n\t\t\t\tBreadcrumb 1\n\t\t\t</cds-breadcrumb-item>\n\t\t\t<cds-breadcrumb-item href=\"#2\">\n\t\t\t\tBreadcrumb 2\n\t\t\t</cds-breadcrumb-item>\n\t\t\t<cds-breadcrumb-item href=\"#3\">\n\t\t\t\tBreadcrumb 3\n\t\t\t</cds-breadcrumb-item>\n\t\t</cds-breadcrumb>\n\t`\n})"
|
|
81676
81682
|
},
|
|
81677
81683
|
{
|
|
81678
|
-
"name": "
|
|
81684
|
+
"name": "WithSkeleton",
|
|
81679
81685
|
"ctype": "miscellaneous",
|
|
81680
81686
|
"subtype": "variable",
|
|
81681
81687
|
"file": "src/breadcrumb/breadcrumb.stories.ts",
|
|
81682
81688
|
"deprecated": false,
|
|
81683
81689
|
"deprecationMessage": "",
|
|
81684
81690
|
"type": "",
|
|
81685
|
-
"defaultValue": "
|
|
81691
|
+
"defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-breadcrumb skeleton=\"true\" [noTrailingSlash]=\"noTrailingSlash\">\n\t\t\t<cds-breadcrumb-item></cds-breadcrumb-item>\n\t\t\t<cds-breadcrumb-item></cds-breadcrumb-item>\n\t\t\t<cds-breadcrumb-item></cds-breadcrumb-item>\n\t\t\t<cds-breadcrumb-item></cds-breadcrumb-item>\n\t\t</cds-breadcrumb>\n\t`\n})"
|
|
81686
81692
|
},
|
|
81687
81693
|
{
|
|
81688
|
-
"name": "
|
|
81694
|
+
"name": "withTemplate",
|
|
81689
81695
|
"ctype": "miscellaneous",
|
|
81690
81696
|
"subtype": "variable",
|
|
81691
81697
|
"file": "src/breadcrumb/breadcrumb.stories.ts",
|
|
81692
81698
|
"deprecated": false,
|
|
81693
81699
|
"deprecationMessage": "",
|
|
81694
81700
|
"type": "",
|
|
81695
|
-
"defaultValue": "(
|
|
81696
|
-
}
|
|
81701
|
+
"defaultValue": "(templateRef, items) => items.map(item => Object.assign(item, { template: templateRef }))"
|
|
81702
|
+
}
|
|
81703
|
+
],
|
|
81704
|
+
"src/button/button-set.stories.ts": [
|
|
81697
81705
|
{
|
|
81698
|
-
"name": "
|
|
81706
|
+
"name": "Basic",
|
|
81699
81707
|
"ctype": "miscellaneous",
|
|
81700
81708
|
"subtype": "variable",
|
|
81701
|
-
"file": "src/
|
|
81709
|
+
"file": "src/button/button-set.stories.ts",
|
|
81702
81710
|
"deprecated": false,
|
|
81703
81711
|
"deprecationMessage": "",
|
|
81704
81712
|
"type": "",
|
|
81705
|
-
"defaultValue": "
|
|
81713
|
+
"defaultValue": "Template.bind({})"
|
|
81706
81714
|
},
|
|
81707
81715
|
{
|
|
81708
|
-
"name": "
|
|
81716
|
+
"name": "Template",
|
|
81709
81717
|
"ctype": "miscellaneous",
|
|
81710
81718
|
"subtype": "variable",
|
|
81711
|
-
"file": "src/
|
|
81719
|
+
"file": "src/button/button-set.stories.ts",
|
|
81712
81720
|
"deprecated": false,
|
|
81713
81721
|
"deprecationMessage": "",
|
|
81714
81722
|
"type": "",
|
|
81715
|
-
"defaultValue": "(args) => ({\n\tprops:
|
|
81716
|
-
}
|
|
81723
|
+
"defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-button-set>\n\t\t\t<button cdsButton=\"secondary\" [size]=\"size\" [isExpressive]=\"isExpressive\">Button</button>\n\t\t\t<button cdsButton [size]=\"size\" [isExpressive]=\"isExpressive\">Button</button>\n\t\t</cds-button-set>\n\t`\n})"
|
|
81724
|
+
}
|
|
81725
|
+
],
|
|
81726
|
+
"src/button/button.stories.ts": [
|
|
81717
81727
|
{
|
|
81718
|
-
"name": "
|
|
81728
|
+
"name": "Basic",
|
|
81719
81729
|
"ctype": "miscellaneous",
|
|
81720
81730
|
"subtype": "variable",
|
|
81721
|
-
"file": "src/
|
|
81731
|
+
"file": "src/button/button.stories.ts",
|
|
81722
81732
|
"deprecated": false,
|
|
81723
81733
|
"deprecationMessage": "",
|
|
81724
81734
|
"type": "",
|
|
81725
|
-
"defaultValue": "
|
|
81735
|
+
"defaultValue": "Template.bind({})"
|
|
81726
81736
|
},
|
|
81727
81737
|
{
|
|
81728
81738
|
"name": "Template",
|
|
81729
81739
|
"ctype": "miscellaneous",
|
|
81730
81740
|
"subtype": "variable",
|
|
81731
|
-
"file": "src/
|
|
81741
|
+
"file": "src/button/button.stories.ts",
|
|
81732
81742
|
"deprecated": false,
|
|
81733
81743
|
"deprecationMessage": "",
|
|
81734
81744
|
"type": "",
|
|
81735
|
-
"defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<
|
|
81745
|
+
"defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<button\n\t\t\t[cdsButton]=\"kind\"\n\t\t\t[size]=\"size\"\n\t\t\t[isExpressive]=\"isExpressive\"\n\t\t\t[disabled]=\"disabled\"\n\t\t\t(click)=\"onClick($event)\"\n\t\t\t(mouseenter)=\"onMouseEnter($event)\"\n\t\t\t(mouseleave)=\"onMouseLeave($event)\"\n\t\t\t(focus)=\"onFocus($event)\"\n\t\t\t(blur)=\"onBlur($event)\">\n\t\t\tButton\n\t\t</button>\n\t`\n})"
|
|
81736
81746
|
},
|
|
81737
81747
|
{
|
|
81738
|
-
"name": "
|
|
81748
|
+
"name": "WithIcon",
|
|
81739
81749
|
"ctype": "miscellaneous",
|
|
81740
81750
|
"subtype": "variable",
|
|
81741
|
-
"file": "src/
|
|
81751
|
+
"file": "src/button/button.stories.ts",
|
|
81742
81752
|
"deprecated": false,
|
|
81743
81753
|
"deprecationMessage": "",
|
|
81744
81754
|
"type": "",
|
|
81745
|
-
"defaultValue": "(
|
|
81755
|
+
"defaultValue": "WithIconTemplate.bind({})"
|
|
81746
81756
|
},
|
|
81747
81757
|
{
|
|
81748
|
-
"name": "
|
|
81758
|
+
"name": "WithIconTemplate",
|
|
81749
81759
|
"ctype": "miscellaneous",
|
|
81750
81760
|
"subtype": "variable",
|
|
81751
|
-
"file": "src/
|
|
81761
|
+
"file": "src/button/button.stories.ts",
|
|
81752
81762
|
"deprecated": false,
|
|
81753
81763
|
"deprecationMessage": "",
|
|
81754
81764
|
"type": "",
|
|
81755
|
-
"defaultValue": "(
|
|
81765
|
+
"defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<button\n\t\t\t[cdsButton]=\"kind\"\n\t\t\t[size]=\"size\"\n\t\t\t[isExpressive]=\"isExpressive\"\n\t\t\t[disabled]=\"disabled\"\n\t\t\t(click)=\"onClick($event)\"\n\t\t\t(mouseenter)=\"onMouseEnter($event)\"\n\t\t\t(mouseleave)=\"onMouseleave($event)\"\n\t\t\t(focus)=\"onFocus($event)\"\n\t\t\t(blur)=\"onBlur($event)\">\n\t\t\tWith icon\n\t\t\t<svg class=\"cds--btn__icon\" cdsIcon=\"add\" size=\"16\"></svg>\n\t\t</button>\n\t`\n})"
|
|
81756
81766
|
}
|
|
81757
81767
|
],
|
|
81758
81768
|
"src/checkbox/checkbox.stories.ts": [
|
|
@@ -83955,128 +83965,128 @@
|
|
|
83955
83965
|
"defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<ng-template #customTabs let-item>\n\t\t\t{{item ? item.name : \"wait for it\"}}\n\t\t</ng-template>\n\t\t<ng-template #iconTab>\n\t\t\t<div style=\"height: 14px;\">\n\t\t\t\tSomething custom\n\t\t\t\t<svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\n\t\t\t\tstyle=\"height: 14px; width: 14px; fill: #3d70b2;\">\n\t\t\t\t\t<path d=\"M8 14.5a6.5 6.5 0 1 0 0-13 6.5 6.5 0 0 0 0 13zM8 16A8 8 0 1 1 8 0a8 8 0 0 1 0 16z\"></path>\n\t\t\t\t\t<path d=\"M9 13H7V7h2z\"></path>\n\t\t\t\t\t<path d=\"M7 4a1 1 0 1 1 2 0 1 1 0 1 1-2 0\"></path>\n\t\t\t\t</svg>\n\t\t\t</div>\n\t\t</ng-template>\n\t\t<cds-tabs [type]=\"type\" [followFocus]=\"followFocus\" [isNavigation]=\"isNavigation\">\n\t\t\t<cds-tab\n\t\t\t\t*ngFor=\"let item of data; let i = index;\"\n\t\t\t\t[heading]=\"customTabs\"\n\t\t\t\ttitle=\"Tab Content\"\n\t\t\t\t[context]=\"item\">\n\t\t\t\tTab Content {{i + 1}}\n\t\t\t</cds-tab>\n\t\t\t<cds-tab [heading]=\"iconTab\" title=\"Custom tab content\">Tab Content Custom</cds-tab>\n\t\t</cds-tabs>\n\t`\n})"
|
|
83956
83966
|
}
|
|
83957
83967
|
],
|
|
83958
|
-
"src/
|
|
83968
|
+
"src/theme/theme.stories.ts": [
|
|
83959
83969
|
{
|
|
83960
83970
|
"name": "Basic",
|
|
83961
83971
|
"ctype": "miscellaneous",
|
|
83962
83972
|
"subtype": "variable",
|
|
83963
|
-
"file": "src/
|
|
83973
|
+
"file": "src/theme/theme.stories.ts",
|
|
83964
83974
|
"deprecated": false,
|
|
83965
83975
|
"deprecationMessage": "",
|
|
83966
83976
|
"type": "",
|
|
83967
83977
|
"defaultValue": "Template.bind({})"
|
|
83968
83978
|
},
|
|
83969
83979
|
{
|
|
83970
|
-
"name": "
|
|
83980
|
+
"name": "LayeredTemplate",
|
|
83971
83981
|
"ctype": "miscellaneous",
|
|
83972
83982
|
"subtype": "variable",
|
|
83973
|
-
"file": "src/
|
|
83983
|
+
"file": "src/theme/theme.stories.ts",
|
|
83974
83984
|
"deprecated": false,
|
|
83975
83985
|
"deprecationMessage": "",
|
|
83976
83986
|
"type": "",
|
|
83977
|
-
"defaultValue": "
|
|
83987
|
+
"defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<div cdsTheme>\n\t\t\t<article class=\"theme-layer-example\">\n\t\t\t\t<header class=\"theme-layer-header\">White theme</header>\n\t\t\t\t<div class=\"theme-with-layer\">Layer one</div>\n\t\t\t\t<div cdsLayer>\n\t\t\t\t\t<div class=\"theme-with-layer\">Layer two</div>\n\t\t\t\t\t<div cdsLayer>\n\t\t\t\t\t\t<div class=\"theme-with-layer\">Layer three</div>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</article>\n\t\t</div>\n\t\t<div cdsTheme=\"g10\">\n\t\t\t<article class=\"theme-layer-example\">\n\t\t\t\t<header class=\"theme-layer-header\">G10 theme</header>\n\t\t\t\t<div class=\"theme-with-layer\">Layer one</div>\n\t\t\t\t<div cdsLayer>\n\t\t\t\t\t<div class=\"theme-with-layer\">Layer two</div>\n\t\t\t\t\t<div cdsLayer>\n\t\t\t\t\t\t<div class=\"theme-with-layer\">Layer three</div>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</article>\n\t\t</div>\n\t\t<div cdsTheme=\"g90\">\n\t\t\t<article class=\"theme-layer-example\">\n\t\t\t\t<header class=\"theme-layer-header\">G90 theme</header>\n\t\t\t\t<div class=\"theme-with-layer\">Layer one</div>\n\t\t\t\t<div cdsLayer>\n\t\t\t\t\t<div class=\"theme-with-layer\">Layer two</div>\n\t\t\t\t\t<div cdsLayer>\n\t\t\t\t\t\t<div class=\"theme-with-layer\">Layer three</div>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</article>\n\t\t</div>\n\t\t<div cdsTheme=\"g100\">\n\t\t\t<article class=\"theme-layer-example\">\n\t\t\t\t<header class=\"theme-layer-header\">G100 theme</header>\n\t\t\t\t<div class=\"theme-with-layer\">Layer one</div>\n\t\t\t\t<div cdsLayer>\n\t\t\t\t\t<div class=\"theme-with-layer\">Layer two</div>\n\t\t\t\t\t<div cdsLayer>\n\t\t\t\t\t\t<div class=\"theme-with-layer\">Layer three</div>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</article>\n\t\t</div>\n\t`,\n\tstyles: [`\n\t\t.theme-layer-example {\n\t\t\tpadding: 1rem;\n\t\t\tbackground: var(--cds-background);\n\t\t\tcolor: var(--cds-text-primary);\n\t\t}\n\t\t.theme-layer-header {\n\t\t\tmargin-bottom: 1rem;\n\t\t}\n\t\t.theme-with-layer {\n\t\t\tpadding: 1rem;\n\t\t\tbackground: var(--cds-layer);\n\t\t\tcolor: var(--cds-text-primary);\n\t\t}\n\t`]\n})"
|
|
83978
83988
|
},
|
|
83979
83989
|
{
|
|
83980
|
-
"name": "
|
|
83990
|
+
"name": "Template",
|
|
83981
83991
|
"ctype": "miscellaneous",
|
|
83982
83992
|
"subtype": "variable",
|
|
83983
|
-
"file": "src/
|
|
83993
|
+
"file": "src/theme/theme.stories.ts",
|
|
83984
83994
|
"deprecated": false,
|
|
83985
83995
|
"deprecationMessage": "",
|
|
83986
83996
|
"type": "",
|
|
83987
|
-
"defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<
|
|
83997
|
+
"defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<div cdsTheme>\n\t\t\t<div class=\"theme-section\">\n\t\t\t\t<p>White theme</p>\n\t\t\t</div>\n\t\t</div>\n\t\t<div cdsTheme=\"g10\">\n\t\t\t<div class=\"theme-section\">\n\t\t\t\t<p>G10 theme</p>\n\t\t\t</div>\n\t\t</div>\n\t\t<div cdsTheme=\"g90\">\n\t\t\t<div class=\"theme-section\">\n\t\t\t\t<p>G90 theme</p>\n\t\t\t</div>\n\t\t</div>\n\t\t<div cdsTheme=\"g100\">\n\t\t\t<div class=\"theme-section\">\n\t\t\t\t<p>G100 theme</p>\n\t\t\t</div>\n\t\t</div>\n\t`,\n\tstyles: [`\n\t\t.theme-section {\n\t\t\tpadding: 1rem;\n\t\t\tbackground: var(--cds-background);\n\t\t\tcolor: var(--cds-text-primary);\n\t\t}\n\t`]\n})"
|
|
83988
83998
|
},
|
|
83989
83999
|
{
|
|
83990
|
-
"name": "
|
|
84000
|
+
"name": "WithLayer",
|
|
83991
84001
|
"ctype": "miscellaneous",
|
|
83992
84002
|
"subtype": "variable",
|
|
83993
|
-
"file": "src/
|
|
84003
|
+
"file": "src/theme/theme.stories.ts",
|
|
83994
84004
|
"deprecated": false,
|
|
83995
84005
|
"deprecationMessage": "",
|
|
83996
84006
|
"type": "",
|
|
83997
|
-
"defaultValue": "
|
|
83998
|
-
}
|
|
84007
|
+
"defaultValue": "LayeredTemplate.bind({})"
|
|
84008
|
+
}
|
|
84009
|
+
],
|
|
84010
|
+
"src/tag/tag.stories.ts": [
|
|
83999
84011
|
{
|
|
84000
|
-
"name": "
|
|
84012
|
+
"name": "Basic",
|
|
84001
84013
|
"ctype": "miscellaneous",
|
|
84002
84014
|
"subtype": "variable",
|
|
84003
84015
|
"file": "src/tag/tag.stories.ts",
|
|
84004
84016
|
"deprecated": false,
|
|
84005
84017
|
"deprecationMessage": "",
|
|
84006
84018
|
"type": "",
|
|
84007
|
-
"defaultValue": "(
|
|
84019
|
+
"defaultValue": "Template.bind({})"
|
|
84008
84020
|
},
|
|
84009
84021
|
{
|
|
84010
|
-
"name": "
|
|
84022
|
+
"name": "Filter",
|
|
84011
84023
|
"ctype": "miscellaneous",
|
|
84012
84024
|
"subtype": "variable",
|
|
84013
84025
|
"file": "src/tag/tag.stories.ts",
|
|
84014
84026
|
"deprecated": false,
|
|
84015
84027
|
"deprecationMessage": "",
|
|
84016
84028
|
"type": "",
|
|
84017
|
-
"defaultValue": "
|
|
84029
|
+
"defaultValue": "FilteredTemplate.bind({})"
|
|
84018
84030
|
},
|
|
84019
84031
|
{
|
|
84020
|
-
"name": "
|
|
84032
|
+
"name": "FilteredTemplate",
|
|
84021
84033
|
"ctype": "miscellaneous",
|
|
84022
84034
|
"subtype": "variable",
|
|
84023
84035
|
"file": "src/tag/tag.stories.ts",
|
|
84024
84036
|
"deprecated": false,
|
|
84025
84037
|
"deprecationMessage": "",
|
|
84026
84038
|
"type": "",
|
|
84027
|
-
"defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-tag-
|
|
84039
|
+
"defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-tag-filter\n\t\t\t[type]=\"type\"\n\t\t\t[size]=\"size\"\n\t\t\t[skeleton]=\"skeleton\"\n\t\t\ttitle=\"Filter\"\n\t\t\tcloseButtonLabel=\"Clear\">\n\t\t\t<div cdsTagIcon>\n\t\t\t\t<svg ibmIcon=\"settings\" size=\"16\"></svg>\n\t\t\t</div>\n\t\t\tFiltered\n\t\t</cds-tag-filter>\n\t`\n})"
|
|
84028
84040
|
},
|
|
84029
84041
|
{
|
|
84030
|
-
"name": "
|
|
84042
|
+
"name": "OperationalTag",
|
|
84031
84043
|
"ctype": "miscellaneous",
|
|
84032
84044
|
"subtype": "variable",
|
|
84033
84045
|
"file": "src/tag/tag.stories.ts",
|
|
84034
84046
|
"deprecated": false,
|
|
84035
84047
|
"deprecationMessage": "",
|
|
84036
84048
|
"type": "",
|
|
84037
|
-
"defaultValue": "(
|
|
84038
|
-
}
|
|
84039
|
-
],
|
|
84040
|
-
"src/theme/theme.stories.ts": [
|
|
84049
|
+
"defaultValue": "OperationalTagTemplate.bind({})"
|
|
84050
|
+
},
|
|
84041
84051
|
{
|
|
84042
|
-
"name": "
|
|
84052
|
+
"name": "OperationalTagTemplate",
|
|
84043
84053
|
"ctype": "miscellaneous",
|
|
84044
84054
|
"subtype": "variable",
|
|
84045
|
-
"file": "src/
|
|
84055
|
+
"file": "src/tag/tag.stories.ts",
|
|
84046
84056
|
"deprecated": false,
|
|
84047
84057
|
"deprecationMessage": "",
|
|
84048
84058
|
"type": "",
|
|
84049
|
-
"defaultValue": "
|
|
84059
|
+
"defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-tag-operational\n\t\t\ttype=\"cyan\"\n\t\t\t[size]=\"size\"\n\t\t\t[skeleton]=\"skeleton\"\n\t\t\t(click)=\"onClick($event)\">\n\t\t\t<div cdsTagIcon>\n\t\t\t\t<svg ibmIcon=\"settings\" size=\"16\"></svg>\n\t\t\t</div>\n\t\t\tOperational\n\t\t</cds-tag-operational>\n\n\n\t\t<div\n\t\t\tcdsPopover\n\t\t\t[isOpen]=\"isOpen\"\n\t\t\t[highContrast]=\"true\">\n\t\t\t<cds-tag-operational\n\t\t\t\t[type]=\"type\"\n\t\t\t\t[size]=\"size\"\n\t\t\t\t[skeleton]=\"skeleton\"\n\t\t\t\t(click)=\"isOpen = !isOpen\">\n\t\t\t\t<div cdsTagIcon>\n\t\t\t\t\t<svg ibmIcon=\"settings\" size=\"16\"></svg>\n\t\t\t\t</div>\n\t\t\t\tOperational w/ popover\n\t\t\t</cds-tag-operational>\n\t\t\t<cds-popover-content>\n\t\t\t\t<div class=\"popover-content\">\n\t\t\t\t\tTag 1 name <br>\n\t\t\t\t\tTag 2 name <br>\n\t\t\t\t\tTag 3 name <br>\n\t\t\t\t\tTag 4 name <br>\n\t\t\t\t\t<cds-tag type=\"green\">Tag 5 name</cds-tag>\n\t\t\t\t</div>\n\t\t\t</cds-popover-content>\n\t\t</div>\n\t`,\n\tstyles: [\n\t\t`.popover-content {\n\t\t\tline-height: 1.5;\n\t\t\tpadding: 1rem;\n\t\t\tfont-size: 14px;\n\t\t}`\n\t]\n})"
|
|
84050
84060
|
},
|
|
84051
84061
|
{
|
|
84052
|
-
"name": "
|
|
84062
|
+
"name": "SelectedTag",
|
|
84053
84063
|
"ctype": "miscellaneous",
|
|
84054
84064
|
"subtype": "variable",
|
|
84055
|
-
"file": "src/
|
|
84065
|
+
"file": "src/tag/tag.stories.ts",
|
|
84056
84066
|
"deprecated": false,
|
|
84057
84067
|
"deprecationMessage": "",
|
|
84058
84068
|
"type": "",
|
|
84059
|
-
"defaultValue": "
|
|
84069
|
+
"defaultValue": "SelectedTagTemplate.bind({})"
|
|
84060
84070
|
},
|
|
84061
84071
|
{
|
|
84062
|
-
"name": "
|
|
84072
|
+
"name": "SelectedTagTemplate",
|
|
84063
84073
|
"ctype": "miscellaneous",
|
|
84064
84074
|
"subtype": "variable",
|
|
84065
|
-
"file": "src/
|
|
84075
|
+
"file": "src/tag/tag.stories.ts",
|
|
84066
84076
|
"deprecated": false,
|
|
84067
84077
|
"deprecationMessage": "",
|
|
84068
84078
|
"type": "",
|
|
84069
|
-
"defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<
|
|
84079
|
+
"defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-tag-selectable\n\t\t\t[size]=\"size\"\n\t\t\t[skeleton]=\"skeleton\"\n\t\t\t[selected]=\"selected\"\n\t\t\t(selectedChange)=\"selectedChange($event)\"\n\t\t\t(click)=\"onClick($event)\">\n\t\t\t<div cdsTagIcon>\n\t\t\t\t<svg ibmIcon=\"settings\" size=\"16\"></svg>\n\t\t\t</div>\n\t\t\tSelectable\n\t\t</cds-tag-selectable>\n\t`\n})"
|
|
84070
84080
|
},
|
|
84071
84081
|
{
|
|
84072
|
-
"name": "
|
|
84082
|
+
"name": "Template",
|
|
84073
84083
|
"ctype": "miscellaneous",
|
|
84074
84084
|
"subtype": "variable",
|
|
84075
|
-
"file": "src/
|
|
84085
|
+
"file": "src/tag/tag.stories.ts",
|
|
84076
84086
|
"deprecated": false,
|
|
84077
84087
|
"deprecationMessage": "",
|
|
84078
84088
|
"type": "",
|
|
84079
|
-
"defaultValue": "
|
|
84089
|
+
"defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-tag\n\t\t\t[type]=\"type\"\n\t\t\t[skeleton]=\"skeleton\"\n\t\t\t[size]=\"size\">\n\t\t\t<div cdsTagIcon>\n\t\t\t\t<svg ibmIcon=\"settings\" size=\"16\"></svg>\n\t\t\t</div>\n\t\t\tRead only\n\t\t</cds-tag>\n\t`\n})"
|
|
84080
84090
|
}
|
|
84081
84091
|
],
|
|
84082
84092
|
"src/tiles/clickable-tile.stories.ts": [
|
|
@@ -87640,7 +87650,7 @@
|
|
|
87640
87650
|
"linktype": "component",
|
|
87641
87651
|
"name": "ContainedList",
|
|
87642
87652
|
"coveragePercent": 90,
|
|
87643
|
-
"coverageCount": "
|
|
87653
|
+
"coverageCount": "10/11",
|
|
87644
87654
|
"status": "very-good"
|
|
87645
87655
|
},
|
|
87646
87656
|
{
|