@porsche-design-system/components-react 3.1.0-rc.1 → 3.1.0-rc.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (92) hide show
  1. package/CHANGELOG.md +20 -0
  2. package/esm/lib/components/flyout.wrapper.js +23 -0
  3. package/esm/public-api.js +1 -0
  4. package/lib/components/flyout.wrapper.d.ts +48 -0
  5. package/lib/components/flyout.wrapper.js +25 -0
  6. package/lib/components/index.d.ts +1 -0
  7. package/lib/types.d.ts +9 -0
  8. package/package.json +2 -2
  9. package/public-api.js +2 -0
  10. package/ssr/components/dist/styles/esm/styles-entry.js +121 -40
  11. package/ssr/components/dist/utils/esm/utils-entry.js +1 -1
  12. package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/flyout.wrapper.js +39 -0
  13. package/ssr/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/accordion.js +1 -0
  14. package/ssr/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/banner.js +1 -0
  15. package/ssr/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/button-pure.js +1 -0
  16. package/ssr/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/button-tile.js +1 -0
  17. package/ssr/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/button.js +1 -0
  18. package/ssr/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/carousel.js +1 -1
  19. package/ssr/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/checkbox-wrapper.js +1 -0
  20. package/ssr/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/flyout.js +88 -0
  21. package/ssr/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/inline-notification.js +1 -0
  22. package/ssr/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/link-pure.js +1 -0
  23. package/ssr/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/link-social.js +1 -0
  24. package/ssr/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/link-tile-model-signature.js +1 -0
  25. package/ssr/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/link-tile.js +1 -0
  26. package/ssr/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/link.js +1 -0
  27. package/ssr/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/modal.js +1 -0
  28. package/ssr/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/pagination.js +1 -0
  29. package/ssr/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/popover.js +1 -0
  30. package/ssr/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/scroller.js +1 -1
  31. package/ssr/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/segmented-control-item.js +1 -0
  32. package/ssr/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/select-wrapper.js +1 -0
  33. package/ssr/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/state-message.js +1 -0
  34. package/ssr/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/stepper-horizontal-item.js +1 -0
  35. package/ssr/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/stepper-horizontal.js +1 -0
  36. package/ssr/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/switch.js +1 -0
  37. package/ssr/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/table-head-cell.js +1 -0
  38. package/ssr/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/table.js +1 -0
  39. package/ssr/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/tabs-bar.js +1 -0
  40. package/ssr/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/tabs.js +1 -0
  41. package/ssr/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/tag-dismissible.js +1 -0
  42. package/ssr/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/tag.js +1 -0
  43. package/ssr/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/text-field-wrapper.js +1 -0
  44. package/ssr/components-react/projects/react-ssr-wrapper/src/public-api.js +2 -0
  45. package/ssr/esm/components/dist/styles/esm/styles-entry.js +105 -25
  46. package/ssr/esm/components/dist/utils/esm/utils-entry.js +1 -1
  47. package/ssr/esm/components-react/projects/react-ssr-wrapper/src/lib/components/flyout.wrapper.js +37 -0
  48. package/ssr/esm/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/accordion.js +3 -2
  49. package/ssr/esm/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/banner.js +3 -2
  50. package/ssr/esm/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/button-group.js +2 -2
  51. package/ssr/esm/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/button-pure.js +3 -2
  52. package/ssr/esm/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/button-tile.js +3 -2
  53. package/ssr/esm/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/button.js +3 -2
  54. package/ssr/esm/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/carousel.js +3 -3
  55. package/ssr/esm/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/checkbox-wrapper.js +3 -2
  56. package/ssr/esm/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/content-wrapper.js +2 -2
  57. package/ssr/esm/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/crest.js +2 -2
  58. package/ssr/esm/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/display.js +2 -2
  59. package/ssr/esm/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/divider.js +2 -2
  60. package/ssr/esm/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/fieldset-wrapper.js +2 -2
  61. package/ssr/esm/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/fieldset.js +2 -2
  62. package/ssr/esm/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/flex-item.js +2 -2
  63. package/ssr/esm/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/flex.js +2 -2
  64. package/ssr/esm/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/flyout.js +86 -0
  65. package/ssr/esm/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/inline-notification.js +1 -0
  66. package/ssr/esm/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/link-pure.js +1 -0
  67. package/ssr/esm/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/link-social.js +1 -0
  68. package/ssr/esm/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/link-tile-model-signature.js +1 -0
  69. package/ssr/esm/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/link-tile.js +1 -0
  70. package/ssr/esm/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/link.js +1 -0
  71. package/ssr/esm/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/modal.js +1 -0
  72. package/ssr/esm/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/pagination.js +1 -0
  73. package/ssr/esm/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/popover.js +1 -0
  74. package/ssr/esm/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/scroller.js +1 -1
  75. package/ssr/esm/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/segmented-control-item.js +1 -0
  76. package/ssr/esm/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/select-wrapper.js +1 -0
  77. package/ssr/esm/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/state-message.js +1 -0
  78. package/ssr/esm/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/stepper-horizontal-item.js +1 -0
  79. package/ssr/esm/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/stepper-horizontal.js +1 -0
  80. package/ssr/esm/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/switch.js +1 -0
  81. package/ssr/esm/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/table-head-cell.js +1 -0
  82. package/ssr/esm/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/table.js +1 -0
  83. package/ssr/esm/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/tabs-bar.js +1 -0
  84. package/ssr/esm/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/tabs.js +1 -0
  85. package/ssr/esm/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/tag-dismissible.js +1 -0
  86. package/ssr/esm/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/tag.js +1 -0
  87. package/ssr/esm/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/text-field-wrapper.js +1 -0
  88. package/ssr/esm/components-react/projects/react-ssr-wrapper/src/public-api.js +1 -0
  89. package/ssr/lib/components/flyout.wrapper.d.ts +48 -0
  90. package/ssr/lib/components/index.d.ts +1 -0
  91. package/ssr/lib/dsr-components/flyout.d.ts +14 -0
  92. package/ssr/lib/types.d.ts +9 -0
