@vodafone_de/brix-components 3.1.6 → 3.1.8

package/esm/NativeSelect/NativeSelectInput.js

@@ -1,240 +0,0 @@
-'use client';
-
-import * as React from 'react';
-import PropTypes from 'prop-types';
-import clsx from 'clsx';
-import refType from '@mui/utils/refType';
-import composeClasses from '@mui/utils/composeClasses';
-import capitalize from "../utils/capitalize.js";
-import nativeSelectClasses, { getNativeSelectUtilityClasses } from "./nativeSelectClasses.js";
-import { styled } from "../zero-styled/index.js";
-import rootShouldForwardProp from "../styles/rootShouldForwardProp.js";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-const useUtilityClasses = ownerState => {
-  const {
-    classes,
-    variant,
-    disabled,
-    multiple,
-    open,
-    error
-  } = ownerState;
-  const slots = {
-    select: ['select', variant, disabled && 'disabled', multiple && 'multiple', error && 'error'],
-    icon: ['icon', `icon${capitalize(variant)}`, open && 'iconOpen', disabled && 'disabled']
-  };
-  return composeClasses(slots, getNativeSelectUtilityClasses, classes);
-};
-export const StyledSelectSelect = styled('select')(({
-  theme
-}) => ({
-  // Reset
-  MozAppearance: 'none',
-  // Reset
-  WebkitAppearance: 'none',
-  // When interacting quickly, the text can end up selected.
-  // Native select can't be selected either.
-  userSelect: 'none',
-  // Reset
-  borderRadius: 0,
-  cursor: 'pointer',
-  '&:focus': {
-    // Reset Chrome style
-    borderRadius: 0
-  },
-  [`&.${nativeSelectClasses.disabled}`]: {
-    cursor: 'default'
-  },
-  '&[multiple]': {
-    height: 'auto'
-  },
-  '&:not([multiple]) option, &:not([multiple]) optgroup': {
-    backgroundColor: (theme.vars || theme).palette.background.paper
-  },
-  variants: [{
-    props: ({
-      ownerState
-    }) => ownerState.variant !== 'filled' && ownerState.variant !== 'outlined',
-    style: {
-      // Bump specificity to allow extending custom inputs
-      '&&&': {
-        paddingRight: 24,
-        minWidth: 16 // So it doesn't collapse.
-      }
-    }
-  }, {
-    props: {
-      variant: 'filled'
-    },
-    style: {
-      '&&&': {
-        paddingRight: 32
-      }
-    }
-  }, {
-    props: {
-      variant: 'outlined'
-    },
-    style: {
-      borderRadius: (theme.vars || theme).shape.borderRadius,
-      '&:focus': {
-        borderRadius: (theme.vars || theme).shape.borderRadius // Reset the reset for Chrome style
-      },
-      '&&&': {
-        paddingRight: 32
-      }
-    }
-  }]
-}));
-const NativeSelectSelect = styled(StyledSelectSelect, {
-  name: 'MuiNativeSelect',
-  slot: 'Select',
-  shouldForwardProp: rootShouldForwardProp,
-  overridesResolver: (props, styles) => {
-    const {
-      ownerState
-    } = props;
-    return [styles.select, styles[ownerState.variant], ownerState.error && styles.error, {
-      [`&.${nativeSelectClasses.multiple}`]: styles.multiple
-    }];
-  }
-})({});
-export const StyledSelectIcon = styled('svg')(({
-  theme
-}) => ({
-  // We use a position absolute over a flexbox in order to forward the pointer events
-  // to the input and to support wrapping tags..
-  position: 'absolute',
-  right: 0,
-  // Center vertically, height is 1em
-  top: 'calc(50% - .5em)',
-  // Don't block pointer events on the select under the icon.
-  pointerEvents: 'none',
-  color: (theme.vars || theme).palette.action.active,
-  [`&.${nativeSelectClasses.disabled}`]: {
-    color: (theme.vars || theme).palette.action.disabled
-  },
-  variants: [{
-    props: ({
-      ownerState
-    }) => ownerState.open,
-    style: {
-      transform: 'rotate(180deg)'
-    }
-  }, {
-    props: {
-      variant: 'filled'
-    },
-    style: {
-      right: 7
-    }
-  }, {
-    props: {
-      variant: 'outlined'
-    },
-    style: {
-      right: 7
-    }
-  }]
-}));
-const NativeSelectIcon = styled(StyledSelectIcon, {
-  name: 'MuiNativeSelect',
-  slot: 'Icon',
-  overridesResolver: (props, styles) => {
-    const {
-      ownerState
-    } = props;
-    return [styles.icon, ownerState.variant && styles[`icon${capitalize(ownerState.variant)}`], ownerState.open && styles.iconOpen];
-  }
-})({});
-
-/**
- * @ignore - internal component.
- */
-const NativeSelectInput = /*#__PURE__*/React.forwardRef(function NativeSelectInput(props, ref) {
-  const {
-    className,
-    disabled,
-    error,
-    IconComponent,
-    inputRef,
-    variant = 'standard',
-    ...other
-  } = props;
-  const ownerState = {
-    ...props,
-    disabled,
-    variant,
-    error
-  };
-  const classes = useUtilityClasses(ownerState);
-  return /*#__PURE__*/_jsxs(React.Fragment, {
-    children: [/*#__PURE__*/_jsx(NativeSelectSelect, {
-      ownerState: ownerState,
-      className: clsx(classes.select, className),
-      disabled: disabled,
-      ref: inputRef || ref,
-      ...other
-    }), props.multiple ? null : /*#__PURE__*/_jsx(NativeSelectIcon, {
-      as: IconComponent,
-      ownerState: ownerState,
-      className: classes.icon
-    })]
-  });
-});
-process.env.NODE_ENV !== "production" ? NativeSelectInput.propTypes = {
-  /**
-   * The option elements to populate the select with.
-   * Can be some `<option>` elements.
-   */
-  children: PropTypes.node,
-  /**
-   * Override or extend the styles applied to the component.
-   */
-  classes: PropTypes.object,
-  /**
-   * The CSS class name of the select element.
-   */
-  className: PropTypes.string,
-  /**
-   * If `true`, the select is disabled.
-   */
-  disabled: PropTypes.bool,
-  /**
-   * If `true`, the `select input` will indicate an error.
-   */
-  error: PropTypes.bool,
-  /**
-   * The icon that displays the arrow.
-   */
-  IconComponent: PropTypes.elementType.isRequired,
-  /**
-   * Use that prop to pass a ref to the native select element.
-   * @deprecated
-   */
-  inputRef: refType,
-  /**
-   * @ignore
-   */
-  multiple: PropTypes.bool,
-  /**
-   * Name attribute of the `select` or hidden `input` element.
-   */
-  name: PropTypes.string,
-  /**
-   * Callback fired when a menu item is selected.
-   *
-   * @param {object} event The event source of the callback.
-   * You can pull out the new value by accessing `event.target.value` (string).
-   */
-  onChange: PropTypes.func,
-  /**
-   * The input value.
-   */
-  value: PropTypes.any,
-  /**
-   * The variant to use.
-   */
-  variant: PropTypes.oneOf(['standard', 'outlined', 'filled'])
-} : void 0;
-export default NativeSelectInput;

