@progress/kendo-angular-typography 24.2.2 → 25.0.0-develop.12
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/fesm2022/progress-kendo-angular-typography.mjs +29 -19
- package/index.d.ts +230 -9
- package/package-metadata.mjs +2 -2
- package/package.json +8 -8
- package/directives.d.ts +0 -23
- package/models/font-size.d.ts +0 -45
- package/models/font-weight.d.ts +0 -21
- package/models/text-align.d.ts +0 -23
- package/models/text-transform.d.ts +0 -21
- package/models/theme-color.d.ts +0 -21
- package/models/variant.d.ts +0 -43
- package/package-metadata.d.ts +0 -9
- package/typography.directive.d.ts +0 -62
- package/typography.module.d.ts +0 -42
- package/utils.d.ts +0 -8
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
4
|
*-------------------------------------------------------------------------------------------*/
|
|
5
5
|
import * as i0 from '@angular/core';
|
|
6
|
-
import { Input, Directive, NgModule } from '@angular/core';
|
|
6
|
+
import { signal, effect, Input, Directive, NgModule } from '@angular/core';
|
|
7
7
|
import { validatePackage } from '@progress/kendo-licensing';
|
|
8
8
|
|
|
9
9
|
/**
|
|
@@ -73,8 +73,8 @@ const packageMetadata = {
|
|
|
73
73
|
productName: 'Kendo UI for Angular',
|
|
74
74
|
productCode: 'KENDOUIANGULAR',
|
|
75
75
|
productCodes: ['KENDOUIANGULAR'],
|
|
76
|
-
publishDate:
|
|
77
|
-
version: '
|
|
76
|
+
publishDate: 1785318085,
|
|
77
|
+
version: '25.0.0-develop.12',
|
|
78
78
|
licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
|
|
79
79
|
};
|
|
80
80
|
|
|
@@ -94,36 +94,46 @@ class TypographyDirective {
|
|
|
94
94
|
/**
|
|
95
95
|
* Specifies the element `variant` class that will be applied.
|
|
96
96
|
*/
|
|
97
|
-
variant;
|
|
97
|
+
set variant(value) { this._variant.set(value); }
|
|
98
|
+
get variant() { return this._variant(); }
|
|
98
99
|
/**
|
|
99
100
|
* Sets the element `font-size` style.
|
|
100
101
|
*/
|
|
101
|
-
fontSize;
|
|
102
|
+
set fontSize(value) { this._fontSize.set(value); }
|
|
103
|
+
get fontSize() { return this._fontSize(); }
|
|
102
104
|
/**
|
|
103
105
|
* Sets the element `font-weight` style.
|
|
104
106
|
*/
|
|
105
|
-
fontWeight;
|
|
107
|
+
set fontWeight(value) { this._fontWeight.set(value); }
|
|
108
|
+
get fontWeight() { return this._fontWeight(); }
|
|
106
109
|
/**
|
|
107
110
|
* Sets the element `text-align` style.
|
|
108
111
|
*/
|
|
109
|
-
textAlign;
|
|
112
|
+
set textAlign(value) { this._textAlign.set(value); }
|
|
113
|
+
get textAlign() { return this._textAlign(); }
|
|
110
114
|
/**
|
|
111
115
|
* Sets the element `text-transform` style.
|
|
112
116
|
*/
|
|
113
|
-
textTransform;
|
|
117
|
+
set textTransform(value) { this._textTransform.set(value); }
|
|
118
|
+
get textTransform() { return this._textTransform(); }
|
|
114
119
|
/**
|
|
115
120
|
* Applies the `theme-color` to the element.
|
|
116
121
|
*/
|
|
117
|
-
themeColor;
|
|
122
|
+
set themeColor(value) { this._themeColor.set(value); }
|
|
123
|
+
get themeColor() { return this._themeColor(); }
|
|
118
124
|
typographyClasses = [];
|
|
125
|
+
_variant = signal(undefined, ...(ngDevMode ? [{ debugName: "_variant" }] : []));
|
|
126
|
+
_fontSize = signal(undefined, ...(ngDevMode ? [{ debugName: "_fontSize" }] : []));
|
|
127
|
+
_fontWeight = signal(undefined, ...(ngDevMode ? [{ debugName: "_fontWeight" }] : []));
|
|
128
|
+
_textAlign = signal(undefined, ...(ngDevMode ? [{ debugName: "_textAlign" }] : []));
|
|
129
|
+
_textTransform = signal(undefined, ...(ngDevMode ? [{ debugName: "_textTransform" }] : []));
|
|
130
|
+
_themeColor = signal(undefined, ...(ngDevMode ? [{ debugName: "_themeColor" }] : []));
|
|
119
131
|
constructor(elementWrapper, renderer, element) {
|
|
120
132
|
this.elementWrapper = elementWrapper;
|
|
121
133
|
this.renderer = renderer;
|
|
122
134
|
this.element = element;
|
|
123
135
|
validatePackage(packageMetadata);
|
|
124
|
-
|
|
125
|
-
ngOnChanges() {
|
|
126
|
-
this.setTypographyClasses();
|
|
136
|
+
effect(() => { this.setTypographyClasses(); });
|
|
127
137
|
}
|
|
128
138
|
variantClass() {
|
|
129
139
|
return typographyVariantOptions[this.variant];
|
|
@@ -162,10 +172,10 @@ class TypographyDirective {
|
|
|
162
172
|
}
|
|
163
173
|
});
|
|
164
174
|
}
|
|
165
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
166
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
175
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: TypographyDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
|
|
176
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.25", type: TypographyDirective, isStandalone: true, selector: "[kendoTypography]", inputs: { variant: "variant", fontSize: "fontSize", fontWeight: "fontWeight", textAlign: "textAlign", textTransform: "textTransform", themeColor: "themeColor" }, exportAs: ["kendoTypography"], ngImport: i0 });
|
|
167
177
|
}
|
|
168
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
178
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: TypographyDirective, decorators: [{
|
|
169
179
|
type: Directive,
|
|
170
180
|
args: [{
|
|
171
181
|
selector: '[kendoTypography]',
|
|
@@ -240,11 +250,11 @@ const KENDO_TYPOGRAPHY = [
|
|
|
240
250
|
* ```
|
|
241
251
|
*/
|
|
242
252
|
class TypographyModule {
|
|
243
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
244
|
-
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
245
|
-
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
253
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: TypographyModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
254
|
+
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.25", ngImport: i0, type: TypographyModule, imports: [TypographyDirective], exports: [TypographyDirective] });
|
|
255
|
+
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: TypographyModule });
|
|
246
256
|
}
|
|
247
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
257
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: TypographyModule, decorators: [{
|
|
248
258
|
type: NgModule,
|
|
249
259
|
args: [{
|
|
250
260
|
imports: [...KENDO_TYPOGRAPHY],
|
package/index.d.ts
CHANGED
|
@@ -2,12 +2,233 @@
|
|
|
2
2
|
* Copyright © 2026 Progress Software Corporation. All rights reserved.
|
|
3
3
|
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
4
|
*-------------------------------------------------------------------------------------------*/
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
5
|
+
import * as i0 from '@angular/core';
|
|
6
|
+
import { ElementRef, Renderer2 } from '@angular/core';
|
|
7
|
+
|
|
8
|
+
/**
|
|
9
|
+
* Sets the font size.
|
|
10
|
+
* You can use these values:
|
|
11
|
+
* * `xs`
|
|
12
|
+
* * `sm`
|
|
13
|
+
* * `md`
|
|
14
|
+
* * `lg`
|
|
15
|
+
* * `xl`
|
|
16
|
+
*
|
|
17
|
+
* The matching styles for the Default Kendo theme are:
|
|
18
|
+
* * `xs`—font-size: 10px
|
|
19
|
+
* * `sm`—font-size: 12px
|
|
20
|
+
* * `md`—font-size: 16px
|
|
21
|
+
* * `lg`—font-size: 18px
|
|
22
|
+
* * `xl`—font-size: 20px
|
|
23
|
+
*
|
|
24
|
+
* The matching styles for the Bootstrap Kendo theme are:
|
|
25
|
+
* * `xs`—font-size: 0.75rem
|
|
26
|
+
* * `sm`—font-size: 0.875rem
|
|
27
|
+
* * `md`—font-size: 1rem
|
|
28
|
+
* * `lg`—font-size: 1.25rem
|
|
29
|
+
* * `xl`—font-size: 1.5rem
|
|
30
|
+
*
|
|
31
|
+
* The matching styles for the Material Kendo theme are:
|
|
32
|
+
* * `xs`—font-size: 10px
|
|
33
|
+
* * `sm`—font-size: 12px
|
|
34
|
+
* * `md`—font-size: 14px
|
|
35
|
+
* * `lg`—font-size: 16px
|
|
36
|
+
* * `xl`—font-size: 20px
|
|
37
|
+
*/
|
|
38
|
+
type TypographyFontSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
|
|
39
|
+
|
|
40
|
+
/**
|
|
41
|
+
* Sets the font weight.
|
|
42
|
+
*
|
|
43
|
+
* You can use these values:
|
|
44
|
+
* * `light`—font-weight: 300
|
|
45
|
+
* * `normal`—font-weight: 400
|
|
46
|
+
* * `bold`—font-weight: 700 (for Default and Bootstrap themes); font-weight: 500 (for Material theme)
|
|
47
|
+
*/
|
|
48
|
+
type TypographyFontWeight = 'light' | 'normal' | 'bold';
|
|
49
|
+
|
|
50
|
+
/**
|
|
51
|
+
* Sets the text alignment.
|
|
52
|
+
*
|
|
53
|
+
* You can use these values:
|
|
54
|
+
* * `left`—text-align: left
|
|
55
|
+
* * `right`—text-align: right
|
|
56
|
+
* * `center`—text-align: center
|
|
57
|
+
* * `justify`—text-align: justify
|
|
58
|
+
*/
|
|
59
|
+
type TypographyTextAlign = 'left' | 'right' | 'center' | 'justify';
|
|
60
|
+
|
|
61
|
+
/**
|
|
62
|
+
* Sets the text transform.
|
|
63
|
+
*
|
|
64
|
+
* You can use these values:
|
|
65
|
+
* * `lowercase`—text-transform: lowercase
|
|
66
|
+
* * `uppercase`—text-transform: uppercase
|
|
67
|
+
* * `capitalize`—text-transform: capitalize
|
|
68
|
+
*/
|
|
69
|
+
type TypographyTextTransform = 'lowercase' | 'uppercase' | 'capitalize';
|
|
70
|
+
|
|
71
|
+
/**
|
|
72
|
+
* Sets the theme color. The default value is set by the Kendo theme.
|
|
73
|
+
*
|
|
74
|
+
* You can use these values:
|
|
75
|
+
* * `inherit`—Uses coloring based on the current color.
|
|
76
|
+
* * `primary`—Uses coloring based on primary theme color.
|
|
77
|
+
* * `secondary`—Uses coloring based on secondary theme color.
|
|
78
|
+
* * `tertiary`—Uses coloring based on tertiary theme color.
|
|
79
|
+
* * `info`—Uses coloring based on info theme color.
|
|
80
|
+
* * `success`—Uses coloring based on success theme color.
|
|
81
|
+
* * `warning`—Uses coloring based on warning theme color.
|
|
82
|
+
* * `error`—Uses coloring based on error theme color.
|
|
83
|
+
* * `dark`—Uses coloring based on dark theme color.
|
|
84
|
+
* * `light`—Uses coloring based on light theme color.
|
|
85
|
+
* * `inverse`—Uses coloring based on inverse theme color.
|
|
86
|
+
*/
|
|
87
|
+
type TypographyThemeColor = 'inherit' | 'primary' | 'secondary' | 'tertiary' | 'info' | 'success' | 'warning' | 'error' | 'dark' | 'light' | 'inverse';
|
|
88
|
+
|
|
89
|
+
/**
|
|
90
|
+
* Applies the available Kendo theme class to the element.
|
|
91
|
+
* You can use these values:
|
|
92
|
+
* * `p`
|
|
93
|
+
* * `h1`
|
|
94
|
+
* * `h2`
|
|
95
|
+
* * `h3`
|
|
96
|
+
* * `h4`
|
|
97
|
+
* * `h5`
|
|
98
|
+
* * `h6`
|
|
99
|
+
* * `code`
|
|
100
|
+
* * `pre`
|
|
101
|
+
*
|
|
102
|
+
* The matching Kendo theme classes are:
|
|
103
|
+
* * `p`—`k-paragraph`
|
|
104
|
+
* * `h1`—`k-h1`
|
|
105
|
+
* * `h2`—`k-h2`
|
|
106
|
+
* * `h3`—`k-h3`
|
|
107
|
+
* * `h4`—`k-h4`
|
|
108
|
+
* * `h5`—`k-h5`
|
|
109
|
+
* * `h6`—`k-h6`
|
|
110
|
+
* * `code`—`k-code`
|
|
111
|
+
* * `pre`—`k-pre`
|
|
112
|
+
*/
|
|
113
|
+
type TypographyVariant = 'p' | 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'code' | 'pre';
|
|
114
|
+
|
|
115
|
+
/**
|
|
116
|
+
* Represents the [Kendo UI Typography directive for Angular](https://www.telerik.com/kendo-angular-ui/components/typography).
|
|
117
|
+
* Use this directive to represent element types in a uniform way by relying on the predefined Kendo theme classes.
|
|
118
|
+
*
|
|
119
|
+
* @example
|
|
120
|
+
* ```html
|
|
121
|
+
* <div kendoTypography variant="k-h1"></div>
|
|
122
|
+
* ```
|
|
123
|
+
*/
|
|
124
|
+
declare class TypographyDirective {
|
|
125
|
+
elementWrapper: ElementRef;
|
|
126
|
+
private renderer;
|
|
127
|
+
private element;
|
|
128
|
+
/**
|
|
129
|
+
* Specifies the element `variant` class that will be applied.
|
|
130
|
+
*/
|
|
131
|
+
set variant(value: TypographyVariant);
|
|
132
|
+
get variant(): TypographyVariant;
|
|
133
|
+
/**
|
|
134
|
+
* Sets the element `font-size` style.
|
|
135
|
+
*/
|
|
136
|
+
set fontSize(value: TypographyFontSize);
|
|
137
|
+
get fontSize(): TypographyFontSize;
|
|
138
|
+
/**
|
|
139
|
+
* Sets the element `font-weight` style.
|
|
140
|
+
*/
|
|
141
|
+
set fontWeight(value: TypographyFontWeight);
|
|
142
|
+
get fontWeight(): TypographyFontWeight;
|
|
143
|
+
/**
|
|
144
|
+
* Sets the element `text-align` style.
|
|
145
|
+
*/
|
|
146
|
+
set textAlign(value: TypographyTextAlign);
|
|
147
|
+
get textAlign(): TypographyTextAlign;
|
|
148
|
+
/**
|
|
149
|
+
* Sets the element `text-transform` style.
|
|
150
|
+
*/
|
|
151
|
+
set textTransform(value: TypographyTextTransform);
|
|
152
|
+
get textTransform(): TypographyTextTransform;
|
|
153
|
+
/**
|
|
154
|
+
* Applies the `theme-color` to the element.
|
|
155
|
+
*/
|
|
156
|
+
set themeColor(value: TypographyThemeColor);
|
|
157
|
+
get themeColor(): TypographyThemeColor;
|
|
158
|
+
private typographyClasses;
|
|
159
|
+
private _variant;
|
|
160
|
+
private _fontSize;
|
|
161
|
+
private _fontWeight;
|
|
162
|
+
private _textAlign;
|
|
163
|
+
private _textTransform;
|
|
164
|
+
private _themeColor;
|
|
165
|
+
constructor(elementWrapper: ElementRef, renderer: Renderer2, element: ElementRef);
|
|
166
|
+
private variantClass;
|
|
167
|
+
private themeColorClass;
|
|
168
|
+
private textAlignClass;
|
|
169
|
+
private fontWeightClass;
|
|
170
|
+
private fontSizeClass;
|
|
171
|
+
private textTransformClass;
|
|
172
|
+
private setTypographyClasses;
|
|
173
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<TypographyDirective, never>;
|
|
174
|
+
static ɵdir: i0.ɵɵDirectiveDeclaration<TypographyDirective, "[kendoTypography]", ["kendoTypography"], { "variant": { "alias": "variant"; "required": false; }; "fontSize": { "alias": "fontSize"; "required": false; }; "fontWeight": { "alias": "fontWeight"; "required": false; }; "textAlign": { "alias": "textAlign"; "required": false; }; "textTransform": { "alias": "textTransform"; "required": false; }; "themeColor": { "alias": "themeColor"; "required": false; }; }, {}, never, never, true, never>;
|
|
175
|
+
}
|
|
176
|
+
|
|
177
|
+
/**
|
|
178
|
+
* Represents the [NgModule](link:site.data.urls.angular['ngmoduleapi'])
|
|
179
|
+
* definition for the Typography component.
|
|
180
|
+
*
|
|
181
|
+
* @example
|
|
182
|
+
*
|
|
183
|
+
* ```ts-no-run
|
|
184
|
+
* // Import the Typography module
|
|
185
|
+
* import { TypographyModule } from '@progress/kendo-angular-typography';
|
|
186
|
+
*
|
|
187
|
+
* // The browser platform with a compiler
|
|
188
|
+
* import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
|
|
189
|
+
*
|
|
190
|
+
* import { NgModule } from '@angular/core';
|
|
191
|
+
*
|
|
192
|
+
* // Import the app component
|
|
193
|
+
* import { AppComponent } from './app.component';
|
|
194
|
+
*
|
|
195
|
+
* // Define the app module
|
|
196
|
+
* _@NgModule({
|
|
197
|
+
* declarations: [AppComponent], // declare app component
|
|
198
|
+
* imports: [BrowserModule, TypographyModule], // import Typography module
|
|
199
|
+
* bootstrap: [AppComponent]
|
|
200
|
+
* })
|
|
201
|
+
* export class AppModule { }
|
|
202
|
+
*
|
|
203
|
+
* // Compile and launch the module
|
|
204
|
+
* platformBrowserDynamic().bootstrapModule(AppModule);
|
|
205
|
+
*
|
|
206
|
+
* ```
|
|
207
|
+
*/
|
|
208
|
+
declare class TypographyModule {
|
|
209
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<TypographyModule, never>;
|
|
210
|
+
static ɵmod: i0.ɵɵNgModuleDeclaration<TypographyModule, never, [typeof TypographyDirective], [typeof TypographyDirective]>;
|
|
211
|
+
static ɵinj: i0.ɵɵInjectorDeclaration<TypographyModule>;
|
|
212
|
+
}
|
|
213
|
+
|
|
214
|
+
/**
|
|
215
|
+
* Use this utility array to access all `@progress/kendo-angular-typography`-related components and directives in a standalone Angular component.
|
|
216
|
+
*
|
|
217
|
+
* @example
|
|
218
|
+
* ```typescript
|
|
219
|
+
* import { Component } from '@angular/core';
|
|
220
|
+
* import { KENDO_TYPOGRAPHY } from '@progress/kendo-angular-typography';
|
|
221
|
+
*
|
|
222
|
+
* @Component({
|
|
223
|
+
* selector: 'my-app',
|
|
224
|
+
* standalone: true,
|
|
225
|
+
* imports: [KENDO_TYPOGRAPHY],
|
|
226
|
+
* template: `<div kendoTypography variant="k-h1"></div>`
|
|
227
|
+
* })
|
|
228
|
+
* export class AppComponent {}
|
|
229
|
+
* ```
|
|
230
|
+
*/
|
|
231
|
+
declare const KENDO_TYPOGRAPHY: readonly [typeof TypographyDirective];
|
|
232
|
+
|
|
233
|
+
export { KENDO_TYPOGRAPHY, TypographyDirective, TypographyModule };
|
|
234
|
+
export type { TypographyFontSize, TypographyFontWeight, TypographyTextAlign, TypographyTextTransform, TypographyThemeColor, TypographyVariant };
|
package/package-metadata.mjs
CHANGED
|
@@ -7,7 +7,7 @@ export const packageMetadata = {
|
|
|
7
7
|
"productCodes": [
|
|
8
8
|
"KENDOUIANGULAR"
|
|
9
9
|
],
|
|
10
|
-
"publishDate":
|
|
11
|
-
"version": "
|
|
10
|
+
"publishDate": 1785318085,
|
|
11
|
+
"version": "25.0.0-develop.12",
|
|
12
12
|
"licensingDocsUrl": "https://www.telerik.com/kendo-angular-ui/my-license/"
|
|
13
13
|
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@progress/kendo-angular-typography",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "25.0.0-develop.12",
|
|
4
4
|
"description": "Kendo UI Angular Typography",
|
|
5
5
|
"license": "SEE LICENSE IN LICENSE.md",
|
|
6
6
|
"author": "Progress",
|
|
@@ -19,22 +19,22 @@
|
|
|
19
19
|
"package": {
|
|
20
20
|
"productName": "Kendo UI for Angular",
|
|
21
21
|
"productCode": "KENDOUIANGULAR",
|
|
22
|
-
"publishDate":
|
|
22
|
+
"publishDate": 1785318085,
|
|
23
23
|
"licensingDocsUrl": "https://www.telerik.com/kendo-angular-ui/my-license/"
|
|
24
24
|
}
|
|
25
25
|
},
|
|
26
26
|
"peerDependencies": {
|
|
27
|
-
"@angular/animations": "
|
|
28
|
-
"@angular/common": "
|
|
29
|
-
"@angular/core": "
|
|
30
|
-
"@angular/platform-browser": "
|
|
27
|
+
"@angular/animations": "20 - 22",
|
|
28
|
+
"@angular/common": "20 - 22",
|
|
29
|
+
"@angular/core": "20 - 22",
|
|
30
|
+
"@angular/platform-browser": "20 - 22",
|
|
31
31
|
"@progress/kendo-licensing": "^1.11.0",
|
|
32
|
-
"@progress/kendo-angular-common": "
|
|
32
|
+
"@progress/kendo-angular-common": "25.0.0-develop.12",
|
|
33
33
|
"rxjs": "^6.5.3 || ^7.0.0"
|
|
34
34
|
},
|
|
35
35
|
"dependencies": {
|
|
36
36
|
"tslib": "^2.3.1",
|
|
37
|
-
"@progress/kendo-angular-schematics": "
|
|
37
|
+
"@progress/kendo-angular-schematics": "25.0.0-develop.12"
|
|
38
38
|
},
|
|
39
39
|
"schematics": "./schematics/collection.json",
|
|
40
40
|
"module": "fesm2022/progress-kendo-angular-typography.mjs",
|
package/directives.d.ts
DELETED
|
@@ -1,23 +0,0 @@
|
|
|
1
|
-
/**-----------------------------------------------------------------------------------------
|
|
2
|
-
* Copyright © 2026 Progress Software Corporation. All rights reserved.
|
|
3
|
-
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
|
-
*-------------------------------------------------------------------------------------------*/
|
|
5
|
-
import { TypographyDirective } from "./typography.directive";
|
|
6
|
-
/**
|
|
7
|
-
* Use this utility array to access all `@progress/kendo-angular-typography`-related components and directives in a standalone Angular component.
|
|
8
|
-
*
|
|
9
|
-
* @example
|
|
10
|
-
* ```typescript
|
|
11
|
-
* import { Component } from '@angular/core';
|
|
12
|
-
* import { KENDO_TYPOGRAPHY } from '@progress/kendo-angular-typography';
|
|
13
|
-
*
|
|
14
|
-
* @Component({
|
|
15
|
-
* selector: 'my-app',
|
|
16
|
-
* standalone: true,
|
|
17
|
-
* imports: [KENDO_TYPOGRAPHY],
|
|
18
|
-
* template: `<div kendoTypography variant="k-h1"></div>`
|
|
19
|
-
* })
|
|
20
|
-
* export class AppComponent {}
|
|
21
|
-
* ```
|
|
22
|
-
*/
|
|
23
|
-
export declare const KENDO_TYPOGRAPHY: readonly [typeof TypographyDirective];
|
package/models/font-size.d.ts
DELETED
|
@@ -1,45 +0,0 @@
|
|
|
1
|
-
/**-----------------------------------------------------------------------------------------
|
|
2
|
-
* Copyright © 2026 Progress Software Corporation. All rights reserved.
|
|
3
|
-
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
|
-
*-------------------------------------------------------------------------------------------*/
|
|
5
|
-
/**
|
|
6
|
-
* Sets the font size.
|
|
7
|
-
* You can use these values:
|
|
8
|
-
* * `xs`
|
|
9
|
-
* * `sm`
|
|
10
|
-
* * `md`
|
|
11
|
-
* * `lg`
|
|
12
|
-
* * `xl`
|
|
13
|
-
*
|
|
14
|
-
* The matching styles for the Default Kendo theme are:
|
|
15
|
-
* * `xs`—font-size: 10px
|
|
16
|
-
* * `sm`—font-size: 12px
|
|
17
|
-
* * `md`—font-size: 16px
|
|
18
|
-
* * `lg`—font-size: 18px
|
|
19
|
-
* * `xl`—font-size: 20px
|
|
20
|
-
*
|
|
21
|
-
* The matching styles for the Bootstrap Kendo theme are:
|
|
22
|
-
* * `xs`—font-size: 0.75rem
|
|
23
|
-
* * `sm`—font-size: 0.875rem
|
|
24
|
-
* * `md`—font-size: 1rem
|
|
25
|
-
* * `lg`—font-size: 1.25rem
|
|
26
|
-
* * `xl`—font-size: 1.5rem
|
|
27
|
-
*
|
|
28
|
-
* The matching styles for the Material Kendo theme are:
|
|
29
|
-
* * `xs`—font-size: 10px
|
|
30
|
-
* * `sm`—font-size: 12px
|
|
31
|
-
* * `md`—font-size: 14px
|
|
32
|
-
* * `lg`—font-size: 16px
|
|
33
|
-
* * `xl`—font-size: 20px
|
|
34
|
-
*/
|
|
35
|
-
export type TypographyFontSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
|
|
36
|
-
/**
|
|
37
|
-
* @hidden
|
|
38
|
-
*/
|
|
39
|
-
export declare const typographyFontSizeOptions: {
|
|
40
|
-
xs: string;
|
|
41
|
-
sm: string;
|
|
42
|
-
md: string;
|
|
43
|
-
lg: string;
|
|
44
|
-
xl: string;
|
|
45
|
-
};
|
package/models/font-weight.d.ts
DELETED
|
@@ -1,21 +0,0 @@
|
|
|
1
|
-
/**-----------------------------------------------------------------------------------------
|
|
2
|
-
* Copyright © 2026 Progress Software Corporation. All rights reserved.
|
|
3
|
-
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
|
-
*-------------------------------------------------------------------------------------------*/
|
|
5
|
-
/**
|
|
6
|
-
* Sets the font weight.
|
|
7
|
-
*
|
|
8
|
-
* You can use these values:
|
|
9
|
-
* * `light`—font-weight: 300
|
|
10
|
-
* * `normal`—font-weight: 400
|
|
11
|
-
* * `bold`—font-weight: 700 (for Default and Bootstrap themes); font-weight: 500 (for Material theme)
|
|
12
|
-
*/
|
|
13
|
-
export type TypographyFontWeight = 'light' | 'normal' | 'bold';
|
|
14
|
-
/**
|
|
15
|
-
* @hidden
|
|
16
|
-
*/
|
|
17
|
-
export declare const typographyFontWeightOptions: {
|
|
18
|
-
light: string;
|
|
19
|
-
normal: string;
|
|
20
|
-
bold: string;
|
|
21
|
-
};
|
package/models/text-align.d.ts
DELETED
|
@@ -1,23 +0,0 @@
|
|
|
1
|
-
/**-----------------------------------------------------------------------------------------
|
|
2
|
-
* Copyright © 2026 Progress Software Corporation. All rights reserved.
|
|
3
|
-
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
|
-
*-------------------------------------------------------------------------------------------*/
|
|
5
|
-
/**
|
|
6
|
-
* Sets the text alignment.
|
|
7
|
-
*
|
|
8
|
-
* You can use these values:
|
|
9
|
-
* * `left`—text-align: left
|
|
10
|
-
* * `right`—text-align: right
|
|
11
|
-
* * `center`—text-align: center
|
|
12
|
-
* * `justify`—text-align: justify
|
|
13
|
-
*/
|
|
14
|
-
export type TypographyTextAlign = 'left' | 'right' | 'center' | 'justify';
|
|
15
|
-
/**
|
|
16
|
-
* @hidden
|
|
17
|
-
*/
|
|
18
|
-
export declare const typographyTextAlignOptions: {
|
|
19
|
-
left: string;
|
|
20
|
-
right: string;
|
|
21
|
-
center: string;
|
|
22
|
-
justify: string;
|
|
23
|
-
};
|
|
@@ -1,21 +0,0 @@
|
|
|
1
|
-
/**-----------------------------------------------------------------------------------------
|
|
2
|
-
* Copyright © 2026 Progress Software Corporation. All rights reserved.
|
|
3
|
-
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
|
-
*-------------------------------------------------------------------------------------------*/
|
|
5
|
-
/**
|
|
6
|
-
* Sets the text transform.
|
|
7
|
-
*
|
|
8
|
-
* You can use these values:
|
|
9
|
-
* * `lowercase`—text-transform: lowercase
|
|
10
|
-
* * `uppercase`—text-transform: uppercase
|
|
11
|
-
* * `capitalize`—text-transform: capitalize
|
|
12
|
-
*/
|
|
13
|
-
export type TypographyTextTransform = 'lowercase' | 'uppercase' | 'capitalize';
|
|
14
|
-
/**
|
|
15
|
-
* @hidden
|
|
16
|
-
*/
|
|
17
|
-
export declare const typographyTextTransformOptions: {
|
|
18
|
-
lowercase: string;
|
|
19
|
-
uppercase: string;
|
|
20
|
-
capitalize: string;
|
|
21
|
-
};
|
package/models/theme-color.d.ts
DELETED
|
@@ -1,21 +0,0 @@
|
|
|
1
|
-
/**-----------------------------------------------------------------------------------------
|
|
2
|
-
* Copyright © 2026 Progress Software Corporation. All rights reserved.
|
|
3
|
-
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
|
-
*-------------------------------------------------------------------------------------------*/
|
|
5
|
-
/**
|
|
6
|
-
* Sets the theme color. The default value is set by the Kendo theme.
|
|
7
|
-
*
|
|
8
|
-
* You can use these values:
|
|
9
|
-
* * `inherit`—Uses coloring based on the current color.
|
|
10
|
-
* * `primary`—Uses coloring based on primary theme color.
|
|
11
|
-
* * `secondary`—Uses coloring based on secondary theme color.
|
|
12
|
-
* * `tertiary`—Uses coloring based on tertiary theme color.
|
|
13
|
-
* * `info`—Uses coloring based on info theme color.
|
|
14
|
-
* * `success`—Uses coloring based on success theme color.
|
|
15
|
-
* * `warning`—Uses coloring based on warning theme color.
|
|
16
|
-
* * `error`—Uses coloring based on error theme color.
|
|
17
|
-
* * `dark`—Uses coloring based on dark theme color.
|
|
18
|
-
* * `light`—Uses coloring based on light theme color.
|
|
19
|
-
* * `inverse`—Uses coloring based on inverse theme color.
|
|
20
|
-
*/
|
|
21
|
-
export type TypographyThemeColor = 'inherit' | 'primary' | 'secondary' | 'tertiary' | 'info' | 'success' | 'warning' | 'error' | 'dark' | 'light' | 'inverse';
|
package/models/variant.d.ts
DELETED
|
@@ -1,43 +0,0 @@
|
|
|
1
|
-
/**-----------------------------------------------------------------------------------------
|
|
2
|
-
* Copyright © 2026 Progress Software Corporation. All rights reserved.
|
|
3
|
-
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
|
-
*-------------------------------------------------------------------------------------------*/
|
|
5
|
-
/**
|
|
6
|
-
* Applies the available Kendo theme class to the element.
|
|
7
|
-
* You can use these values:
|
|
8
|
-
* * `p`
|
|
9
|
-
* * `h1`
|
|
10
|
-
* * `h2`
|
|
11
|
-
* * `h3`
|
|
12
|
-
* * `h4`
|
|
13
|
-
* * `h5`
|
|
14
|
-
* * `h6`
|
|
15
|
-
* * `code`
|
|
16
|
-
* * `pre`
|
|
17
|
-
*
|
|
18
|
-
* The matching Kendo theme classes are:
|
|
19
|
-
* * `p`—`k-paragraph`
|
|
20
|
-
* * `h1`—`k-h1`
|
|
21
|
-
* * `h2`—`k-h2`
|
|
22
|
-
* * `h3`—`k-h3`
|
|
23
|
-
* * `h4`—`k-h4`
|
|
24
|
-
* * `h5`—`k-h5`
|
|
25
|
-
* * `h6`—`k-h6`
|
|
26
|
-
* * `code`—`k-code`
|
|
27
|
-
* * `pre`—`k-pre`
|
|
28
|
-
*/
|
|
29
|
-
export type TypographyVariant = 'p' | 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'code' | 'pre';
|
|
30
|
-
/**
|
|
31
|
-
* @hidden
|
|
32
|
-
*/
|
|
33
|
-
export declare const typographyVariantOptions: {
|
|
34
|
-
p: string;
|
|
35
|
-
h1: string;
|
|
36
|
-
h2: string;
|
|
37
|
-
h3: string;
|
|
38
|
-
h4: string;
|
|
39
|
-
h5: string;
|
|
40
|
-
h6: string;
|
|
41
|
-
code: string;
|
|
42
|
-
pre: string;
|
|
43
|
-
};
|
package/package-metadata.d.ts
DELETED
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
/**-----------------------------------------------------------------------------------------
|
|
2
|
-
* Copyright © 2026 Progress Software Corporation. All rights reserved.
|
|
3
|
-
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
|
-
*-------------------------------------------------------------------------------------------*/
|
|
5
|
-
import { type PackageMetadata } from '@progress/kendo-licensing';
|
|
6
|
-
/**
|
|
7
|
-
* @hidden
|
|
8
|
-
*/
|
|
9
|
-
export declare const packageMetadata: PackageMetadata;
|
|
@@ -1,62 +0,0 @@
|
|
|
1
|
-
/**-----------------------------------------------------------------------------------------
|
|
2
|
-
* Copyright © 2026 Progress Software Corporation. All rights reserved.
|
|
3
|
-
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
|
-
*-------------------------------------------------------------------------------------------*/
|
|
5
|
-
import { ElementRef, Renderer2, OnChanges } from '@angular/core';
|
|
6
|
-
import { TypographyFontSize } from './models/font-size';
|
|
7
|
-
import { TypographyFontWeight } from './models/font-weight';
|
|
8
|
-
import { TypographyTextAlign } from './models/text-align';
|
|
9
|
-
import { TypographyTextTransform } from './models/text-transform';
|
|
10
|
-
import { TypographyThemeColor } from './models/theme-color';
|
|
11
|
-
import { TypographyVariant } from './models/variant';
|
|
12
|
-
import * as i0 from "@angular/core";
|
|
13
|
-
/**
|
|
14
|
-
* Represents the [Kendo UI Typography directive for Angular](https://www.telerik.com/kendo-angular-ui/components/typography).
|
|
15
|
-
* Use this directive to represent element types in a uniform way by relying on the predefined Kendo theme classes.
|
|
16
|
-
*
|
|
17
|
-
* @example
|
|
18
|
-
* ```html
|
|
19
|
-
* <div kendoTypography variant="k-h1"></div>
|
|
20
|
-
* ```
|
|
21
|
-
*/
|
|
22
|
-
export declare class TypographyDirective implements OnChanges {
|
|
23
|
-
elementWrapper: ElementRef;
|
|
24
|
-
private renderer;
|
|
25
|
-
private element;
|
|
26
|
-
/**
|
|
27
|
-
* Specifies the element `variant` class that will be applied.
|
|
28
|
-
*/
|
|
29
|
-
variant: TypographyVariant;
|
|
30
|
-
/**
|
|
31
|
-
* Sets the element `font-size` style.
|
|
32
|
-
*/
|
|
33
|
-
fontSize: TypographyFontSize;
|
|
34
|
-
/**
|
|
35
|
-
* Sets the element `font-weight` style.
|
|
36
|
-
*/
|
|
37
|
-
fontWeight: TypographyFontWeight;
|
|
38
|
-
/**
|
|
39
|
-
* Sets the element `text-align` style.
|
|
40
|
-
*/
|
|
41
|
-
textAlign: TypographyTextAlign;
|
|
42
|
-
/**
|
|
43
|
-
* Sets the element `text-transform` style.
|
|
44
|
-
*/
|
|
45
|
-
textTransform: TypographyTextTransform;
|
|
46
|
-
/**
|
|
47
|
-
* Applies the `theme-color` to the element.
|
|
48
|
-
*/
|
|
49
|
-
themeColor: TypographyThemeColor;
|
|
50
|
-
private typographyClasses;
|
|
51
|
-
constructor(elementWrapper: ElementRef, renderer: Renderer2, element: ElementRef);
|
|
52
|
-
ngOnChanges(): void;
|
|
53
|
-
private variantClass;
|
|
54
|
-
private themeColorClass;
|
|
55
|
-
private textAlignClass;
|
|
56
|
-
private fontWeightClass;
|
|
57
|
-
private fontSizeClass;
|
|
58
|
-
private textTransformClass;
|
|
59
|
-
private setTypographyClasses;
|
|
60
|
-
static ɵfac: i0.ɵɵFactoryDeclaration<TypographyDirective, never>;
|
|
61
|
-
static ɵdir: i0.ɵɵDirectiveDeclaration<TypographyDirective, "[kendoTypography]", ["kendoTypography"], { "variant": { "alias": "variant"; "required": false; }; "fontSize": { "alias": "fontSize"; "required": false; }; "fontWeight": { "alias": "fontWeight"; "required": false; }; "textAlign": { "alias": "textAlign"; "required": false; }; "textTransform": { "alias": "textTransform"; "required": false; }; "themeColor": { "alias": "themeColor"; "required": false; }; }, {}, never, never, true, never>;
|
|
62
|
-
}
|
package/typography.module.d.ts
DELETED
|
@@ -1,42 +0,0 @@
|
|
|
1
|
-
/**-----------------------------------------------------------------------------------------
|
|
2
|
-
* Copyright © 2026 Progress Software Corporation. All rights reserved.
|
|
3
|
-
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
|
-
*-------------------------------------------------------------------------------------------*/
|
|
5
|
-
import * as i0 from "@angular/core";
|
|
6
|
-
import * as i1 from "./typography.directive";
|
|
7
|
-
/**
|
|
8
|
-
* Represents the [NgModule](link:site.data.urls.angular['ngmoduleapi'])
|
|
9
|
-
* definition for the Typography component.
|
|
10
|
-
*
|
|
11
|
-
* @example
|
|
12
|
-
*
|
|
13
|
-
* ```ts-no-run
|
|
14
|
-
* // Import the Typography module
|
|
15
|
-
* import { TypographyModule } from '@progress/kendo-angular-typography';
|
|
16
|
-
*
|
|
17
|
-
* // The browser platform with a compiler
|
|
18
|
-
* import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
|
|
19
|
-
*
|
|
20
|
-
* import { NgModule } from '@angular/core';
|
|
21
|
-
*
|
|
22
|
-
* // Import the app component
|
|
23
|
-
* import { AppComponent } from './app.component';
|
|
24
|
-
*
|
|
25
|
-
* // Define the app module
|
|
26
|
-
* _@NgModule({
|
|
27
|
-
* declarations: [AppComponent], // declare app component
|
|
28
|
-
* imports: [BrowserModule, TypographyModule], // import Typography module
|
|
29
|
-
* bootstrap: [AppComponent]
|
|
30
|
-
* })
|
|
31
|
-
* export class AppModule { }
|
|
32
|
-
*
|
|
33
|
-
* // Compile and launch the module
|
|
34
|
-
* platformBrowserDynamic().bootstrapModule(AppModule);
|
|
35
|
-
*
|
|
36
|
-
* ```
|
|
37
|
-
*/
|
|
38
|
-
export declare class TypographyModule {
|
|
39
|
-
static ɵfac: i0.ɵɵFactoryDeclaration<TypographyModule, never>;
|
|
40
|
-
static ɵmod: i0.ɵɵNgModuleDeclaration<TypographyModule, never, [typeof i1.TypographyDirective], [typeof i1.TypographyDirective]>;
|
|
41
|
-
static ɵinj: i0.ɵɵInjectorDeclaration<TypographyModule>;
|
|
42
|
-
}
|
package/utils.d.ts
DELETED
|
@@ -1,8 +0,0 @@
|
|
|
1
|
-
/**-----------------------------------------------------------------------------------------
|
|
2
|
-
* Copyright © 2026 Progress Software Corporation. All rights reserved.
|
|
3
|
-
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
|
-
*-------------------------------------------------------------------------------------------*/
|
|
5
|
-
/**
|
|
6
|
-
* @hidden
|
|
7
|
-
*/
|
|
8
|
-
export declare const isPresent: (value: any) => boolean;
|