@porsche-design-system/components-angular 4.0.0-rc.0 → 4.0.0-rc.1
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/CHANGELOG.md +65 -0
- package/fesm2022/porsche-design-system-components-angular.mjs +3 -2
- package/fesm2022/porsche-design-system-components-angular.mjs.map +1 -1
- package/global-styles/cn/index.css +1 -0
- package/global-styles/index.css +1 -0
- package/global-styles/variables.css +1 -0
- package/package.json +4 -2
- package/tailwindcss/index.css +73 -14
- package/types/porsche-design-system-components-angular.d.ts +8 -2
- package/vanilla-extract/cjs/index.cjs +14 -0
- package/vanilla-extract/cjs/spacing/spacingStatic2Xs.cjs +7 -0
- package/vanilla-extract/cjs/tokens/dist/esm/spacing/static/spacingStatic2Xs.cjs +5 -0
- package/vanilla-extract/cjs/typography/proseHeading2XlStyle.cjs +7 -5
- package/vanilla-extract/cjs/typography/proseHeading2XsStyle.cjs +14 -0
- package/vanilla-extract/cjs/typography/proseHeading3XlStyle.cjs +7 -5
- package/vanilla-extract/cjs/typography/proseHeading4XlStyle.cjs +7 -5
- package/vanilla-extract/cjs/typography/proseHeading5XlStyle.cjs +7 -5
- package/vanilla-extract/cjs/typography/proseHeadingLgStyle.cjs +7 -5
- package/vanilla-extract/cjs/typography/proseHeadingMdStyle.cjs +7 -5
- package/vanilla-extract/cjs/typography/proseHeadingSmStyle.cjs +7 -5
- package/vanilla-extract/cjs/typography/proseHeadingXlStyle.cjs +7 -5
- package/vanilla-extract/cjs/typography/proseHeadingXsStyle.cjs +14 -0
- package/vanilla-extract/cjs/typography/proseText2XlStyle.cjs +14 -0
- package/vanilla-extract/cjs/typography/proseText2XsStyle.cjs +7 -5
- package/vanilla-extract/cjs/typography/proseText3XlStyle.cjs +14 -0
- package/vanilla-extract/cjs/typography/proseText4XlStyle.cjs +14 -0
- package/vanilla-extract/cjs/typography/proseText5XlStyle.cjs +14 -0
- package/vanilla-extract/cjs/typography/proseTextLgStyle.cjs +7 -5
- package/vanilla-extract/cjs/typography/proseTextMdStyle.cjs +7 -5
- package/vanilla-extract/cjs/typography/proseTextSmStyle.cjs +7 -5
- package/vanilla-extract/cjs/typography/proseTextXlStyle.cjs +7 -5
- package/vanilla-extract/cjs/typography/proseTextXsStyle.cjs +7 -5
- package/vanilla-extract/esm/index.mjs +7 -0
- package/vanilla-extract/esm/spacing/index.d.ts +1 -0
- package/vanilla-extract/esm/spacing/spacingStatic2Xs.d.ts +1 -0
- package/vanilla-extract/esm/spacing/spacingStatic2Xs.mjs +5 -0
- package/vanilla-extract/esm/tokens/dist/esm/spacing/static/spacingStatic2Xs.mjs +3 -0
- package/vanilla-extract/esm/typography/index.d.ts +6 -0
- package/vanilla-extract/esm/typography/proseHeading2XlStyle.d.ts +1 -0
- package/vanilla-extract/esm/typography/proseHeading2XlStyle.mjs +7 -5
- package/vanilla-extract/esm/typography/proseHeading2XsStyle.d.ts +4 -0
- package/vanilla-extract/esm/typography/proseHeading2XsStyle.mjs +12 -0
- package/vanilla-extract/esm/typography/proseHeading3XlStyle.d.ts +1 -0
- package/vanilla-extract/esm/typography/proseHeading3XlStyle.mjs +7 -5
- package/vanilla-extract/esm/typography/proseHeading4XlStyle.d.ts +1 -0
- package/vanilla-extract/esm/typography/proseHeading4XlStyle.mjs +7 -5
- package/vanilla-extract/esm/typography/proseHeading5XlStyle.d.ts +1 -0
- package/vanilla-extract/esm/typography/proseHeading5XlStyle.mjs +7 -5
- package/vanilla-extract/esm/typography/proseHeadingLgStyle.d.ts +1 -0
- package/vanilla-extract/esm/typography/proseHeadingLgStyle.mjs +7 -5
- package/vanilla-extract/esm/typography/proseHeadingMdStyle.d.ts +1 -0
- package/vanilla-extract/esm/typography/proseHeadingMdStyle.mjs +7 -5
- package/vanilla-extract/esm/typography/proseHeadingSmStyle.d.ts +1 -0
- package/vanilla-extract/esm/typography/proseHeadingSmStyle.mjs +7 -5
- package/vanilla-extract/esm/typography/proseHeadingXlStyle.d.ts +1 -0
- package/vanilla-extract/esm/typography/proseHeadingXlStyle.mjs +7 -5
- package/vanilla-extract/esm/typography/proseHeadingXsStyle.d.ts +4 -0
- package/vanilla-extract/esm/typography/proseHeadingXsStyle.mjs +12 -0
- package/vanilla-extract/esm/typography/proseText2XlStyle.d.ts +4 -0
- package/vanilla-extract/esm/typography/proseText2XlStyle.mjs +12 -0
- package/vanilla-extract/esm/typography/proseText2XsStyle.d.ts +1 -0
- package/vanilla-extract/esm/typography/proseText2XsStyle.mjs +7 -5
- package/vanilla-extract/esm/typography/proseText3XlStyle.d.ts +4 -0
- package/vanilla-extract/esm/typography/proseText3XlStyle.mjs +12 -0
- package/vanilla-extract/esm/typography/proseText4XlStyle.d.ts +4 -0
- package/vanilla-extract/esm/typography/proseText4XlStyle.mjs +12 -0
- package/vanilla-extract/esm/typography/proseText5XlStyle.d.ts +4 -0
- package/vanilla-extract/esm/typography/proseText5XlStyle.mjs +12 -0
- package/vanilla-extract/esm/typography/proseTextLgStyle.d.ts +1 -0
- package/vanilla-extract/esm/typography/proseTextLgStyle.mjs +7 -5
- package/vanilla-extract/esm/typography/proseTextMdStyle.d.ts +1 -0
- package/vanilla-extract/esm/typography/proseTextMdStyle.mjs +7 -5
- package/vanilla-extract/esm/typography/proseTextSmStyle.d.ts +1 -0
- package/vanilla-extract/esm/typography/proseTextSmStyle.mjs +7 -5
- package/vanilla-extract/esm/typography/proseTextXlStyle.d.ts +1 -0
- package/vanilla-extract/esm/typography/proseTextXlStyle.mjs +7 -5
- package/vanilla-extract/esm/typography/proseTextXsStyle.d.ts +1 -0
- package/vanilla-extract/esm/typography/proseTextXsStyle.mjs +7 -5
package/CHANGELOG.md
CHANGED
|
@@ -14,6 +14,68 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0),
|
|
|
14
14
|
|
|
15
15
|
## [Unreleased]
|
|
16
16
|
|
|
17
|
+
## [4.0.0-rc.1] - 2026-04-07
|
|
18
|
+
|
|
19
|
+
### Added
|
|
20
|
+
|
|
21
|
+
- `Banner`:
|
|
22
|
+
- Prop `position` with values: `BreakpointCustomizable<'top' | 'bottom'>` (default: `{ base: 'bottom', s: 'top' }`)
|
|
23
|
+
([#4264](https://github.com/porsche-design-system/porsche-design-system/pull/4264))
|
|
24
|
+
- CSS Variable `--p-banner-top`: Defines the distance from the top of the viewport. Only takes effect when the
|
|
25
|
+
`position` property is set to `top` (at the respective breakpoint).
|
|
26
|
+
([#4264](https://github.com/porsche-design-system/porsche-design-system/pull/4264))
|
|
27
|
+
- CSS Variable `--p-banner-bottom`: Defines the distance from the bottom of the viewport. Only takes effect when the
|
|
28
|
+
`position` property is set to `bottom` (at the respective breakpoint).
|
|
29
|
+
([#4264](https://github.com/porsche-design-system/porsche-design-system/pull/4264))
|
|
30
|
+
- CSS Variable `--p-banner-max-w`: Defines the maximum width of the banner.
|
|
31
|
+
([#4264](https://github.com/porsche-design-system/porsche-design-system/pull/4264))
|
|
32
|
+
- CSS Variable `--p-banner-inset-x`: Defines the horizontal offset of the banner from the edges of the viewport.
|
|
33
|
+
([#4264](https://github.com/porsche-design-system/porsche-design-system/pull/4264))
|
|
34
|
+
- `Tailwind CSS`: `--spacing-static-2xs`
|
|
35
|
+
([#4262](https://github.com/porsche-design-system/porsche-design-system/pull/4262))
|
|
36
|
+
- `SCSS`: `$spacing-static-2xs` ([#4262](https://github.com/porsche-design-system/porsche-design-system/pull/4262))
|
|
37
|
+
- `Tokens`, `Emotion`, `Vanilla Extract`: `spacingStatic2xs`
|
|
38
|
+
([#4262](https://github.com/porsche-design-system/porsche-design-system/pull/4262))
|
|
39
|
+
|
|
40
|
+
### Changed
|
|
41
|
+
|
|
42
|
+
- `Banner`, `Inline Notification`: Improve visual appearance
|
|
43
|
+
([#4264](https://github.com/porsche-design-system/porsche-design-system/pull/4264))
|
|
44
|
+
- `Banner`: `max-width` is now `100ch` by default to increase readability. Use CSS Variable `--p-banner-max-w` and
|
|
45
|
+
`--p-banner-inset-x` to set custom `max-width` and horizontal offset.
|
|
46
|
+
([#4264](https://github.com/porsche-design-system/porsche-design-system/pull/4264))
|
|
47
|
+
- `SCSS`:
|
|
48
|
+
- All `prose-heading-*` and `prose-text-*` mixins set `color` to the primary token by default, overridable via the CSS
|
|
49
|
+
cascade ([#4262](https://github.com/porsche-design-system/porsche-design-system/pull/4262))
|
|
50
|
+
- `Emotion`, `Vanilla Extract`:
|
|
51
|
+
- All `proseHeading*` and `proseText*` style objects set `color` to the primary token by default, overridable in your
|
|
52
|
+
own styles ([#4262](https://github.com/porsche-design-system/porsche-design-system/pull/4262))
|
|
53
|
+
|
|
54
|
+
### Fixed
|
|
55
|
+
|
|
56
|
+
- `Accordion`: summary overlapping details when custom padding is applied
|
|
57
|
+
([#4263](https://github.com/porsche-design-system/porsche-design-system/pull/4263))
|
|
58
|
+
- `Scroller`: mask not rendering on ios when `scrollbar` set to `true`
|
|
59
|
+
([#4263](https://github.com/porsche-design-system/porsche-design-system/pull/4263))
|
|
60
|
+
- `Modal`, `Sheet`: visual bug in the corner when scrolled
|
|
61
|
+
([#4272](https://github.com/porsche-design-system/porsche-design-system/pull/4272))
|
|
62
|
+
- `Model Signature`: `--p-model-signature-color` not working with gradients
|
|
63
|
+
([#4272](https://github.com/porsche-design-system/porsche-design-system/pull/4272))
|
|
64
|
+
- `Tabs Bar`: flickering of active tab in certain cases
|
|
65
|
+
([#4263](https://github.com/porsche-design-system/porsche-design-system/pull/4263))
|
|
66
|
+
- Global Styles: missing individual export for `color-scheme.css`
|
|
67
|
+
([#4260](https://github.com/porsche-design-system/porsche-design-system/pull/4260))
|
|
68
|
+
- `Table`: double focus outline of sort buttons
|
|
69
|
+
([#4270](https://github.com/porsche-design-system/porsche-design-system/pull/4270))
|
|
70
|
+
|
|
71
|
+
### Deprecated
|
|
72
|
+
|
|
73
|
+
- `Banner`:
|
|
74
|
+
- CSS Variable `--p-banner-position-top` (use `--p-banner-top` instead)
|
|
75
|
+
([#4264](https://github.com/porsche-design-system/porsche-design-system/pull/4264))
|
|
76
|
+
- CSS Variable `--p-banner-position-bottom` (use `--p-banner-bottom` instead)
|
|
77
|
+
([#4264](https://github.com/porsche-design-system/porsche-design-system/pull/4264))
|
|
78
|
+
|
|
17
79
|
## [4.0.0-rc.0] - 2026-03-27
|
|
18
80
|
|
|
19
81
|
## [4.0.0-beta.4] - 2026-03-25
|
|
@@ -61,6 +123,9 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0),
|
|
|
61
123
|
|
|
62
124
|
### Added
|
|
63
125
|
|
|
126
|
+
- Storefront: documentation for integrating Porsche Design System with AI coding assistants like GitHub Copilot and
|
|
127
|
+
Cursor to generate accessible code that follows WCAG 2.2 AA standards.
|
|
128
|
+
([#4147](https://github.com/porsche-design-system/porsche-design-system/pull/4147))
|
|
64
129
|
- `Tokens`: `typescale3Xl`, `typescale4Xl`, `typescale5Xl`
|
|
65
130
|
([#4246](https://github.com/porsche-design-system/porsche-design-system/pull/4246))
|
|
66
131
|
- `Tailwind CSS`: `--text-3xl`, `--text-4xl`, `--text-5xl`, `.prose-heading-3xl`, `.prose-heading-4xl`,
|
|
@@ -59,17 +59,18 @@ class PBanner extends BaseComponent {
|
|
|
59
59
|
heading;
|
|
60
60
|
headingTag;
|
|
61
61
|
open;
|
|
62
|
+
position;
|
|
62
63
|
state;
|
|
63
64
|
dismiss = new EventEmitter();
|
|
64
65
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: PBanner, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
65
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.1", type: PBanner, isStandalone: false, selector: "p-banner,[p-banner]", inputs: { description: "description", dismissButton: "dismissButton", heading: "heading", headingTag: "headingTag", open: "open", state: "state" }, outputs: { dismiss: "dismiss" }, usesInheritance: true, ngImport: i0, template: '<ng-content />', isInline: true });
|
|
66
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.1", type: PBanner, isStandalone: false, selector: "p-banner,[p-banner]", inputs: { description: "description", dismissButton: "dismissButton", heading: "heading", headingTag: "headingTag", open: "open", position: "position", state: "state" }, outputs: { dismiss: "dismiss" }, usesInheritance: true, ngImport: i0, template: '<ng-content />', isInline: true });
|
|
66
67
|
}
|
|
67
68
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: PBanner, decorators: [{
|
|
68
69
|
type: Component,
|
|
69
70
|
args: [{
|
|
70
71
|
selector: 'p-banner,[p-banner]',
|
|
71
72
|
template: '<ng-content />',
|
|
72
|
-
inputs: ['description', 'dismissButton', 'heading', 'headingTag', 'open', 'state'],
|
|
73
|
+
inputs: ['description', 'dismissButton', 'heading', 'headingTag', 'open', 'position', 'state'],
|
|
73
74
|
outputs: ['dismiss'],
|
|
74
75
|
standalone: false
|
|
75
76
|
}]
|