package/esm/NativeSelect/index.d.ts

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

package/esm/NativeSelect/index.js

@@ -1,3 +0,0 @@
-export { default } from "./NativeSelect.js";
-export { default as nativeSelectClasses } from "./nativeSelectClasses.js";
-export * from "./nativeSelectClasses.js";

package/esm/NativeSelect/nativeSelectClasses.d.ts

@@ -1,34 +0,0 @@
-export interface NativeSelectClasses {
-  /** Styles applied to the root element. */
-  root: string;
-  /** Styles applied to the select component `select` class. */
-  select: string;
-  /** Styles applied to the select component if `multiple={true}`. */
-  multiple: string;
-  /** Styles applied to the select component if `variant="filled"`. */
-  filled: string;
-  /** Styles applied to the select component if `variant="outlined"`. */
-  outlined: string;
-  /** Styles applied to the select component if `variant="standard"`. */
-  standard: string;
-  /** State class applied to the select component `disabled` class. */
-  disabled: string;
-  /** Styles applied to the icon component. */
-  icon: string;
-  /** Styles applied to the icon component if the popup is open. */
-  iconOpen: string;
-  /** Styles applied to the icon component if `variant="filled"`. */
-  iconFilled: string;
-  /** Styles applied to the icon component if `variant="outlined"`. */
-  iconOutlined: string;
-  /** Styles applied to the icon component if `variant="standard"`. */
-  iconStandard: string;
-  /** Styles applied to the underlying native input component. */
-  nativeInput: string;
-  /** State class applied to the select component `error` class. */
-  error: string;
-}
-export type NativeSelectClassKey = keyof NativeSelectClasses;
-export declare function getNativeSelectUtilityClasses(slot: string): string;
-declare const nativeSelectClasses: NativeSelectClasses;
-export default nativeSelectClasses;