package/ssr/esm/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/select-wrapper.js CHANGED
@@ -15,6 +15,7 @@ import '../components/fieldset.wrapper.js';
15
15
  import '../components/fieldset-wrapper.wrapper.js';
16
16
  import '../components/flex.wrapper.js';
17
17
  import '../components/flex-item.wrapper.js';
18
+ import '../components/flyout.wrapper.js';
18
19
  import '../components/grid.wrapper.js';
19
20
  import '../components/grid-item.wrapper.js';
20
21
  import '../components/heading.wrapper.js';
package/ssr/esm/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/state-message.js CHANGED
@@ -15,6 +15,7 @@ import '../components/fieldset.wrapper.js';
15
15
  import '../components/fieldset-wrapper.wrapper.js';
16
16
  import '../components/flex.wrapper.js';
17
17
  import '../components/flex-item.wrapper.js';
18
+ import '../components/flyout.wrapper.js';
18
19
  import '../components/grid.wrapper.js';
19
20
  import '../components/grid-item.wrapper.js';
20
21
  import '../components/heading.wrapper.js';
package/ssr/esm/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/stepper-horizontal-item.js CHANGED
@@ -15,6 +15,7 @@ import '../components/fieldset.wrapper.js';
15
15
  import '../components/fieldset-wrapper.wrapper.js';
16
16
  import '../components/flex.wrapper.js';
17
17
  import '../components/flex-item.wrapper.js';
18
+ import '../components/flyout.wrapper.js';
18
19
  import '../components/grid.wrapper.js';
19
20
  import '../components/grid-item.wrapper.js';
20
21
  import '../components/heading.wrapper.js';
package/ssr/esm/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/stepper-horizontal.js CHANGED
@@ -15,6 +15,7 @@ import '../components/fieldset.wrapper.js';
15
15
  import '../components/fieldset-wrapper.wrapper.js';
16
16
  import '../components/flex.wrapper.js';
17
17
  import '../components/flex-item.wrapper.js';
18
+ import '../components/flyout.wrapper.js';
18
19
  import '../components/grid.wrapper.js';
19
20
  import '../components/grid-item.wrapper.js';
20
21
  import '../components/heading.wrapper.js';
package/ssr/esm/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/switch.js CHANGED
@@ -15,6 +15,7 @@ import '../components/fieldset.wrapper.js';
15
15
  import '../components/fieldset-wrapper.wrapper.js';
16
16
  import '../components/flex.wrapper.js';
17
17
  import '../components/flex-item.wrapper.js';
