@vodafone_de/brix-components 3.1.6 → 3.1.7

package/Snackbar/useSnackbar.types.d.ts

@@ -0,0 +1,59 @@
+export type SnackbarCloseReason = 'timeout' | 'clickaway' | 'escapeKeyDown';
+export interface UseSnackbarParameters {
+  /**
+   * The number of milliseconds to wait before automatically calling the
+   * `onClose` function. `onClose` should then set the state of the `open`
+   * prop to hide the Snackbar. This behavior is disabled by default with
+   * the `null` value.
+   * @default null
+   */
+  autoHideDuration?: number | null;
+  /**
+   * If `true`, the `autoHideDuration` timer will expire even if the window is not focused.
+   * @default false
+   */
+  disableWindowBlurListener?: boolean;
+  /**
+   * Callback fired when the component requests to be closed.
+   * Typically `onClose` is used to set state in the parent component,
+   * which is used to control the `Snackbar` `open` prop.
+   * The `reason` parameter can optionally be used to control the response to `onClose`,
+   * for example ignoring `clickaway`.
+   *
+   * @param {React.SyntheticEvent<any> | Event} event The event source of the callback.
+   * @param {string} reason Can be: `"timeout"` (`autoHideDuration` expired), `"clickaway"`, or `"escapeKeyDown"`.
+   */
+  onClose?: (event: React.SyntheticEvent<any> | Event | null, reason: SnackbarCloseReason) => void;
+  /**
+   * If `true`, the component is shown.
+   */
+  open?: boolean;
+  /**
+   * The number of milliseconds to wait before dismissing after user interaction.
+   * If `autoHideDuration` prop isn't specified, it does nothing.
+   * If `autoHideDuration` prop is specified but `resumeHideDuration` isn't,
+   * we default to `autoHideDuration / 2` ms.
+   */
+  resumeHideDuration?: number;
+}
+export type UseSnackbarRootSlotProps<ExternalProps = {}> = ExternalProps & UseSnackbarRootSlotOwnProps;
+export interface UseSnackbarRootSlotOwnProps {
+  onBlur: React.FocusEventHandler;
+  onFocus: React.FocusEventHandler;
+  onMouseEnter: React.MouseEventHandler;
+  onMouseLeave: React.MouseEventHandler;
+  ref?: React.RefCallback<Element>;
+  role: React.AriaRole;
+}
+export interface UseSnackbarReturnValue {
+  /**
+   * Resolver for the root slot's props.
+   * @param externalProps props for the root slot
+   * @returns props that should be spread on the root slot
+   */
+  getRootProps: <ExternalProps extends Record<string, unknown> = {}>(externalProps?: ExternalProps) => UseSnackbarRootSlotProps<ExternalProps>;
+  /**
+   * Callback fired when a "click away" event is detected.
+   */
+  onClickAway: (event: React.SyntheticEvent<any> | Event) => void;
+}

package/Snackbar/useSnackbar.types.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/SnackbarContent/SnackbarContent.d.ts

@@ -0,0 +1,42 @@
+import * as React from 'react';
+import { SxProps } from '@mui/system';
+import { Theme } from "../styles/index.js";
+import { InternalStandardProps as StandardProps } from "../index.js";
+import { PaperProps } from "../Paper/index.js";
+import { SnackbarContentClasses } from "./snackbarContentClasses.js";
+export interface SnackbarContentProps extends StandardProps<PaperProps, 'children'> {
+  /**
+   * The action to display. It renders after the message, at the end of the snackbar.
+   */
+  action?: React.ReactNode;
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes?: Partial<SnackbarContentClasses>;
+  /**
+   * The message to display.
+   */
+  message?: React.ReactNode;
+  /**
+   * The ARIA role attribute of the element.
+   * @default 'alert'
+   */
+  role?: PaperProps['role'];
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx?: SxProps<Theme>;
+}
+
+/**
+ *
+ * Demos:
+ *
+ * - [Snackbar](https://mui.com/material-ui/react-snackbar/)
+ *
+ * API:
+ *
+ * - [SnackbarContent API](https://mui.com/material-ui/api/snackbar-content/)
+ * - inherits [Paper API](https://mui.com/material-ui/api/paper/)
+ */
+export default function SnackbarContent(props: SnackbarContentProps): React.JSX.Element;