package/esm/NativeSelect/nativeSelectClasses.js

@@ -1,7 +0,0 @@
-import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
-import generateUtilityClass from '@mui/utils/generateUtilityClass';
-export function getNativeSelectUtilityClasses(slot) {
-  return generateUtilityClass('MuiNativeSelect', slot);
-}
-const nativeSelectClasses = generateUtilityClasses('MuiNativeSelect', ['root', 'select', 'multiple', 'filled', 'outlined', 'standard', 'disabled', 'icon', 'iconOpen', 'iconFilled', 'iconOutlined', 'iconStandard', 'nativeInput', 'error']);
-export default nativeSelectClasses;

package/esm/NoSsr/NoSsr.d.ts

@@ -1,25 +0,0 @@
-import * as React from 'react';
-import { NoSsrProps } from "./NoSsr.types.js";
-/**
- * NoSsr purposely removes components from the subject of Server Side Rendering (SSR).
- *
- * This component can be useful in a variety of situations:
- *
- * * Escape hatch for broken dependencies not supporting SSR.
- * * Improve the time-to-first paint on the client by only rendering above the fold.
- * * Reduce the rendering time on the server.
- * * Under too heavy server load, you can turn on service degradation.
- *
- * Demos:
- *
- * - [No SSR](https://mui.com/material-ui/react-no-ssr/)
- *
- * API:
- *
- * - [NoSsr API](https://mui.com/material-ui/api/no-ssr/)
- */
-declare function NoSsr(props: NoSsrProps): React.JSX.Element;
-declare namespace NoSsr {
-  var propTypes: any;
-}
-export default NoSsr;

package/esm/NoSsr/NoSsr.js

@@ -1,71 +0,0 @@
-'use client';
-
-import * as React from 'react';
-import PropTypes from 'prop-types';
-import useEnhancedEffect from '@mui/utils/useEnhancedEffect';
-import exactProp from '@mui/utils/exactProp';
-/**
- * NoSsr purposely removes components from the subject of Server Side Rendering (SSR).
- *
- * This component can be useful in a variety of situations:
- *
- * * Escape hatch for broken dependencies not supporting SSR.
- * * Improve the time-to-first paint on the client by only rendering above the fold.
- * * Reduce the rendering time on the server.
- * * Under too heavy server load, you can turn on service degradation.
- *
- * Demos:
- *
- * - [No SSR](https://mui.com/material-ui/react-no-ssr/)
- *
- * API:
- *
- * - [NoSsr API](https://mui.com/material-ui/api/no-ssr/)
- */
-function NoSsr(props) {
-  const {
-    children,
-    defer = false,
-    fallback = null
-  } = props;
-  const [mountedState, setMountedState] = React.useState(false);
-  useEnhancedEffect(() => {
-    if (!defer) {
-      setMountedState(true);
-    }
-  }, [defer]);
-  React.useEffect(() => {
-    if (defer) {
-      setMountedState(true);
-    }
-  }, [defer]);
-
-  // TODO casting won't be needed at one point https://github.com/DefinitelyTyped/DefinitelyTyped/pull/65135
-  return mountedState ? children : fallback;
-}
-process.env.NODE_ENV !== "production" ? NoSsr.propTypes /* remove-proptypes */ = {
-  // ┌────────────────────────────── Warning ──────────────────────────────┐
-  // │ These PropTypes are generated from the TypeScript type definitions. │
-  // │ To update them, edit the TypeScript types and run `pnpm proptypes`. │
-  // └─────────────────────────────────────────────────────────────────────┘
-  /**
-   * You can wrap a node.
-   */
-  children: PropTypes.node,
-  /**
-   * If `true`, the component will not only prevent server-side rendering.
-   * It will also defer the rendering of the children into a different screen frame.
-   * @default false
-   */
-  defer: PropTypes.bool,
-  /**
-   * The fallback content to display.
-   * @default null
-   */
-  fallback: PropTypes.node
-} : void 0;
-if (process.env.NODE_ENV !== 'production') {
-  // eslint-disable-next-line
-  NoSsr['propTypes' + ''] = exactProp(NoSsr.propTypes);
-}
-export default NoSsr;

