@kyndryl-design-system/shidoka-applications 2.8.2 → 2.9.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.
Files changed (5) hide show
  1. package/components/reusable/pagetitle/pageTitle.d.ts +2 -0
  2. package/components/reusable/pagetitle/pageTitle.d.ts.map +1 -1
  3. package/components/reusable/pagetitle/pageTitle.js +43 -2
  4. package/components/reusable/pagetitle/pageTitle.js.map +1 -1
  5. package/package.json +1 -1
package/components/reusable/pagetitle/pageTitle.d.ts CHANGED
@@ -13,6 +13,8 @@ export declare class PageTitle extends LitElement {
13
13
  subTitle: string;
14
14
  /** Type of page title `'primary'` & `'secondary'`. */
15
15
  type: string;
16
+ /** Set this to `true` for AI theme. */
17
+ aiConnected: boolean;
16
18
  render(): import("lit").TemplateResult<1>;
17
19
  }
18
20
  declare global {
package/components/reusable/pagetitle/pageTitle.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"pageTitle.d.ts","sourceRoot":"","sources":["../../../../src/components/reusable/pagetitle/pageTitle.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAKvC;;;GAGG;AAEH,qBACa,SAAU,SAAQ,UAAU;IACvC,OAAgB,MAAM,MAAiB;IAEvC,qBAAqB;IAErB,QAAQ,SAAM;IAEd,kCAAkC;IAElC,SAAS,SAAM;IAEf,0BAA0B;IAE1B,QAAQ,SAAM;IAEd,sDAAsD;IAEtD,IAAI,SAAa;IAER,MAAM;CAkChB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,gBAAgB,EAAE,SAAS,CAAC;KAC7B;CACF"}
1
+ {"version":3,"file":"pageTitle.d.ts","sourceRoot":"","sources":["../../../../src/components/reusable/pagetitle/pageTitle.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAKvC;;;GAGG;AAEH,qBACa,SAAU,SAAQ,UAAU;IACvC,OAAgB,MAAM,MAAiB;IAEvC,qBAAqB;IAErB,QAAQ,SAAM;IAEd,kCAAkC;IAElC,SAAS,SAAM;IAEf,0BAA0B;IAE1B,QAAQ,SAAM;IAEd,sDAAsD;IAEtD,IAAI,SAAa;IAEjB,uCAAuC;IAEvC,WAAW,UAAS;IAEX,MAAM;CAmChB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,gBAAgB,EAAE,SAAS,CAAC;KAC7B;CACF"}
package/components/reusable/pagetitle/pageTitle.js CHANGED
@@ -72,6 +72,9 @@ import{_ as e}from"../../../vendor/tslib-53a81efe.js";import{n as i,o as t,e as
72
72
  line-height: var(--kd-line-height-headline-4-max);
73
73
  }
74
74
  }
75
+ .page-title-primary.ai-connected {
76
+ color: var(--kd-color-text-title-ai-primary);
77
+ }
75
78
  .page-title-secondary {
76
79
  font-family: var(--kd-font-family-primary);
77
80
  font-size: var(--kd-font-size-headline-6-sm);
@@ -104,6 +107,44 @@ import{_ as e}from"../../../vendor/tslib-53a81efe.js";import{n as i,o as t,e as
104
107
  line-height: var(--kd-line-height-headline-6-max);
105
108
  }
106
109
  }
110
+ .page-title-secondary.ai-connected {
111
+ color: var(--kd-color-text-title-ai-secondary);
112
+ }
113
+ .page-title-tertiary {
114
+ font-family: var(--kd-font-family-primary);
115
+ font-size: var(--kd-font-size-body-1-sm);
116
+ line-height: var(--kd-line-height-body-1-sm);
117
+ font-weight: var(--kd-font-weight-regular);
118
+ letter-spacing: var(--kd-letter-spacing-4);
119
+ color: var(--kd-color-text-title-primary);
120
+ }
121
+ @media (min-width: 42rem) {
122
+ .page-title-tertiary {
123
+ font-size: var(--kd-font-size-body-1-md);
124
+ line-height: var(--kd-line-height-body-1-md);
125
+ }
126
+ }
127
+ @media (min-width: 74rem) {
128
+ .page-title-tertiary {
129
+ font-size: var(--kd-font-size-body-1-lg);
130
+ line-height: var(--kd-line-height-body-1-lg);
131
+ }
132
+ }
133
+ @media (min-width: 82rem) {
134
+ .page-title-tertiary {
135
+ font-size: var(--kd-font-size-body-1-xlg);
136
+ line-height: var(--kd-line-height-body-1-xlg);
137
+ }
138
+ }
139
+ @media (min-width: 99rem) {
140
+ .page-title-tertiary {
141
+ font-size: var(--kd-font-size-body-1-max);
142
+ line-height: var(--kd-line-height-body-1-max);
143
+ }
144
+ }
145
+ .page-title-tertiary.ai-connected {
146
+ color: var(--kd-color-text-title-ai-primary);
147
+ }
107
148
 
108
149
  .page-headline {
109
150
  font-family: var(--kd-font-family-primary);
@@ -177,7 +218,7 @@ import{_ as e}from"../../../vendor/tslib-53a81efe.js";import{n as i,o as t,e as
177
218
  max-width: 56px;
178
219
  max-height: 56px;
179
220
  margin-right: 16px;
180
- }`;let o=class extends r{constructor(){super(...arguments),this.headLine="",this.pageTitle="",this.subTitle="",this.type="primary"}render(){const e={"page-title":!0,[`page-title-${this.type}`]:!0},i={"page-subtitle":!0,[`page-subtitle-${this.type}`]:!0};return d`
221
+ }`;let o=class extends r{constructor(){super(...arguments),this.headLine="",this.pageTitle="",this.subTitle="",this.type="primary",this.aiConnected=!1}render(){const e={"page-title":!0,[`page-title-${this.type}`]:!0,"ai-connected":this.aiConnected},i={"page-subtitle":!0,[`page-subtitle-${this.type}`]:!0};return d`
181
222
  <div class="page-title-wrapper">
182
223
  <div class="icon-wrapper">
183
224
  <slot name="icon"></slot>
@@ -194,5 +235,5 @@ import{_ as e}from"../../../vendor/tslib-53a81efe.js";import{n as i,o as t,e as
194
235
  </div>`:null}
195
236
  </div>
196
237
  </div>
197
- `}};o.styles=l,e([i({type:String})],o.prototype,"headLine",void 0),e([i({type:String})],o.prototype,"pageTitle",void 0),e([i({type:String})],o.prototype,"subTitle",void 0),e([i({type:String})],o.prototype,"type",void 0),o=e([a("kyn-page-title")],o);export{o as PageTitle};
238
+ `}};o.styles=l,e([i({type:String})],o.prototype,"headLine",void 0),e([i({type:String})],o.prototype,"pageTitle",void 0),e([i({type:String})],o.prototype,"subTitle",void 0),e([i({type:String})],o.prototype,"type",void 0),e([i({type:Boolean})],o.prototype,"aiConnected",void 0),o=e([a("kyn-page-title")],o);export{o as PageTitle};
198
239
  //# sourceMappingURL=pageTitle.js.map
package/components/reusable/pagetitle/pageTitle.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"pageTitle.js","sources":["../../../../src/components/reusable/pagetitle/pageTitle.ts"],"sourcesContent":["import { LitElement, html } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport PageTitleScss from './pageTitle.scss';\n\n/**\n * Page Title\n * @slot icon - Slot for icon. Use size 56 * 56 as per UX guidelines.\n */\n\n@customElement('kyn-page-title')\nexport class PageTitle extends LitElement {\n static override styles = PageTitleScss;\n\n /** Headline text. */\n @property({ type: String })\n headLine = '';\n\n /** Page title text (required). */\n @property({ type: String })\n pageTitle = '';\n\n /** Page subtitle text. */\n @property({ type: String })\n subTitle = '';\n\n /** Type of page title `'primary'` & `'secondary'`. */\n @property({ type: String })\n type = 'primary';\n\n override render() {\n const classes = {\n 'page-title': true,\n [`page-title-${this.type}`]: true,\n };\n\n const subTitleClasses = {\n 'page-subtitle': true,\n [`page-subtitle-${this.type}`]: true,\n };\n\n return html`\n <div class=\"page-title-wrapper\">\n <div class=\"icon-wrapper\">\n <slot name=\"icon\"></slot>\n </div>\n\n <div class=\"page-title-text-wrapper\">\n <!-- Headline -->\n ${this.headLine !== ''\n ? html`<div class=\"page-headline\">${this.headLine}</div>`\n : null}\n <!-- Title -->\n <h1 class=\"${classMap(classes)}\">${this.pageTitle}</h1>\n <!-- Subtitle -->\n ${this.subTitle !== ''\n ? html`<div class=\"${classMap(subTitleClasses)}\">\n ${this.subTitle}\n </div>`\n : null}\n </div>\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'kyn-page-title': PageTitle;\n }\n}\n"],"names":["PageTitle","LitElement","constructor","this","headLine","pageTitle","subTitle","type","render","classes","subTitleClasses","html","classMap","styles","PageTitleScss","__decorate","property","String","prototype","customElement"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAWO,IAAMA,EAAN,cAAwBC,EAAxB,WAAAC,uBAKLC,KAAQC,SAAG,GAIXD,KAASE,UAAG,GAIZF,KAAQG,SAAG,GAIXH,KAAII,KAAG,SAoCR,CAlCU,MAAAC,GACP,MAAMC,EAAU,CACd,cAAc,EACd,CAAC,cAAcN,KAAKI,SAAS,GAGzBG,EAAkB,CACtB,iBAAiB,EACjB,CAAC,iBAAiBP,KAAKI,SAAS,GAGlC,OAAOI,CAAI;;;;;;;;YAQe,KAAlBR,KAAKC,SACHO,CAAI,8BAA8BR,KAAKC,iBACvC;;uBAESQ,EAASH,OAAaN,KAAKE;;YAEpB,KAAlBF,KAAKG,SACHK,CAAI,eAAeC,EAASF;kBACxBP,KAAKG;sBAET;;;KAIX,GAnDeN,EAAMa,OAAGC,EAIzBC,EAAA,CADCC,EAAS,CAAET,KAAMU,UACJjB,EAAAkB,UAAA,gBAAA,GAIdH,EAAA,CADCC,EAAS,CAAET,KAAMU,UACHjB,EAAAkB,UAAA,iBAAA,GAIfH,EAAA,CADCC,EAAS,CAAET,KAAMU,UACJjB,EAAAkB,UAAA,gBAAA,GAIdH,EAAA,CADCC,EAAS,CAAET,KAAMU,UACDjB,EAAAkB,UAAA,YAAA,GAjBNlB,EAASe,EAAA,CADrBI,EAAc,mBACFnB"}
1
+ {"version":3,"file":"pageTitle.js","sources":["../../../../src/components/reusable/pagetitle/pageTitle.ts"],"sourcesContent":["import { LitElement, html } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport PageTitleScss from './pageTitle.scss';\n\n/**\n * Page Title\n * @slot icon - Slot for icon. Use size 56 * 56 as per UX guidelines.\n */\n\n@customElement('kyn-page-title')\nexport class PageTitle extends LitElement {\n static override styles = PageTitleScss;\n\n /** Headline text. */\n @property({ type: String })\n headLine = '';\n\n /** Page title text (required). */\n @property({ type: String })\n pageTitle = '';\n\n /** Page subtitle text. */\n @property({ type: String })\n subTitle = '';\n\n /** Type of page title `'primary'` & `'secondary'`. */\n @property({ type: String })\n type = 'primary';\n\n /** Set this to `true` for AI theme. */\n @property({ type: Boolean })\n aiConnected = false;\n\n override render() {\n const classes = {\n 'page-title': true,\n [`page-title-${this.type}`]: true,\n 'ai-connected': this.aiConnected,\n };\n\n const subTitleClasses = {\n 'page-subtitle': true,\n [`page-subtitle-${this.type}`]: true,\n };\n\n return html`\n <div class=\"page-title-wrapper\">\n <div class=\"icon-wrapper\">\n <slot name=\"icon\"></slot>\n </div>\n\n <div class=\"page-title-text-wrapper\">\n <!-- Headline -->\n ${this.headLine !== ''\n ? html`<div class=\"page-headline\">${this.headLine}</div>`\n : null}\n <!-- Title -->\n <h1 class=\"${classMap(classes)}\">${this.pageTitle}</h1>\n <!-- Subtitle -->\n ${this.subTitle !== ''\n ? html`<div class=\"${classMap(subTitleClasses)}\">\n ${this.subTitle}\n </div>`\n : null}\n </div>\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'kyn-page-title': PageTitle;\n }\n}\n"],"names":["PageTitle","LitElement","constructor","this","headLine","pageTitle","subTitle","type","aiConnected","render","classes","subTitleClasses","html","classMap","styles","PageTitleScss","__decorate","property","String","prototype","Boolean","customElement"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAWO,IAAMA,EAAN,cAAwBC,EAAxB,WAAAC,uBAKLC,KAAQC,SAAG,GAIXD,KAASE,UAAG,GAIZF,KAAQG,SAAG,GAIXH,KAAII,KAAG,UAIPJ,KAAWK,aAAG,CAqCf,CAnCU,MAAAC,GACP,MAAMC,EAAU,CACd,cAAc,EACd,CAAC,cAAcP,KAAKI,SAAS,EAC7B,eAAgBJ,KAAKK,aAGjBG,EAAkB,CACtB,iBAAiB,EACjB,CAAC,iBAAiBR,KAAKI,SAAS,GAGlC,OAAOK,CAAI;;;;;;;;YAQe,KAAlBT,KAAKC,SACHQ,CAAI,8BAA8BT,KAAKC,iBACvC;;uBAESS,EAASH,OAAaP,KAAKE;;YAEpB,KAAlBF,KAAKG,SACHM,CAAI,eAAeC,EAASF;kBACxBR,KAAKG;sBAET;;;KAIX,GAxDeN,EAAMc,OAAGC,EAIzBC,EAAA,CADCC,EAAS,CAAEV,KAAMW,UACJlB,EAAAmB,UAAA,gBAAA,GAIdH,EAAA,CADCC,EAAS,CAAEV,KAAMW,UACHlB,EAAAmB,UAAA,iBAAA,GAIfH,EAAA,CADCC,EAAS,CAAEV,KAAMW,UACJlB,EAAAmB,UAAA,gBAAA,GAIdH,EAAA,CADCC,EAAS,CAAEV,KAAMW,UACDlB,EAAAmB,UAAA,YAAA,GAIjBH,EAAA,CADCC,EAAS,CAAEV,KAAMa,WACEpB,EAAAmB,UAAA,mBAAA,GArBTnB,EAASgB,EAAA,CADrBK,EAAc,mBACFrB"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kyndryl-design-system/shidoka-applications",
3
- "version": "2.8.2",
3
+ "version": "2.9.0",
4
4
  "description": "Shidoka Web Components for Applications",
5
5
  "main": "index.js",
6
6
  "type": "module",