package/SnackbarContent/SnackbarContent.js

@@ -0,0 +1,136 @@
+"use strict";
+'use client';
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var React = _interopRequireWildcard(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _clsx = _interopRequireDefault(require("clsx"));
+var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
+var _colorManipulator = require("@mui/system/colorManipulator");
+var _zeroStyled = require("../zero-styled");
+var _memoTheme = _interopRequireDefault(require("../utils/memoTheme"));
+var _DefaultPropsProvider = require("../DefaultPropsProvider");
+var _Paper = _interopRequireDefault(require("../Paper"));
+var _snackbarContentClasses = require("./snackbarContentClasses");
+var _jsxRuntime = require("react/jsx-runtime");
+const useUtilityClasses = ownerState => {
+  const {
+    classes
+  } = ownerState;
+  const slots = {
+    root: ['root'],
+    action: ['action'],
+    message: ['message']
+  };
+  return (0, _composeClasses.default)(slots, _snackbarContentClasses.getSnackbarContentUtilityClass, classes);
+};
+const SnackbarContentRoot = (0, _zeroStyled.styled)(_Paper.default, {
+  name: 'MuiSnackbarContent',
+  slot: 'Root'
+})((0, _memoTheme.default)(({
+  theme
+}) => {
+  const emphasis = theme.palette.mode === 'light' ? 0.8 : 0.98;
+  const backgroundColor = (0, _colorManipulator.emphasize)(theme.palette.background.default, emphasis);
+  return {
+    ...theme.typography.body2,
+    color: theme.vars ? theme.vars.palette.SnackbarContent.color : theme.palette.getContrastText(backgroundColor),
+    backgroundColor: theme.vars ? theme.vars.palette.SnackbarContent.bg : backgroundColor,
+    display: 'flex',
+    alignItems: 'center',
+    flexWrap: 'wrap',
+    padding: '6px 16px',
+    borderRadius: (theme.vars || theme).shape.borderRadius,
+    flexGrow: 1,
+    [theme.breakpoints.up('sm')]: {
+      flexGrow: 'initial',
+      minWidth: 288
+    }
+  };
+}));
+const SnackbarContentMessage = (0, _zeroStyled.styled)('div', {
+  name: 'MuiSnackbarContent',
+  slot: 'Message'
+})({
+  padding: '8px 0'
+});
+const SnackbarContentAction = (0, _zeroStyled.styled)('div', {
+  name: 'MuiSnackbarContent',
+  slot: 'Action'
+})({
+  display: 'flex',
+  alignItems: 'center',
+  marginLeft: 'auto',
+  paddingLeft: 16,
+  marginRight: -8
+});
+const SnackbarContent = /*#__PURE__*/React.forwardRef(function SnackbarContent(inProps, ref) {
+  const props = (0, _DefaultPropsProvider.useDefaultProps)({
+    props: inProps,
+    name: 'MuiSnackbarContent'
+  });
+  const {
+    action,
+    className,
+    message,
+    role = 'alert',
+    ...other
+  } = props;
+  const ownerState = props;
+  const classes = useUtilityClasses(ownerState);
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(SnackbarContentRoot, {
+    role: role,
+    square: true,
+    elevation: 6,
+    className: (0, _clsx.default)(classes.root, className),
+    ownerState: ownerState,
+    ref: ref,
+    ...other,
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(SnackbarContentMessage, {
+      className: classes.message,
+      ownerState: ownerState,
+      children: message
+    }), action ? /*#__PURE__*/(0, _jsxRuntime.jsx)(SnackbarContentAction, {
+      className: classes.action,
+      ownerState: ownerState,
+      children: action
+    }) : null]
+  });
+});
+process.env.NODE_ENV !== "production" ? SnackbarContent.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * The action to display. It renders after the message, at the end of the snackbar.
+   */
+  action: _propTypes.default.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: _propTypes.default.object,
+  /**
+   * @ignore
+   */
+  className: _propTypes.default.string,
+  /**
+   * The message to display.
+   */
+  message: _propTypes.default.node,
+  /**
+   * The ARIA role attribute of the element.
+   * @default 'alert'
+   */
+  role: _propTypes.default /* @typescript-to-proptypes-ignore */.string,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.object, _propTypes.default.bool])), _propTypes.default.func, _propTypes.default.object])
+} : void 0;
+var _default = exports.default = SnackbarContent;