package/esm/NoSsr/NoSsr.types.d.ts

@@ -1,18 +0,0 @@
-import * as React from 'react';
-export interface NoSsrProps {
-  /**
-   * You can wrap a node.
-   */
-  children?: React.ReactNode;
-  /**
-   * If `true`, the component will not only prevent server-side rendering.
-   * It will also defer the rendering of the children into a different screen frame.
-   * @default false
-   */
-  defer?: boolean;
-  /**
-   * The fallback content to display.
-   * @default null
-   */
-  fallback?: React.ReactNode;
-}

package/esm/NoSsr/NoSsr.types.js

@@ -1 +0,0 @@
-export {};

package/esm/NoSsr/index.d.ts

@@ -1,3 +0,0 @@
-export { default } from "./NoSsr.js";
-export * from "./NoSsr.js";
-export * from "./NoSsr.types.js";

package/esm/NoSsr/index.js

@@ -1 +0,0 @@
-export { default } from "./NoSsr.js";

package/esm/OutlinedInput/NotchedOutline.d.ts

@@ -1,12 +0,0 @@
-import * as React from 'react';
-import { InternalStandardProps as StandardProps } from "../index.js";
-export interface NotchedOutlineProps extends StandardProps<React.FieldsetHTMLAttributes<HTMLFieldSetElement>> {
-  disabled?: boolean;
-  error?: boolean;
-  focused?: boolean;
-  label?: React.ReactNode;
-  notched: boolean;
-}
-export type NotchedOutlineClassKey = keyof NonNullable<NotchedOutlineProps['classes']>;
-declare const NotchedOutline: React.JSXElementConstructor<NotchedOutlineProps>;
-export default NotchedOutline;

package/esm/OutlinedInput/NotchedOutline.js

@@ -1,154 +0,0 @@
-'use client';
-
-var _span;
-import * as React from 'react';
-import PropTypes from 'prop-types';
-import rootShouldForwardProp from "../styles/rootShouldForwardProp.js";
-import { styled } from "../zero-styled/index.js";
-import memoTheme from "../utils/memoTheme.js";
-import { jsx as _jsx } from "react/jsx-runtime";
-const NotchedOutlineRoot = styled('fieldset', {
-  shouldForwardProp: rootShouldForwardProp
-})({
-  textAlign: 'left',
-  position: 'absolute',
-  bottom: 0,
-  right: 0,
-  top: -5,
-  left: 0,
-  margin: 0,
-  padding: '0 8px',
-  pointerEvents: 'none',
-  borderRadius: 'inherit',
-  borderStyle: 'solid',
-  borderWidth: 1,
-  overflow: 'hidden',
-  minWidth: '0%'
-});
-const NotchedOutlineLegend = styled('legend', {
-  shouldForwardProp: rootShouldForwardProp
-})(memoTheme(({
-  theme
-}) => ({
-  float: 'unset',
-  // Fix conflict with bootstrap
-  width: 'auto',
-  // Fix conflict with bootstrap
-  overflow: 'hidden',
-  // Fix Horizontal scroll when label too long
-  variants: [{
-    props: ({
-      ownerState
-    }) => !ownerState.withLabel,
-    style: {
-      padding: 0,
-      lineHeight: '11px',
-      // sync with `height` in `legend` styles
-      transition: theme.transitions.create('width', {
-        duration: 150,
-        easing: theme.transitions.easing.easeOut
-      })
-    }
-  }, {
-    props: ({
-      ownerState
-    }) => ownerState.withLabel,
-    style: {
-      display: 'block',
-      // Fix conflict with normalize.css and sanitize.css
-      padding: 0,
-      height: 11,
-      // sync with `lineHeight` in `legend` styles
-      fontSize: '0.75em',
-      visibility: 'hidden',
-      maxWidth: 0.01,
-      transition: theme.transitions.create('max-width', {
-        duration: 50,
-        easing: theme.transitions.easing.easeOut
-      }),
-      whiteSpace: 'nowrap',
-      '& > span': {
-        paddingLeft: 5,
-        paddingRight: 5,
-        display: 'inline-block',
-        opacity: 0,
-        visibility: 'visible'
-      }
-    }
-  }, {
-    props: ({
-      ownerState
-    }) => ownerState.withLabel && ownerState.notched,
-    style: {
-      maxWidth: '100%',
-      transition: theme.transitions.create('max-width', {
-        duration: 100,
-        easing: theme.transitions.easing.easeOut,
-        delay: 50
-      })
-    }
-  }]
-})));
-
-/**
- * @ignore - internal component.
- */
-export default function NotchedOutline(props) {
-  const {
-    children,
-    classes,
-    className,
-    label,
-    notched,
-    ...other
-  } = props;
-  const withLabel = label != null && label !== '';
-  const ownerState = {
-    ...props,
-    notched,
-    withLabel
-  };
-  return /*#__PURE__*/_jsx(NotchedOutlineRoot, {
-    "aria-hidden": true,
-    className: className,
-    ownerState: ownerState,
-    ...other,
-    children: /*#__PURE__*/_jsx(NotchedOutlineLegend, {
-      ownerState: ownerState,
-      children: withLabel ? /*#__PURE__*/_jsx("span", {
-        children: label
-      }) : // notranslate needed while Google Translate will not fix zero-width space issue
-      _span || (_span = /*#__PURE__*/_jsx("span", {
-        className: "notranslate",
-        "aria-hidden": true,
-        children: "\u200B"
-      }))
-    })
-  });
-}
-process.env.NODE_ENV !== "production" ? NotchedOutline.propTypes /* remove-proptypes */ = {
-  /**
-   * The content of the component.
-   */
-  children: PropTypes.node,
-  /**
-   * Override or extend the styles applied to the component.
-   */
-  classes: PropTypes.object,
-  /**
-   * @ignore
-   */
-  className: PropTypes.string,
-  /**
-   * The label.
-   */
-  label: PropTypes.node,
-  /**
-   * If `true`, the outline is notched to accommodate the label.
-   */
-  notched: PropTypes.bool.isRequired,
-  /**
-   * @ignore
-   */
-  style: PropTypes.object
-} : void 0;

