@festo-ui/react 9.0.0-dev.732 → 9.0.0-dev.734

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 (12) hide show
  1. package/dist/components/popovers/legend/Legend.d.ts +0 -1
  2. package/dist/components/popovers/legend/Legend.js +12 -15
  3. package/dist/components/popovers/popover/Popover.d.ts +2 -1
  4. package/dist/components/popovers/popover/Popover.js +2 -2
  5. package/dist/components/popovers/popover-menu/PopoverMenu.d.ts +0 -1
  6. package/dist/components/popovers/popover-menu/PopoverMenu.js +4 -4
  7. package/dist/components/popovers/popover-menu-item/PopoverMenuItem.d.ts +0 -1
  8. package/dist/components/popovers/popover-menu-item/PopoverMenuItem.js +0 -1
  9. package/package.json +1 -1
  10. package/dist/components/popovers/legend/Legend.css +0 -21
  11. package/dist/components/popovers/popover-menu/PopoverMenu.css +0 -20
  12. package/dist/components/popovers/popover-menu-item/PopoverMenuItem.css +0 -35
package/dist/components/popovers/legend/Legend.d.ts CHANGED
@@ -1,5 +1,4 @@
1
1
  import { type PopoverProps } from '../popover/Popover';
2
- import './Legend.scss';
3
2
  export interface PopoverLegendItem {
4
3
  readonly name: string;
5
4
  readonly text: string;
package/dist/components/popovers/legend/Legend.js CHANGED
@@ -1,23 +1,20 @@
1
1
  import { jsx, jsxs } from "react/jsx-runtime";
2
2
  import { Popover } from "../popover/Popover.js";
3
- import "./Legend.css";
4
3
  function Legend({ items, ...props }) {
5
- const content = items.length > 0 ? /*#__PURE__*/ jsx("dl", {
6
- className: "fr-legend",
7
- children: items.map((item)=>/*#__PURE__*/ jsxs("div", {
8
- className: "fr-legend-content",
9
- children: [
10
- /*#__PURE__*/ jsx("dt", {
11
- children: item.name
12
- }),
13
- /*#__PURE__*/ jsx("dt", {
14
- children: item.text
15
- })
16
- ]
17
- }, item.name))
18
- }) : null;
4
+ const content = items.map((item)=>/*#__PURE__*/ jsxs("dl", {
5
+ className: "fwe-popover-legend-content",
6
+ children: [
7
+ /*#__PURE__*/ jsx("dt", {
8
+ children: item.name
9
+ }),
10
+ /*#__PURE__*/ jsx("dd", {
11
+ children: item.text
12
+ })
13
+ ]
14
+ }, item.name));
19
15
  return /*#__PURE__*/ jsx(Popover, {
20
16
  popoverContent: content,
17
+ popoverClassName: "fwe-popover--legend",
21
18
  ...props
22
19
  });
23
20
  }
package/dist/components/popovers/popover/Popover.d.ts CHANGED
@@ -13,8 +13,9 @@ export interface PopoverProps extends ClassNamePropsWithChildren {
13
13
  readonly wrapper?: (children: React.ReactNode) => React.ReactNode;
14
14
  readonly flip?: boolean;
15
15
  readonly containerClassName?: string;
16
+ readonly popoverClassName?: string;
16
17
  readonly stopPropagation?: boolean;
17
18
  readonly arrow?: boolean;
18
19
  readonly onClick?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
19
20
  }
20
- export declare function Popover({ popoverContent, children, position, fallbackPositions, openOnHover, defaultOpen, open, onStatusChange, wrapper, className, flip, containerClassName, stopPropagation, arrow, onClick, }: PopoverProps): import("react/jsx-runtime").JSX.Element;
21
+ export declare function Popover({ popoverContent, children, position, fallbackPositions, openOnHover, defaultOpen, open, onStatusChange, wrapper, className, flip, containerClassName, popoverClassName, stopPropagation, arrow, onClick, }: PopoverProps): import("react/jsx-runtime").JSX.Element;
package/dist/components/popovers/popover/Popover.js CHANGED
@@ -6,7 +6,7 @@ import { usePopper } from "react-popper";
6
6
  import { useControlled } from "../../../utils/useControlled.js";
7
7
  import { useForkRef } from "../../../utils/useForkRef.js";
8
8
  import { useOnClickOutside } from "../../../utils/useOnClickOutside.js";
9
- function Popover({ popoverContent, children, position, fallbackPositions, openOnHover = false, defaultOpen = false, open, onStatusChange, wrapper, className, flip = true, containerClassName, stopPropagation = false, arrow = true, onClick }) {
9
+ function Popover({ popoverContent, children, position, fallbackPositions, openOnHover = false, defaultOpen = false, open, onStatusChange, wrapper, className, flip = true, containerClassName, popoverClassName, stopPropagation = false, arrow = true, onClick }) {
10
10
  const [showPopper, setShowPopper] = useControlled({
11
11
  controlled: open,
12
12
  default: defaultOpen
@@ -90,7 +90,7 @@ function Popover({ popoverContent, children, position, fallbackPositions, openOn
90
90
  ...attributes.popper,
91
91
  children: [
92
92
  /*#__PURE__*/ jsx("div", {
93
- className: "fwe-popover",
93
+ className: classnames('fwe-popover', popoverClassName),
94
94
  children: popoverContent
95
95
  }),
96
96
  arrow && /*#__PURE__*/ jsx("div", {
package/dist/components/popovers/popover-menu/PopoverMenu.d.ts CHANGED
@@ -1,6 +1,5 @@
1
1
  import { type ReactNode } from 'react';
2
2
  import { type PopoverProps } from '../popover/Popover';
3
- import './PopoverMenu.scss';
4
3
  import { type PopoverMenuItemProps } from '../popover-menu-item/PopoverMenuItem';
5
4
  export interface PopoverMenuProps extends Omit<PopoverProps, 'popoverContent' | 'open' | 'onStatusChange'> {
6
5
  menu: PopoverMenuItemProps[] | ReactNode[];
package/dist/components/popovers/popover-menu/PopoverMenu.js CHANGED
@@ -2,7 +2,6 @@ import { jsx } from "react/jsx-runtime";
2
2
  import classnames from "classnames";
3
3
  import { useMemo, useState } from "react";
4
4
  import { Popover } from "../popover/Popover.js";
5
- import "./PopoverMenu.css";
6
5
  import { PopoverMenuItem } from "../popover-menu-item/PopoverMenuItem.js";
7
6
  import { PopoverMenuContext } from "./PopoverMenuContext.js";
8
7
  function PopoverMenu({ menu, ...props }) {
@@ -16,18 +15,19 @@ function PopoverMenu({ menu, ...props }) {
16
15
  setShowPopper
17
16
  }), []);
18
17
  return /*#__PURE__*/ jsx("div", {
19
- className: classnames('fwe-popover-menu', props.className),
18
+ className: classnames('fwe-popover-menu-trigger', props.className),
20
19
  children: /*#__PURE__*/ jsx(PopoverMenuContext.Provider, {
21
20
  value: popoverMenuContext,
22
21
  children: /*#__PURE__*/ jsx(Popover, {
22
+ popoverClassName: "fwe-popover--menu",
23
23
  popoverContent: content,
24
24
  position: "right",
25
25
  open: showPopper,
26
26
  onStatusChange: setShowPopper,
27
27
  ...props,
28
28
  children: /*#__PURE__*/ jsx("div", {
29
- "data-testid": "fwe-popover-menu-button",
30
- className: "fwe-popover-menu-button",
29
+ "data-testid": "fwe-popover-menu-trigger-button",
30
+ className: "fwe-popover-menu-trigger-button",
31
31
  children: props.children
32
32
  })
33
33
  })
package/dist/components/popovers/popover-menu-item/PopoverMenuItem.d.ts CHANGED
@@ -1,4 +1,3 @@
1
- import './PopoverMenuItem.scss';
2
1
  export interface PopoverMenuItemProps {
3
2
  text: string;
4
3
  icon: React.ReactNode;
package/dist/components/popovers/popover-menu-item/PopoverMenuItem.js CHANGED
@@ -1,5 +1,4 @@
1
1
  import { jsx, jsxs } from "react/jsx-runtime";
2
- import "./PopoverMenuItem.css";
3
2
  import { useContext } from "react";
4
3
  import { IconWrapper } from "../../icon-wrapper/IconWrapper.js";
5
4
  import { PopoverMenuContext } from "../popover-menu/PopoverMenuContext.js";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@festo-ui/react",
3
- "version": "9.0.0-dev.732",
3
+ "version": "9.0.0-dev.734",
4
4
  "author": "Festo UI (styleguide@festo.com)",
5
5
  "copyright": "Copyright (c) 2025 Festo SE & Co. KG. All rights reserved.",
6
6
  "license": "apache-2.0",
package/dist/components/popovers/legend/Legend.css DELETED
@@ -1,21 +0,0 @@
1
- .fr-legend {
2
- margin: 16px;
3
- line-height: 24px;
4
- display: table;
5
- }
6
-
7
- .fr-legend .fr-legend-content {
8
- display: table-row;
9
- }
10
-
11
- .fr-legend .fr-legend-content dt {
12
- margin: 0;
13
- padding-right: 8px;
14
- display: table-cell;
15
- }
16
-
17
- .fr-legend .fr-legend-content dd {
18
- margin: 0;
19
- display: table-cell;
20
- }
21
-
package/dist/components/popovers/popover-menu/PopoverMenu.css DELETED
@@ -1,20 +0,0 @@
1
- .fwe-popover-menu .fwe-popover-menu-button {
2
- cursor: pointer;
3
- background: none;
4
- border: none;
5
- margin: 0;
6
- padding: 0;
7
- line-height: 0;
8
- display: block;
9
- }
10
-
11
- .fwe-popover-menu .fwe-popover-menu-button:hover {
12
- color: var(--fwe-hero);
13
- }
14
-
15
- .fwe-popover-menu .fwe-popover {
16
- font-size: var(--fwe-font-size-base);
17
- padding: 16px;
18
- line-height: 1.5rem;
19
- }
20
-
package/dist/components/popovers/popover-menu-item/PopoverMenuItem.css DELETED
@@ -1,35 +0,0 @@
1
- .fr-popover-item {
2
- width: 100%;
3
- height: 36px;
4
- color: var(--fwe-text);
5
- align-items: center;
6
- display: flex;
7
- }
8
-
9
- .fr-popover-item .fwe-svg-icon {
10
- margin-left: 8px;
11
- margin-right: 8px;
12
- }
13
-
14
- .fr-popover-item i {
15
- flex-wrap: nowrap;
16
- justify-content: center;
17
- align-items: center;
18
- width: 32px;
19
- height: 24px;
20
- margin-right: 0;
21
- display: inline-flex;
22
- }
23
-
24
- .fr-popover-item i:before, .fr-popover-item span {
25
- display: inline-flex;
26
- }
27
-
28
- .fr-popover-item:hover {
29
- background-color: #3333331a;
30
- }
31
-
32
- .fr-popover-item:active {
33
- background-color: #3333;
34
- }
35
-