18
+ import '../components/flyout.wrapper.js';
18
19
  import '../components/grid.wrapper.js';
19
20
  import '../components/grid-item.wrapper.js';
20
21
  import '../components/heading.wrapper.js';
package/ssr/esm/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/table-head-cell.js CHANGED
@@ -15,6 +15,7 @@ import '../components/fieldset.wrapper.js';
15
15
  import '../components/fieldset-wrapper.wrapper.js';
16
16
  import '../components/flex.wrapper.js';
17
17
  import '../components/flex-item.wrapper.js';
18
+ import '../components/flyout.wrapper.js';
18
19
  import '../components/grid.wrapper.js';
19
20
  import '../components/grid-item.wrapper.js';
20
21
  import '../components/heading.wrapper.js';
package/ssr/esm/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/table.js CHANGED
@@ -15,6 +15,7 @@ import '../components/fieldset.wrapper.js';
15
15
  import '../components/fieldset-wrapper.wrapper.js';
16
16
  import '../components/flex.wrapper.js';
17
17
  import '../components/flex-item.wrapper.js';
18
+ import '../components/flyout.wrapper.js';
18
19
  import '../components/grid.wrapper.js';
19
20
  import '../components/grid-item.wrapper.js';
20
21
  import '../components/heading.wrapper.js';
package/ssr/esm/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/tabs-bar.js CHANGED
@@ -15,6 +15,7 @@ import '../components/fieldset.wrapper.js';
15
15
  import '../components/fieldset-wrapper.wrapper.js';
16
16
  import '../components/flex.wrapper.js';
17
17
  import '../components/flex-item.wrapper.js';
18
+ import '../components/flyout.wrapper.js';
18
19
  import '../components/grid.wrapper.js';
19
20
  import '../components/grid-item.wrapper.js';
20
21
  import '../components/heading.wrapper.js';
package/ssr/esm/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/tabs.js CHANGED
@@ -15,6 +15,7 @@ import '../components/fieldset.wrapper.js';
15
15
  import '../components/fieldset-wrapper.wrapper.js';
16
16
  import '../components/flex.wrapper.js';
17
17
  import '../components/flex-item.wrapper.js';
18
+ import '../components/flyout.wrapper.js';
18
19
  import '../components/grid.wrapper.js';
19
20
  import '../components/grid-item.wrapper.js';
20
21
  import '../components/heading.wrapper.js';
package/ssr/esm/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/tag-dismissible.js CHANGED
@@ -15,6 +15,7 @@ import '../components/fieldset.wrapper.js';
15
15
  import '../components/fieldset-wrapper.wrapper.js';
16
16
  import '../components/flex.wrapper.js';
17
17
  import '../components/flex-item.wrapper.js';
18
+ import '../components/flyout.wrapper.js';
18
19
  import '../components/grid.wrapper.js';
19
20
  import '../components/grid-item.wrapper.js';
20
21
  import '../components/heading.wrapper.js';
package/ssr/esm/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/tag.js CHANGED
@@ -15,6 +15,7 @@ import '../components/fieldset.wrapper.js';
15
15
  import '../components/fieldset-wrapper.wrapper.js';
16
16
  import '../components/flex.wrapper.js';
17
17
  import '../components/flex-item.wrapper.js';
18
+ import '../components/flyout.wrapper.js';
18
19
  import '../components/grid.wrapper.js';
19
20
  import '../components/grid-item.wrapper.js';
20
21
  import '../components/heading.wrapper.js';
package/ssr/esm/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/text-field-wrapper.js CHANGED
@@ -16,6 +16,7 @@ import '../components/fieldset.wrapper.js';
16
16
  import '../components/fieldset-wrapper.wrapper.js';
17
17
  import '../components/flex.wrapper.js';
18
18
  import '../components/flex-item.wrapper.js';
19
+ import '../components/flyout.wrapper.js';
19
20
  import '../components/grid.wrapper.js';
20
21
  import '../components/grid-item.wrapper.js';
21
22
  import '../components/heading.wrapper.js';
package/ssr/esm/components-react/projects/react-ssr-wrapper/src/public-api.js CHANGED
@@ -15,6 +15,7 @@ export { PFieldset } from './lib/components/fieldset.wrapper.js';
15
15
  export { PFieldsetWrapper } from './lib/components/fieldset-wrapper.wrapper.js';