package/SnackbarContent/index.d.ts

@@ -0,0 +1,4 @@
+export { default } from "./SnackbarContent.js";
+export * from "./SnackbarContent.js";
+export { default as snackbarContentClasses } from "./snackbarContentClasses.js";
+export * from "./snackbarContentClasses.js";

package/SnackbarContent/index.js

@@ -0,0 +1,35 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _exportNames = {
+  snackbarContentClasses: true
+};
+Object.defineProperty(exports, "default", {
+  enumerable: true,
+  get: function () {
+    return _SnackbarContent.default;
+  }
+});
+Object.defineProperty(exports, "snackbarContentClasses", {
+  enumerable: true,
+  get: function () {
+    return _snackbarContentClasses.default;
+  }
+});
+var _SnackbarContent = _interopRequireDefault(require("./SnackbarContent"));
+var _snackbarContentClasses = _interopRequireWildcard(require("./snackbarContentClasses"));
+Object.keys(_snackbarContentClasses).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _snackbarContentClasses[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _snackbarContentClasses[key];
+    }
+  });
+});

package/SnackbarContent/snackbarContentClasses.d.ts

@@ -0,0 +1,12 @@
+export interface SnackbarContentClasses {
+  /** Styles applied to the root element. */
+  root: string;
+  /** Styles applied to the message wrapper element. */
+  message: string;
+  /** Styles applied to the action wrapper element if `action` is provided. */
+  action: string;
+}
+export type SnackbarContentClassKey = keyof SnackbarContentClasses;
+export declare function getSnackbarContentUtilityClass(slot: string): string;
+declare const snackbarContentClasses: SnackbarContentClasses;
+export default snackbarContentClasses;

package/SnackbarContent/snackbarContentClasses.js

@@ -0,0 +1,15 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+exports.getSnackbarContentUtilityClass = getSnackbarContentUtilityClass;
+var _generateUtilityClasses = _interopRequireDefault(require("@mui/utils/generateUtilityClasses"));
+var _generateUtilityClass = _interopRequireDefault(require("@mui/utils/generateUtilityClass"));
+function getSnackbarContentUtilityClass(slot) {
+  return (0, _generateUtilityClass.default)('MuiSnackbarContent', slot);
+}
+const snackbarContentClasses = (0, _generateUtilityClasses.default)('MuiSnackbarContent', ['root', 'message', 'action']);
+var _default = exports.default = snackbarContentClasses;

package/SpeedDial/SpeedDial.d.ts