package/esm/OutlinedInput/OutlinedInput.d.ts

@@ -1,54 +0,0 @@
-import * as React from 'react';
-import { SxProps } from '@mui/system';
-import { CreateSlotsAndSlotProps, SlotProps, InternalStandardProps as StandardProps, Theme } from "../index.js";
-import { InputBaseProps } from "../InputBase/index.js";
-import { OutlinedInputClasses } from "./outlinedInputClasses.js";
-interface OutlinedInputSlots {
-  /**
-   * The component that renders the notchedOutline slot.
-   * @default NotchedOutline
-   */
-  notchedOutline: React.ElementType;
-}
-type OutlinedInputSlotsAndSlotProps = CreateSlotsAndSlotProps<OutlinedInputSlots, {
-  notchedOutline: SlotProps<'fieldset', {}, OutlinedInputOwnerState>;
-}> & {
-  slots?: InputBaseProps['slots'];
-  slotProps?: InputBaseProps['slotProps'];
-};
-export interface OutlinedInputProps extends Omit<StandardProps<InputBaseProps>, 'slots' | 'slotProps'>, OutlinedInputSlotsAndSlotProps {
-  /**
-   * Override or extend the styles applied to the component.
-   */
-  classes?: Partial<OutlinedInputClasses>;
-  /**
-   * The label of the `input`. It is only used for layout. The actual labelling
-   * is handled by `InputLabel`.
-   */
-  label?: React.ReactNode;
-  /**
-   * If `true`, the outline is notched to accommodate the label.
-   */
-  notched?: boolean;
-  /**
-   * The system prop that allows defining system overrides as well as additional CSS styles.
-   */
-  sx?: SxProps<Theme>;
-}
-export interface OutlinedInputOwnerState extends Omit<OutlinedInputProps, 'slots' | 'slotProps'> {}
-
-/**
- *
- * Demos:
- *
- * - [Text Field](https://mui.com/material-ui/react-text-field/)
- *
- * API:
- *
- * - [OutlinedInput API](https://mui.com/material-ui/api/outlined-input/)
- * - inherits [InputBase API](https://mui.com/material-ui/api/input-base/)
- */
-declare const OutlinedInput: ((props: OutlinedInputProps) => React.JSX.Element) & {
-  muiName: string;
-};
-export default OutlinedInput;