16
16
  export { PFlex } from './lib/components/flex.wrapper.js';
17
17
  export { PFlexItem } from './lib/components/flex-item.wrapper.js';
18
+ export { PFlyout } from './lib/components/flyout.wrapper.js';
18
19
  export { PGrid } from './lib/components/grid.wrapper.js';
19
20
  export { PGridItem } from './lib/components/grid-item.wrapper.js';
20
21
  export { PHeading } from './lib/components/heading.wrapper.js';
package/ssr/lib/components/flyout.wrapper.d.ts ADDED
@@ -0,0 +1,48 @@
1
+ import { HTMLAttributes } from 'react';
2
+ import type { SelectedAriaAttributes, FlyoutAriaAttribute, FlyoutPosition, Theme } from '../types';
3
+ export type PFlyoutProps = Omit<HTMLAttributes<{}>, 'color'> & {
4
+ /**
5
+ * Add ARIA attributes.
6
+ */
7
+ aria?: SelectedAriaAttributes<FlyoutAriaAttribute>;
8
+ /**
9
+ * Emitted when the component requests to be dismissed.
10
+ */
11
+ onDismiss?: (event: CustomEvent<void>) => void;
12
+ /**
13
+ * If true, the flyout is open.
14
+ */
15
+ open: boolean;
16
+ /**
17
+ * The position of the flyout
18
+ */
19
+ position?: FlyoutPosition;
20
+ /**
21
+ * Adapts the flyout color depending on the theme.
22
+ */
23
+ theme?: Theme;
24
+ };
25
+ export declare const PFlyout: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color"> & {
26
+ /**
27
+ * Add ARIA attributes.
28
+ */
29
+ aria?: SelectedAriaAttributes<FlyoutAriaAttribute>;
30
+ /**
31
+ * Emitted when the component requests to be dismissed.
32
+ */
33
+ onDismiss?: (event: CustomEvent<void>) => void;
34
+ /**
35
+ * If true, the flyout is open.
36
+ */
37
+ open: boolean;
38
+ /**
39
+ * The position of the flyout
40
+ */
41
+ position?: FlyoutPosition;
42
+ /**
43
+ * Adapts the flyout color depending on the theme.
44
+ */
45
+ theme?: Theme;
46
+ } & {
47
+ children?: import("react").ReactNode;
48
+ } & import("react").RefAttributes<HTMLElement>>;
package/ssr/lib/components/index.d.ts CHANGED
@@ -14,6 +14,7 @@ export * from './fieldset.wrapper';
14
14
  export * from './fieldset-wrapper.wrapper';
15
15
  export * from './flex.wrapper';
16
16
  export * from './flex-item.wrapper';
17
+ export * from './flyout.wrapper';
17
18
  export * from './grid.wrapper';
18
19
  export * from './grid-item.wrapper';
19
20
  export * from './heading.wrapper';
package/ssr/lib/dsr-components/flyout.d.ts ADDED
@@ -0,0 +1,14 @@
1
+ import { Component } from 'react';
2
+ export declare class DSRFlyout extends Component<any> {
3
+ host: HTMLElement;
4
+ private focusedElBeforeOpen;
5
+ private dialog;
6
+ private dismissBtn;
7
+ private header;
8
+ private footer;
9
+ private subFooter;
10
+ private hasHeader;
11
+ private hasFooter;
12
+ private hasSubFooter;
13
+ render(): JSX.Element;
14
+ }
package/ssr/lib/types.d.ts CHANGED
@@ -757,6 +757,15 @@ declare const FLEX_ITEM_FLEXS: readonly [
757
757
  "equal"
758
758
  ];
759
759
  export type FlexItemFlex = typeof FLEX_ITEM_FLEXS[number];
760
+ declare const FLYOUT_POSITIONS: readonly [
761
+ "left",
762
+ "right"
763
+ ];
764
+ export type FlyoutPosition = (typeof FLYOUT_POSITIONS)[number];
765
+ declare const FLYOUT_ARIA_ATTRIBUTES: readonly [
766
+ "aria-label"
767
+ ];
768
+ export type FlyoutAriaAttribute = (typeof FLYOUT_ARIA_ATTRIBUTES)[number];
760
769
  declare const GRID_DIRECTIONS: readonly [
761
770
  "row",
762
771
  "row-reverse",