@@ -0,0 +1,131 @@
+import * as React from 'react';
+import { SxProps } from '@mui/system';
+import { Theme } from "../styles/index.js";
+import { InternalStandardProps as StandardProps } from "../index.js";
+import { FabProps } from "../Fab/index.js";
+import { TransitionProps } from "../transitions/index.js";
+import { SpeedDialClasses } from "./speedDialClasses.js";
+import { CreateSlotsAndSlotProps, SlotComponentProps } from "../utils/types.js";
+export type CloseReason = 'toggle' | 'blur' | 'mouseLeave' | 'escapeKeyDown';
+export type OpenReason = 'toggle' | 'focus' | 'mouseEnter';
+export interface SpeedDialSlots {
+  /**
+   * The component that renders the root slot.
+   * @default 'div'
+   */
+  root: React.ElementType;
+  /**
+   * The component that renders the transition.
+   * [Follow this guide](https://mui.com/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component.
+   * @default Zoom
+   */
+  transition: React.ElementType;
+}
+export type SpeedDialSlotsAndSlotProps = CreateSlotsAndSlotProps<SpeedDialSlots, {
+  /**
+   * Props forwarded to the root slot.
+   * By default, the avaible props are based on div element.
+   */
+  root: SlotComponentProps<'div', React.HTMLAttributes<HTMLDivElement>, SpeedDialOwnerState>;
+  /**
+   * Props forwarded to the transition slot.
+   * By default, the avaible props are based on the [Zoom](https://mui.com/material-ui/api/zoom/#props) component.
+   */
+  transition: SlotComponentProps<React.ElementType, TransitionProps, SpeedDialOwnerState>;
+}>;
+export interface SpeedDialProps extends Omit<StandardProps<React.HTMLAttributes<HTMLDivElement>, 'children'>, 'slots' | 'slotProps'>, SpeedDialSlotsAndSlotProps {
+  /**
+   * SpeedDialActions to display when the SpeedDial is `open`.
+   */
+  children?: React.ReactNode;
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes?: Partial<SpeedDialClasses>;
+  /**
+   * The aria-label of the button element.
+   * Also used to provide the `id` for the `SpeedDial` element and its children.
+   */
+  ariaLabel: string;
+  /**
+   * The direction the actions open relative to the floating action button.
+   * @default 'up'
+   */
+  direction?: 'up' | 'down' | 'left' | 'right';
+  /**
+   * If `true`, the SpeedDial is hidden.
+   * @default false
+   */
+  hidden?: boolean;
+  /**
+   * Props applied to the [`Fab`](https://mui.com/material-ui/api/fab/) element.
+   * @default {}
+   */
+  FabProps?: Partial<FabProps>;
+  /**
+   * The icon to display in the SpeedDial Fab. The `SpeedDialIcon` component
+   * provides a default Icon with animation.
+   */
+  icon?: React.ReactNode;
+  /**
+   * Callback fired when the component requests to be closed.
+   *
+   * @param {object} event The event source of the callback.
+   * @param {string} reason Can be: `"toggle"`, `"blur"`, `"mouseLeave"`, `"escapeKeyDown"`.
+   */
+  onClose?: (event: React.SyntheticEvent<{}>, reason: CloseReason) => void;
+  /**
+   * Callback fired when the component requests to be open.
+   *
+   * @param {object} event The event source of the callback.
+   * @param {string} reason Can be: `"toggle"`, `"focus"`, `"mouseEnter"`.
+   */
+  onOpen?: (event: React.SyntheticEvent<{}>, reason: OpenReason) => void;
+  /**
+   * If `true`, the component is shown.
+   */
+  open?: boolean;
+  /**
+   * The icon to display in the SpeedDial Fab when the SpeedDial is open.
+   */
+  openIcon?: React.ReactNode;
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx?: SxProps<Theme>;
+  /**
+   * The component used for the transition.
+   * [Follow this guide](https://mui.com/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component.
+   * @default Zoom
+   * * @deprecated Use `slots.transition` instead. This prop will be removed in a future major release. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/)
+   */
+  TransitionComponent?: React.JSXElementConstructor<TransitionProps>;
+  /**
+   * The duration for the transition, in milliseconds.
+   * You may specify a single timeout for all transitions, or individually with an object.
+   * @default {
+   *   enter: theme.transitions.duration.enteringScreen,
+   *   exit: theme.transitions.duration.leavingScreen,
+   * }
+   */
+  transitionDuration?: TransitionProps['timeout'];
+  /**
+   * Props applied to the transition element.
+   * By default, the element is based on this [`Transition`](https://reactcommunity.org/react-transition-group/transition/) component.
+   * @deprecated Use `slotProps.transition` instead. This prop will be removed in a future major release. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/)
+   */
+  TransitionProps?: TransitionProps;
+}
+export interface SpeedDialOwnerState extends SpeedDialProps {}
+
+/**
+ *
+ * Demos:
+ *
+ * - [Speed Dial](https://mui.com/material-ui/react-speed-dial/)
+ *
+ * API:
+ *
+ * - [SpeedDial API](https://mui.com/material-ui/api/speed-dial/)
+ */
+export default function SpeedDial(props: SpeedDialProps): React.JSX.Element;