@redsift/design-system 11.5.0 → 11.6.0-muiv5-alpha.0

package/components/button-link/ButtonLink.js

@@ -0,0 +1,85 @@
+import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import React__default, { forwardRef } from 'react';
+import classNames from 'classnames';
+import { StyledGradientBorder } from '../gradient-border/index.js';
+import { ButtonVariant } from '../button/types.js';
+import { useTheme } from '../theme/useTheme.js';
+import { ButtonsColorPalette } from '../../types/colors.js';
+import { ConditionalWrapper } from '../conditional-wrapper/ConditionalWrapper.js';
+import { StyledButton } from '../button/styles.js';
+import { Icon } from '../icon/Icon.js';
+
+const _excluded = ["as", "children", "className", "color", "href", "isActive", "isDisabled", "isHovered", "leftIcon", "leftIconProps", "rightIcon", "rightIconProps", "target", "theme", "variant"];
+const COMPONENT_NAME = 'ButtonLink';
+const CLASSNAME = 'redsift-button-link';
+
+/**
+ * The ButtonLink is a semantic link that looks like a button.
+ *
+ * For a semantic button that looks like a button, please use the Button component.
+ * For a semantic link that looks like a link, please use the Link component.
+ * For a semantic button that looks like a link, please use the LinkButton component.
+ */
+const ButtonLink = /*#__PURE__*/forwardRef((props, ref) => {
+  const {
+      as,
+      children,
+      className,
+      color: propsColor,
+      href,
+      isActive,
+      isDisabled,
+      isHovered,
+      leftIcon,
+      leftIconProps,
+      rightIcon,
+      rightIconProps,
+      target,
+      theme: propsTheme,
+      variant: propsVariant
+    } = props,
+    forwardedProps = _objectWithoutProperties(props, _excluded);
+  const theme = useTheme(propsTheme);
+  const color = Object.values(ButtonsColorPalette).includes(propsColor) ? propsColor : 'primary';
+  const variant = Object.values(ButtonVariant).includes(propsVariant) ? propsVariant : 'primary';
+  const isGradient = color === ButtonsColorPalette.radar;
+  return /*#__PURE__*/React__default.createElement(ConditionalWrapper, {
+    condition: isGradient && variant === ButtonVariant.secondary,
+    wrapper: children => /*#__PURE__*/React__default.createElement(StyledGradientBorder, {
+      $color: color,
+      $isActive: isActive,
+      $isDisabled: isDisabled,
+      $isHovered: isHovered,
+      $theme: theme
+    }, children)
+  }, /*#__PURE__*/React__default.createElement(StyledButton, _extends({
+    as: as || 'a',
+    role: "link",
+    tabIndex: !isDisabled ? 0 : undefined
+  }, forwardedProps, {
+    $color: color,
+    $isActive: isActive,
+    $isDisabled: isDisabled,
+    $isHovered: isHovered,
+    $isGradient: isGradient,
+    $theme: theme,
+    $variant: variant,
+    className: classNames(ButtonLink.className, className),
+    href: !isDisabled ? href : undefined,
+    ref: ref,
+    target: target
+  }), leftIcon ? /*#__PURE__*/React__default.createElement(Icon, _extends({
+    icon: leftIcon,
+    "aria-hidden": "true",
+    className: "left"
+  }, leftIconProps)) : null, /*#__PURE__*/React__default.createElement("span", null, children), rightIcon ? /*#__PURE__*/React__default.createElement(Icon, _extends({
+    icon: rightIcon,
+    "aria-hidden": "true",
+    className: "right"
+  }, rightIconProps)) : null));
+});
+ButtonLink.className = CLASSNAME;
+ButtonLink.displayName = COMPONENT_NAME;
+
+export { ButtonLink };
+//# sourceMappingURL=ButtonLink.js.map

package/components/button-link/ButtonLink.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonLink.js","sources":["../../../src/components/button-link/ButtonLink.tsx"],"sourcesContent":["import React, { forwardRef, RefObject } from 'react';\nimport classNames from 'classnames';\nimport { Comp, ButtonsColorPalette } from '../../types';\nimport { Icon } from '../icon';\nimport { ButtonVariant, StyledButton } from '../button';\nimport { ButtonLinkProps } from './types';\nimport { useTheme } from '../theme';\nimport { ConditionalWrapper } from '../conditional-wrapper';\nimport { StyledGradientBorder } from '../gradient-border';\n\nconst COMPONENT_NAME = 'ButtonLink';\nconst CLASSNAME = 'redsift-button-link';\n\n/**\n * The ButtonLink is a semantic link that looks like a button.\n *\n * For a semantic button that looks like a button, please use the Button component.\n * For a semantic link that looks like a link, please use the Link component.\n * For a semantic button that looks like a link, please use the LinkButton component.\n */\nexport const ButtonLink: Comp<ButtonLinkProps, HTMLAnchorElement> = forwardRef((props, ref) => {\n  const {\n    as,\n    children,\n    className,\n    color: propsColor,\n    href,\n    isActive,\n    isDisabled,\n    isHovered,\n    leftIcon,\n    leftIconProps,\n    rightIcon,\n    rightIconProps,\n    target,\n    theme: propsTheme,\n    variant: propsVariant,\n    ...forwardedProps\n  } = props;\n\n  const theme = useTheme(propsTheme);\n  const color = Object.values(ButtonsColorPalette).includes(propsColor!) ? propsColor : 'primary';\n  const variant = Object.values(ButtonVariant).includes(propsVariant!) ? propsVariant : 'primary';\n  const isGradient = color === ButtonsColorPalette.radar;\n\n  return (\n    <ConditionalWrapper\n      condition={isGradient && variant === ButtonVariant.secondary}\n      wrapper={(children) => (\n        <StyledGradientBorder\n          $color={color}\n          $isActive={isActive}\n          $isDisabled={isDisabled}\n          $isHovered={isHovered}\n          $theme={theme}\n        >\n          {children}\n        </StyledGradientBorder>\n      )}\n    >\n      <StyledButton\n        as={(as || 'a') as any}\n        role=\"link\"\n        tabIndex={!isDisabled ? 0 : undefined}\n        {...forwardedProps}\n        $color={color}\n        $isActive={isActive}\n        $isDisabled={isDisabled}\n        $isHovered={isHovered}\n        $isGradient={isGradient}\n        $theme={theme}\n        $variant={variant}\n        className={classNames(ButtonLink.className, className)}\n        href={!isDisabled ? href : undefined}\n        ref={ref as RefObject<HTMLAnchorElement>}\n        target={target}\n      >\n        {leftIcon ? <Icon icon={leftIcon} aria-hidden=\"true\" className=\"left\" {...leftIconProps} /> : null}\n        <span>{children}</span>\n        {rightIcon ? <Icon icon={rightIcon} aria-hidden=\"true\" className=\"right\" {...rightIconProps} /> : null}\n      </StyledButton>\n    </ConditionalWrapper>\n  );\n});\nButtonLink.className = CLASSNAME;\nButtonLink.displayName = COMPONENT_NAME;\n"],"names":["COMPONENT_NAME","CLASSNAME","ButtonLink","forwardRef","props","ref","as","children","className","color","propsColor","href","isActive","isDisabled","isHovered","leftIcon","leftIconProps","rightIcon","rightIconProps","target","theme","propsTheme","variant","propsVariant","forwardedProps","_objectWithoutProperties","_excluded","useTheme","Object","values","ButtonsColorPalette","includes","ButtonVariant","isGradient","radar","React","createElement","ConditionalWrapper","condition","secondary","wrapper","StyledGradientBorder","$color","$isActive","$isDisabled","$isHovered","$theme","StyledButton","_extends","role","tabIndex","undefined","$isGradient","$variant","classNames","Icon","icon","displayName"],"mappings":"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"}

package/components/button-link/types.d.ts

@@ -0,0 +1,18 @@
+import { LinkProps } from '../link/types.js';
+import { ButtonProps } from '../button/types.js';
+
+/**
+ * Component props.
+ */
+interface ButtonLinkProps extends Omit<LinkProps, 'color'>, Pick<ButtonProps, 'color' | 'isActive' | 'isDisabled' | 'isHovered' | 'leftIcon' | 'leftIconProps' | 'rightIconProps' | 'rightIcon' | 'variant' | 'theme'> {
+}
+type StyledButtonLinkProps = ButtonLinkProps & {
+    $isActive: ButtonLinkProps['isActive'];
+    $isDisabled: ButtonLinkProps['isDisabled'];
+    $isHovered: ButtonLinkProps['isHovered'];
+    $variant: ButtonLinkProps['variant'];
+    $theme: ButtonLinkProps['theme'];
+    $color: ButtonLinkProps['color'];
+};
+
+export { ButtonLinkProps, StyledButtonLinkProps };

package/components/card/Card.d.ts

@@ -0,0 +1,13 @@
+import { CardProps } from './types.js';
+import { Comp } from '../../types/helpers.js';
+import { CardHeaderProps } from '../card-header/types.js';
+import { CardBodyProps } from '../card-body/types.js';
+import { CardActionsProps } from '../card-actions/types.js';
+
+declare const Card: Comp<CardProps, HTMLDivElement> & {
+    Header: Comp<CardHeaderProps, HTMLDivElement>;
+    Body: Comp<CardBodyProps, HTMLDivElement>;
+    Actions: Comp<CardActionsProps, HTMLDivElement>;
+};
+
+export { Card };

package/components/card/Card.js

@@ -0,0 +1,81 @@
+import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import React__default, { forwardRef, useState, useEffect, useCallback } from 'react';
+import classNames from 'classnames';
+import intlMessages from './intl/index.js';
+import { mdiChevronDown, mdiChevronUp } from '@redsift/icons';
+import { StyledCard } from './styles.js';
+import { partitionComponents } from '../../utils/partitionComponents.js';
+import { isComponent } from '../../utils/isComponent.js';
+import { CardHeader } from '../card-header/CardHeader.js';
+import { CardBody } from '../card-body/CardBody.js';
+import { CardActions } from '../card-actions/CardActions.js';
+import { useMessageFormatter } from '../../react-aria/react-aria/i18n/useMessageFormatter.js';
+import { useTheme } from '../theme/useTheme.js';
+import { ThemeProvider } from '../theme/context.js';
+import { IconButton } from '../icon-button/IconButton.js';
+
+const _excluded = ["children", "className", "defaultCollapsed", "isCollapsed", "isCollapsible", "onCollapse", "theme"];
+const COMPONENT_NAME = 'Card';
+const CLASSNAME = 'redsift-card';
+
+/**
+ * The Card component.
+ */
+const BaseCard = /*#__PURE__*/forwardRef((props, ref) => {
+  const {
+      children,
+      className,
+      defaultCollapsed,
+      isCollapsed: propsIsCollapsed,
+      isCollapsible,
+      onCollapse,
+      theme: propsTheme
+    } = props,
+    forwardedProps = _objectWithoutProperties(props, _excluded);
+  const theme = useTheme(propsTheme);
+  const format = useMessageFormatter(intlMessages);
+  const [isCollapsed, setIsCollapsed] = useState(propsIsCollapsed !== null && propsIsCollapsed !== void 0 ? propsIsCollapsed : defaultCollapsed);
+  useEffect(() => {
+    setIsCollapsed(propsIsCollapsed !== null && propsIsCollapsed !== void 0 ? propsIsCollapsed : defaultCollapsed);
+  }, [propsIsCollapsed, defaultCollapsed]);
+  const handleCollapse = useCallback(collapsed => {
+    if (onCollapse) {
+      onCollapse(collapsed);
+    }
+    if (propsIsCollapsed === undefined || propsIsCollapsed === null) {
+      setIsCollapsed(collapsed);
+    }
+  }, [onCollapse]);
+  const [[header], [body], [actions]] = partitionComponents(React__default.Children.toArray(children), [isComponent('CardHeader'), isComponent('CardBody'), isComponent('CardActions')]);
+  return /*#__PURE__*/React__default.createElement(ThemeProvider, {
+    value: {
+      theme
+    }
+  }, /*#__PURE__*/React__default.createElement(StyledCard, _extends({}, forwardedProps, {
+    className: classNames(BaseCard.className, className),
+    ref: ref,
+    $isCollapsed: isCollapsed,
+    $theme: theme
+  }), header || isCollapsible ? /*#__PURE__*/React__default.createElement("div", {
+    className: `${BaseCard.className}__header`
+  }, header && isComponent('CardHeader')(header) ? header : null, isCollapsible ? /*#__PURE__*/React__default.createElement(IconButton, {
+    theme: theme,
+    "aria-label": format(isCollapsed ? 'expand' : 'collapse'),
+    className: `${BaseCard.className}-header__icon-button`,
+    color: "grey",
+    icon: isCollapsed ? mdiChevronDown : mdiChevronUp,
+    onClick: () => handleCollapse(!isCollapsed)
+  }) : null) : null, body || actions ? /*#__PURE__*/React__default.createElement("div", {
+    className: `${BaseCard.className}__content`
+  }, body && isComponent('CardBody')(body) ? body : null, actions && isComponent('CardActions')(actions) ? actions : null) : null));
+});
+BaseCard.className = CLASSNAME;
+BaseCard.displayName = COMPONENT_NAME;
+const Card = Object.assign(BaseCard, {
+  Header: CardHeader,
+  Body: CardBody,
+  Actions: CardActions
+});
+
+export { Card };
+//# sourceMappingURL=Card.js.map

package/components/card/Card.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Card.js","sources":["../../../src/components/card/Card.tsx"],"sourcesContent":["import React, { forwardRef, RefObject, useCallback, useEffect, useState } from 'react';\nimport classNames from 'classnames';\n\nimport { useMessageFormatter } from '../../react-aria/react-aria/i18n';\nimport intlMessages from './intl';\n\nimport { mdiChevronDown, mdiChevronUp } from '@redsift/icons';\nimport { IconButton } from '../icon-button';\nimport { Comp } from '../../types';\nimport { StyledCard } from './styles';\nimport { CardProps } from './types';\nimport { partitionComponents } from '../../utils/partitionComponents';\nimport { isComponent } from '../../utils/isComponent';\nimport { CardHeader } from '../card-header';\nimport { CardBody } from '../card-body';\nimport { CardActions } from '../card-actions';\nimport { ThemeProvider, useTheme } from '../theme';\n\nconst COMPONENT_NAME = 'Card';\nconst CLASSNAME = 'redsift-card';\n\n/**\n * The Card component.\n */\nconst BaseCard: Comp<CardProps, HTMLDivElement> = forwardRef((props, ref) => {\n  const {\n    children,\n    className,\n    defaultCollapsed,\n    isCollapsed: propsIsCollapsed,\n    isCollapsible,\n    onCollapse,\n    theme: propsTheme,\n    ...forwardedProps\n  } = props;\n\n  const theme = useTheme(propsTheme);\n\n  const format = useMessageFormatter(intlMessages);\n\n  const [isCollapsed, setIsCollapsed] = useState(propsIsCollapsed ?? defaultCollapsed);\n\n  useEffect(() => {\n    setIsCollapsed(propsIsCollapsed ?? defaultCollapsed);\n  }, [propsIsCollapsed, defaultCollapsed]);\n\n  const handleCollapse = useCallback(\n    (collapsed: boolean) => {\n      if (onCollapse) {\n        onCollapse(collapsed);\n      }\n      if (propsIsCollapsed === undefined || propsIsCollapsed === null) {\n        setIsCollapsed(collapsed);\n      }\n    },\n    [onCollapse]\n  );\n\n  const [[header], [body], [actions]] = partitionComponents(React.Children.toArray(children), [\n    isComponent('CardHeader'),\n    isComponent('CardBody'),\n    isComponent('CardActions'),\n  ]);\n\n  return (\n    <ThemeProvider value={{ theme }}>\n      <StyledCard\n        {...forwardedProps}\n        className={classNames(BaseCard.className, className)}\n        ref={ref as RefObject<HTMLDivElement>}\n        $isCollapsed={isCollapsed}\n        $theme={theme}\n      >\n        {header || isCollapsible ? (\n          <div className={`${BaseCard.className}__header`}>\n            {header && isComponent('CardHeader')(header) ? header : null}\n\n            {isCollapsible ? (\n              <IconButton\n                theme={theme}\n                aria-label={format(isCollapsed ? 'expand' : 'collapse')}\n                className={`${BaseCard.className}-header__icon-button`}\n                color=\"grey\"\n                icon={isCollapsed ? mdiChevronDown : mdiChevronUp}\n                onClick={() => handleCollapse(!isCollapsed)}\n              />\n            ) : null}\n          </div>\n        ) : null}\n\n        {body || actions ? (\n          <div className={`${BaseCard.className}__content`}>\n            {body && isComponent('CardBody')(body) ? body : null}\n            {actions && isComponent('CardActions')(actions) ? actions : null}\n          </div>\n        ) : null}\n      </StyledCard>\n    </ThemeProvider>\n  );\n});\nBaseCard.className = CLASSNAME;\nBaseCard.displayName = COMPONENT_NAME;\n\nexport const Card = Object.assign(BaseCard, {\n  Header: CardHeader,\n  Body: CardBody,\n  Actions: CardActions,\n});\n"],"names":["COMPONENT_NAME","CLASSNAME","BaseCard","forwardRef","props","ref","children","className","defaultCollapsed","isCollapsed","propsIsCollapsed","isCollapsible","onCollapse","theme","propsTheme","forwardedProps","_objectWithoutProperties","_excluded","useTheme","format","useMessageFormatter","intlMessages","setIsCollapsed","useState","useEffect","handleCollapse","useCallback","collapsed","undefined","header","body","actions","partitionComponents","React","Children","toArray","isComponent","createElement","ThemeProvider","value","StyledCard","_extends","classNames","$isCollapsed","$theme","IconButton","color","icon","mdiChevronDown","mdiChevronUp","onClick","displayName","Card","Object","assign","Header","CardHeader","Body","CardBody","Actions","CardActions"],"mappings":"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"}

package/components/card/intl/en-US.json.js

@@ -0,0 +1,9 @@
+var collapse = "Collapse";
+var expand = "Expand";
+var enUS = {
+	collapse: collapse,
+	expand: expand
+};
+
+export { collapse, enUS as default, expand };
+//# sourceMappingURL=en-US.json.js.map

package/components/card/intl/en-US.json.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"en-US.json.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;"}

package/components/card/intl/fr-FR.json.js

@@ -0,0 +1,9 @@
+var collapse = "Réduire";
+var expand = "Développer";
+var frFR = {
+	collapse: collapse,
+	expand: expand
+};
+
+export { collapse, frFR as default, expand };
+//# sourceMappingURL=fr-FR.json.js.map

package/components/card/intl/fr-FR.json.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"fr-FR.json.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;"}

package/components/card/intl/index.js

@@ -0,0 +1,10 @@
+import enUS from './en-US.json.js';
+import frFR from './fr-FR.json.js';
+
+var intlMessages = {
+  'en-US': enUS,
+  'fr-FR': frFR
+};
+
+export { intlMessages as default };
+//# sourceMappingURL=index.js.map

package/components/card/intl/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../src/components/card/intl/index.ts"],"sourcesContent":["import enUS from './en-US.json';\nimport frFR from './fr-FR.json';\n\nexport default {\n  'en-US': enUS,\n  'fr-FR': frFR,\n};\n"],"names":["enUS","frFR"],"mappings":";;;AAGA,mBAAe;AACb,EAAA,OAAO,EAAEA,IAAI;AACb,EAAA,OAAO,EAAEC,IAAAA;AACX,CAAC;;;;"}

package/components/card/styles.js

@@ -0,0 +1,63 @@
+import styled, { css } from 'styled-components';
+import { baseStyling } from '../shared/styles.js';
+import { Theme } from '../../types/colors.js';
+
+/**
+ * Component style.
+ */
+const StyledCard = styled.div`
+  ${baseStyling}
+
+  ${_ref => {
+  let {
+    $theme
+  } = _ref;
+  return css`
+    color: var(--redsift-color-neutral-${$theme === Theme.dark ? 'white' : 'x-dark-grey'});
+  `;
+}}
+
+  display: flex;
+  flex-direction: column;
+
+  .redsift-card__header {
+    align-items: flex-start;
+    display: flex;
+    justify-content: space-between;
+  }
+
+  .redsift-card-header__icon-button {
+    margin-top: 8px;
+    margin-left: auto;
+    margin-right: 8px;
+
+    [dir='rtl'] & {
+      margin-left: 8px;
+      margin-right: auto;
+    }
+  }
+
+  .redsift-card__content {
+    visibility: ${_ref2 => {
+  let {
+    $isCollapsed
+  } = _ref2;
+  return !$isCollapsed ? 'visible' : 'hidden';
+}};
+    overflow: ${_ref3 => {
+  let {
+    $isCollapsed
+  } = _ref3;
+  return !$isCollapsed ? 'visible' : 'hidden';
+}};
+    height: ${_ref4 => {
+  let {
+    $isCollapsed
+  } = _ref4;
+  return !$isCollapsed ? 'auto' : '0px';
+}};
+  }
+`;
+
+export { StyledCard };
+//# sourceMappingURL=styles.js.map

package/components/card/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.js","sources":["../../../src/components/card/styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport { baseStyling } from '../shared';\nimport { StyledCardProps } from './types';\nimport { Theme } from '@redsift/design-system/types';\n\n/**\n * Component style.\n */\nexport const StyledCard = styled.div<StyledCardProps>`\n  ${baseStyling}\n\n  ${({ $theme }) => css`\n    color: var(--redsift-color-neutral-${$theme === Theme.dark ? 'white' : 'x-dark-grey'});\n  `}\n\n  display: flex;\n  flex-direction: column;\n\n  .redsift-card__header {\n    align-items: flex-start;\n    display: flex;\n    justify-content: space-between;\n  }\n\n  .redsift-card-header__icon-button {\n    margin-top: 8px;\n    margin-left: auto;\n    margin-right: 8px;\n\n    [dir='rtl'] & {\n      margin-left: 8px;\n      margin-right: auto;\n    }\n  }\n\n  .redsift-card__content {\n    visibility: ${({ $isCollapsed }) => (!$isCollapsed ? 'visible' : 'hidden')};\n    overflow: ${({ $isCollapsed }) => (!$isCollapsed ? 'visible' : 'hidden')};\n    height: ${({ $isCollapsed }) => (!$isCollapsed ? 'auto' : '0px')};\n  }\n`;\n"],"names":["StyledCard","styled","div","baseStyling","_ref","$theme","css","Theme","dark","_ref2","$isCollapsed","_ref3","_ref4"],"mappings":";;;;AAKA;AACA;AACA;AACaA,MAAAA,UAAU,GAAGC,MAAM,CAACC,GAAqB,CAAA;AACtD,EAAA,EAAIC,WAAY,CAAA;AAChB;AACA,EAAA,EAAIC,IAAA,IAAA;EAAA,IAAC;AAAEC,IAAAA,MAAAA;AAAO,GAAC,GAAAD,IAAA,CAAA;AAAA,EAAA,OAAKE,GAAI,CAAA;AACxB,uCAAyCD,EAAAA,MAAM,KAAKE,KAAK,CAACC,IAAI,GAAG,OAAO,GAAG,aAAc,CAAA;AACzF,EAAG,CAAA,CAAA;AAAA,CAAC,CAAA;AACJ;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,gBAAA,EAAkBC,KAAA,IAAA;EAAA,IAAC;AAAEC,IAAAA,YAAAA;AAAa,GAAC,GAAAD,KAAA,CAAA;AAAA,EAAA,OAAM,CAACC,YAAY,GAAG,SAAS,GAAG,QAAQ,CAAA;AAAA,CAAE,CAAA;AAC/E,cAAA,EAAgBC,KAAA,IAAA;EAAA,IAAC;AAAED,IAAAA,YAAAA;AAAa,GAAC,GAAAC,KAAA,CAAA;AAAA,EAAA,OAAM,CAACD,YAAY,GAAG,SAAS,GAAG,QAAQ,CAAA;AAAA,CAAE,CAAA;AAC7E,YAAA,EAAcE,KAAA,IAAA;EAAA,IAAC;AAAEF,IAAAA,YAAAA;AAAa,GAAC,GAAAE,KAAA,CAAA;AAAA,EAAA,OAAM,CAACF,YAAY,GAAG,MAAM,GAAG,KAAK,CAAA;AAAA,CAAE,CAAA;AACrE;AACA;;;;"}

package/components/card/types.d.ts

@@ -0,0 +1,25 @@
+import { ComponentProps } from 'react';
+import { StylingProps } from '../../types/styles.js';
+import { Theme } from '../../types/colors.js';
+
+/**
+ * Component props.
+ */
+interface CardProps extends ComponentProps<'div'>, StylingProps {
+    /** Default collapse status. Used for uncontrolled version. */
+    defaultCollapsed?: boolean;
+    /** Whether the component is collapsed or not. Used for controlled version. */
+    isCollapsed?: boolean;
+    /** Whether the component can be collapse or not. */
+    isCollapsible?: boolean;
+    /** Method to handle component change. */
+    onCollapse?(isCollapsed: boolean): void;
+    /** Theme. */
+    theme?: Theme;
+}
+type StyledCardProps = Omit<CardProps, 'isCollapsed'> & {
+    $isCollapsed: CardProps['isCollapsed'];
+    $theme: CardProps['theme'];
+};
+
+export { CardProps, StyledCardProps };

package/components/card-actions/CardActions.d.ts

@@ -0,0 +1,9 @@
+import { CardActionsProps } from './types.js';
+import { Comp } from '../../types/helpers.js';
+
+/**
+ * The CardActions component.
+ */
+declare const CardActions: Comp<CardActionsProps, HTMLDivElement>;
+
+export { CardActions };

package/components/card-actions/CardActions.js

@@ -0,0 +1,33 @@
+import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import React__default, { forwardRef } from 'react';
+import classNames from 'classnames';
+import { StyledCardActions } from './styles.js';
+
+const _excluded = ["children", "className", "display", "flexDirection"];
+const COMPONENT_NAME = 'CardActions';
+const CLASSNAME = 'redsift-card-actions';
+
+/**
+ * The CardActions component.
+ */
+const CardActions = /*#__PURE__*/forwardRef((props, ref) => {
+  const {
+      children,
+      className,
+      display = 'flex',
+      flexDirection = 'row'
+    } = props,
+    forwardedProps = _objectWithoutProperties(props, _excluded);
+  return /*#__PURE__*/React__default.createElement(StyledCardActions, _extends({
+    display: display,
+    flexDirection: flexDirection
+  }, forwardedProps, {
+    className: classNames(CardActions.className, className),
+    ref: ref
+  }), children);
+});
+CardActions.className = CLASSNAME;
+CardActions.displayName = COMPONENT_NAME;
+
+export { CardActions };
+//# sourceMappingURL=CardActions.js.map

package/components/card-actions/CardActions.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CardActions.js","sources":["../../../src/components/card-actions/CardActions.tsx"],"sourcesContent":["import React, { forwardRef, RefObject } from 'react';\nimport classNames from 'classnames';\n\nimport { Comp } from '../../types';\nimport { StyledCardActions } from './styles';\nimport { CardActionsProps } from './types';\n\nconst COMPONENT_NAME = 'CardActions';\nconst CLASSNAME = 'redsift-card-actions';\n\n/**\n * The CardActions component.\n */\nexport const CardActions: Comp<CardActionsProps, HTMLDivElement> = forwardRef((props, ref) => {\n  const { children, className, display = 'flex', flexDirection = 'row', ...forwardedProps } = props;\n\n  return (\n    <StyledCardActions\n      display={display}\n      flexDirection={flexDirection}\n      {...forwardedProps}\n      className={classNames(CardActions.className, className)}\n      ref={ref as RefObject<HTMLDivElement>}\n    >\n      {children}\n    </StyledCardActions>\n  );\n});\nCardActions.className = CLASSNAME;\nCardActions.displayName = COMPONENT_NAME;\n"],"names":["COMPONENT_NAME","CLASSNAME","CardActions","forwardRef","props","ref","children","className","display","flexDirection","forwardedProps","_objectWithoutProperties","_excluded","React","createElement","StyledCardActions","_extends","classNames","displayName"],"mappings":";;;;;;AAOA,MAAMA,cAAc,GAAG,aAAa,CAAA;AACpC,MAAMC,SAAS,GAAG,sBAAsB,CAAA;;AAExC;AACA;AACA;AACO,MAAMC,WAAmD,gBAAGC,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAK;EAC5F,MAAM;MAAEC,QAAQ;MAAEC,SAAS;AAAEC,MAAAA,OAAO,GAAG,MAAM;AAAEC,MAAAA,aAAa,GAAG,KAAA;AAAyB,KAAC,GAAGL,KAAK;AAAxBM,IAAAA,cAAc,GAAAC,wBAAA,CAAKP,KAAK,EAAAQ,SAAA,CAAA,CAAA;AAEjG,EAAA,oBACEC,cAAA,CAAAC,aAAA,CAACC,iBAAiB,EAAAC,QAAA,CAAA;AAChBR,IAAAA,OAAO,EAAEA,OAAQ;AACjBC,IAAAA,aAAa,EAAEA,aAAAA;AAAc,GAAA,EACzBC,cAAc,EAAA;IAClBH,SAAS,EAAEU,UAAU,CAACf,WAAW,CAACK,SAAS,EAAEA,SAAS,CAAE;AACxDF,IAAAA,GAAG,EAAEA,GAAAA;AAAiC,GAAA,CAAA,EAErCC,QACgB,CAAC,CAAA;AAExB,CAAC,EAAC;AACFJ,WAAW,CAACK,SAAS,GAAGN,SAAS,CAAA;AACjCC,WAAW,CAACgB,WAAW,GAAGlB,cAAc;;;;"}

package/components/card-actions/styles.js

@@ -0,0 +1,15 @@
+import styled from 'styled-components';
+import { baseContainer } from '../shared/styles.js';
+
+/**
+ * Component style.
+ */
+const StyledCardActions = styled.div`
+  ${baseContainer}
+
+  margin-top: 8px;
+  margin-bottom: 8px;
+`;
+
+export { StyledCardActions };
+//# sourceMappingURL=styles.js.map

package/components/card-actions/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.js","sources":["../../../src/components/card-actions/styles.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { baseContainer } from '../shared';\nimport { StyledCardActionsProps } from './types';\n\n/**\n * Component style.\n */\nexport const StyledCardActions = styled.div<StyledCardActionsProps>`\n  ${baseContainer}\n\n  margin-top: 8px;\n  margin-bottom: 8px;\n`;\n"],"names":["StyledCardActions","styled","div","baseContainer"],"mappings":";;;AAIA;AACA;AACA;AACaA,MAAAA,iBAAiB,GAAGC,MAAM,CAACC,GAA4B,CAAA;AACpE,EAAA,EAAIC,aAAc,CAAA;AAClB;AACA;AACA;AACA;;;;"}

package/components/card-actions/types.d.ts

@@ -0,0 +1,11 @@
+import { ComponentProps } from 'react';
+import { ContainerProps } from '../../types/styles.js';
+
+/**
+ * Component props.
+ */
+interface CardActionsProps extends ComponentProps<'div'>, ContainerProps {
+}
+type StyledCardActionsProps = CardActionsProps;
+
+export { CardActionsProps, StyledCardActionsProps };

package/components/card-body/CardBody.d.ts

@@ -0,0 +1,9 @@
+import { CardBodyProps } from './types.js';
+import { Comp } from '../../types/helpers.js';
+
+/**
+ * The CardBody component.
+ */
+declare const CardBody: Comp<CardBodyProps, HTMLDivElement>;
+
+export { CardBody };

package/components/card-body/CardBody.js

@@ -0,0 +1,28 @@
+import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import React__default, { forwardRef } from 'react';
+import classNames from 'classnames';
+import { StyledCardBody } from './styles.js';
+
+const _excluded = ["children", "className"];
+const COMPONENT_NAME = 'CardBody';
+const CLASSNAME = 'redsift-card-body';
+
+/**
+ * The CardBody component.
+ */
+const CardBody = /*#__PURE__*/forwardRef((props, ref) => {
+  const {
+      children,
+      className
+    } = props,
+    forwardedProps = _objectWithoutProperties(props, _excluded);
+  return /*#__PURE__*/React__default.createElement(StyledCardBody, _extends({}, forwardedProps, {
+    className: classNames(CardBody.className, className),
+    ref: ref
+  }), children);
+});
+CardBody.className = CLASSNAME;
+CardBody.displayName = COMPONENT_NAME;
+
+export { CardBody };
+//# sourceMappingURL=CardBody.js.map

package/components/card-body/CardBody.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CardBody.js","sources":["../../../src/components/card-body/CardBody.tsx"],"sourcesContent":["import React, { forwardRef, RefObject } from 'react';\nimport classNames from 'classnames';\n\nimport { Comp } from '../../types';\nimport { StyledCardBody } from './styles';\nimport { CardBodyProps } from './types';\n\nconst COMPONENT_NAME = 'CardBody';\nconst CLASSNAME = 'redsift-card-body';\n\n/**\n * The CardBody component.\n */\nexport const CardBody: Comp<CardBodyProps, HTMLDivElement> = forwardRef((props, ref) => {\n  const { children, className, ...forwardedProps } = props;\n\n  return (\n    <StyledCardBody\n      {...forwardedProps}\n      className={classNames(CardBody.className, className)}\n      ref={ref as RefObject<HTMLDivElement>}\n    >\n      {children}\n    </StyledCardBody>\n  );\n});\nCardBody.className = CLASSNAME;\nCardBody.displayName = COMPONENT_NAME;\n"],"names":["COMPONENT_NAME","CLASSNAME","CardBody","forwardRef","props","ref","children","className","forwardedProps","_objectWithoutProperties","_excluded","React","createElement","StyledCardBody","_extends","classNames","displayName"],"mappings":";;;;;;AAOA,MAAMA,cAAc,GAAG,UAAU,CAAA;AACjC,MAAMC,SAAS,GAAG,mBAAmB,CAAA;;AAErC;AACA;AACA;AACO,MAAMC,QAA6C,gBAAGC,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAK;EACtF,MAAM;MAAEC,QAAQ;AAAEC,MAAAA,SAAAA;AAA6B,KAAC,GAAGH,KAAK;AAAxBI,IAAAA,cAAc,GAAAC,wBAAA,CAAKL,KAAK,EAAAM,SAAA,CAAA,CAAA;EAExD,oBACEC,cAAA,CAAAC,aAAA,CAACC,cAAc,EAAAC,QAAA,KACTN,cAAc,EAAA;IAClBD,SAAS,EAAEQ,UAAU,CAACb,QAAQ,CAACK,SAAS,EAAEA,SAAS,CAAE;AACrDF,IAAAA,GAAG,EAAEA,GAAAA;AAAiC,GAAA,CAAA,EAErCC,QACa,CAAC,CAAA;AAErB,CAAC,EAAC;AACFJ,QAAQ,CAACK,SAAS,GAAGN,SAAS,CAAA;AAC9BC,QAAQ,CAACc,WAAW,GAAGhB,cAAc;;;;"}

package/components/card-body/styles.js

@@ -0,0 +1,18 @@
+import styled from 'styled-components';
+import { baseContainer } from '../shared/styles.js';
+
+/**
+ * Component style.
+ */
+const StyledCardBody = styled.div`
+  ${baseContainer}
+
+  font-family: var(--redsift-typography-body-font-family);
+  font-size: var(--redsift-typography-body-font-size);
+  font-weight: var(--redsift-typography-body-font-weight);
+  line-height: var(--redsift-typography-body-line-height);
+  padding: 16px 0px;
+`;
+
+export { StyledCardBody };
+//# sourceMappingURL=styles.js.map

package/components/card-body/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.js","sources":["../../../src/components/card-body/styles.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { baseContainer } from '../shared';\nimport { StyledCardBodyProps } from './types';\n\n/**\n * Component style.\n */\nexport const StyledCardBody = styled.div<StyledCardBodyProps>`\n  ${baseContainer}\n\n  font-family: var(--redsift-typography-body-font-family);\n  font-size: var(--redsift-typography-body-font-size);\n  font-weight: var(--redsift-typography-body-font-weight);\n  line-height: var(--redsift-typography-body-line-height);\n  padding: 16px 0px;\n`;\n"],"names":["StyledCardBody","styled","div","baseContainer"],"mappings":";;;AAIA;AACA;AACA;AACaA,MAAAA,cAAc,GAAGC,MAAM,CAACC,GAAyB,CAAA;AAC9D,EAAA,EAAIC,aAAc,CAAA;AAClB;AACA;AACA;AACA;AACA;AACA;AACA;;;;"}

package/components/card-body/types.d.ts

@@ -0,0 +1,11 @@
+import { ComponentProps } from 'react';
+import { ContainerProps } from '../../types/styles.js';
+
+/**
+ * Component props.
+ */
+interface CardBodyProps extends ComponentProps<'div'>, ContainerProps {
+}
+type StyledCardBodyProps = CardBodyProps;
+
+export { CardBodyProps, StyledCardBodyProps };

package/components/card-header/CardHeader.d.ts

@@ -0,0 +1,9 @@
+import { CardHeaderProps } from './types.js';
+import { Comp } from '../../types/helpers.js';
+
+/**
+ * The CardHeader component.
+ */
+declare const CardHeader: Comp<CardHeaderProps, HTMLDivElement>;
+
+export { CardHeader };

package/components/card-header/CardHeader.js

@@ -0,0 +1,56 @@
+import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import React__default, { forwardRef } from 'react';
+import classNames from 'classnames';
+import { StyledCardHeader } from './styles.js';
+import { Skeleton } from '../skeleton/Skeleton.js';
+import { Heading } from '../heading/Heading.js';
+import { Icon } from '../icon/Icon.js';
+
+const _excluded = ["children", "className", "header", "headingProps", "icon", "iconProps", "isLoading", "subheader"];
+const COMPONENT_NAME = 'CardHeader';
+const CLASSNAME = 'redsift-card-header';
+
+/**
+ * The CardHeader component.
+ */
+const CardHeader = /*#__PURE__*/forwardRef((props, ref) => {
+  const {
+      children,
+      className,
+      header,
+      headingProps,
+      icon,
+      iconProps,
+      isLoading,
+      subheader
+    } = props,
+    forwardedProps = _objectWithoutProperties(props, _excluded);
+  return /*#__PURE__*/React__default.createElement(StyledCardHeader, _extends({}, forwardedProps, {
+    className: classNames(CardHeader.className, className),
+    ref: ref
+  }), subheader ? /*#__PURE__*/React__default.createElement(Skeleton.Text, {
+    variant: "body",
+    isLoaded: !isLoading
+  }, /*#__PURE__*/React__default.createElement("div", {
+    className: `${CardHeader.className}__subheader`
+  }, subheader)) : null, header ? /*#__PURE__*/React__default.createElement(Skeleton.Text, {
+    variant: (headingProps === null || headingProps === void 0 ? void 0 : headingProps.variant) || 'h2',
+    isLoaded: !isLoading,
+    marginTop: "10px",
+    marginBottom: "10px"
+  }, /*#__PURE__*/React__default.createElement(Heading, _extends({
+    as: "h2",
+    color: "black",
+    className: `${CardHeader.className}__header`,
+    variant: "h2"
+  }, headingProps), icon ? /*#__PURE__*/React__default.createElement(Icon, _extends({
+    icon: icon,
+    "aria-hidden": "true",
+    size: "large"
+  }, iconProps)) : null, header)) : null, children);
+});
+CardHeader.className = CLASSNAME;
+CardHeader.displayName = COMPONENT_NAME;
+
+export { CardHeader };
+//# sourceMappingURL=CardHeader.js.map

package/components/card-header/CardHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CardHeader.js","sources":["../../../src/components/card-header/CardHeader.tsx"],"sourcesContent":["import React, { forwardRef, RefObject } from 'react';\nimport classNames from 'classnames';\n\nimport { Icon } from '../icon';\nimport { Heading } from '../heading';\nimport { Comp } from '../../types';\nimport { StyledCardHeader } from './styles';\nimport { CardHeaderProps } from './types';\nimport { Skeleton } from '../skeleton';\n\nconst COMPONENT_NAME = 'CardHeader';\nconst CLASSNAME = 'redsift-card-header';\n\n/**\n * The CardHeader component.\n */\nexport const CardHeader: Comp<CardHeaderProps, HTMLDivElement> = forwardRef((props, ref) => {\n  const { children, className, header, headingProps, icon, iconProps, isLoading, subheader, ...forwardedProps } = props;\n\n  return (\n    <StyledCardHeader\n      {...forwardedProps}\n      className={classNames(CardHeader.className, className)}\n      ref={ref as RefObject<HTMLDivElement>}\n    >\n      {subheader ? (\n        <Skeleton.Text variant=\"body\" isLoaded={!isLoading}>\n          <div className={`${CardHeader.className}__subheader`}>{subheader}</div>\n        </Skeleton.Text>\n      ) : null}\n      {header ? (\n        <Skeleton.Text\n          variant={headingProps?.variant || 'h2'}\n          isLoaded={!isLoading}\n          marginTop=\"10px\"\n          marginBottom=\"10px\"\n        >\n          <Heading as=\"h2\" color=\"black\" className={`${CardHeader.className}__header`} variant=\"h2\" {...headingProps}>\n            {icon ? <Icon icon={icon} aria-hidden=\"true\" size=\"large\" {...iconProps} /> : null}\n            {header}\n          </Heading>\n        </Skeleton.Text>\n      ) : null}\n      {children}\n    </StyledCardHeader>\n  );\n});\nCardHeader.className = CLASSNAME;\nCardHeader.displayName = COMPONENT_NAME;\n"],"names":["COMPONENT_NAME","CLASSNAME","CardHeader","forwardRef","props","ref","children","className","header","headingProps","icon","iconProps","isLoading","subheader","forwardedProps","_objectWithoutProperties","_excluded","React","createElement","StyledCardHeader","_extends","classNames","Skeleton","Text","variant","isLoaded","marginTop","marginBottom","Heading","as","color","Icon","size","displayName"],"mappings":";;;;;;;;;AAUA,MAAMA,cAAc,GAAG,YAAY,CAAA;AACnC,MAAMC,SAAS,GAAG,qBAAqB,CAAA;;AAEvC;AACA;AACA;AACO,MAAMC,UAAiD,gBAAGC,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAK;EAC1F,MAAM;MAAEC,QAAQ;MAAEC,SAAS;MAAEC,MAAM;MAAEC,YAAY;MAAEC,IAAI;MAAEC,SAAS;MAAEC,SAAS;AAAEC,MAAAA,SAAAA;AAA6B,KAAC,GAAGT,KAAK;AAAxBU,IAAAA,cAAc,GAAAC,wBAAA,CAAKX,KAAK,EAAAY,SAAA,CAAA,CAAA;EAErH,oBACEC,cAAA,CAAAC,aAAA,CAACC,gBAAgB,EAAAC,QAAA,KACXN,cAAc,EAAA;IAClBP,SAAS,EAAEc,UAAU,CAACnB,UAAU,CAACK,SAAS,EAAEA,SAAS,CAAE;AACvDF,IAAAA,GAAG,EAAEA,GAAAA;GAEJQ,CAAAA,EAAAA,SAAS,gBACRI,cAAA,CAAAC,aAAA,CAACI,QAAQ,CAACC,IAAI,EAAA;AAACC,IAAAA,OAAO,EAAC,MAAM;AAACC,IAAAA,QAAQ,EAAE,CAACb,SAAAA;GACvCK,eAAAA,cAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AAAKX,IAAAA,SAAS,EAAG,CAAA,EAAEL,UAAU,CAACK,SAAU,CAAA,WAAA,CAAA;AAAa,GAAA,EAAEM,SAAe,CACzD,CAAC,GACd,IAAI,EACPL,MAAM,gBACLS,cAAA,CAAAC,aAAA,CAACI,QAAQ,CAACC,IAAI,EAAA;IACZC,OAAO,EAAE,CAAAf,YAAY,KAAZA,IAAAA,IAAAA,YAAY,uBAAZA,YAAY,CAAEe,OAAO,KAAI,IAAK;IACvCC,QAAQ,EAAE,CAACb,SAAU;AACrBc,IAAAA,SAAS,EAAC,MAAM;AAChBC,IAAAA,YAAY,EAAC,MAAA;AAAM,GAAA,eAEnBV,cAAA,CAAAC,aAAA,CAACU,OAAO,EAAAR,QAAA,CAAA;AAACS,IAAAA,EAAE,EAAC,IAAI;AAACC,IAAAA,KAAK,EAAC,OAAO;AAACvB,IAAAA,SAAS,EAAG,CAAA,EAAEL,UAAU,CAACK,SAAU,CAAU,QAAA,CAAA;AAACiB,IAAAA,OAAO,EAAC,IAAA;GAASf,EAAAA,YAAY,CACvGC,EAAAA,IAAI,gBAAGO,cAAA,CAAAC,aAAA,CAACa,IAAI,EAAAX,QAAA,CAAA;AAACV,IAAAA,IAAI,EAAEA,IAAK;AAAC,IAAA,aAAA,EAAY,MAAM;AAACsB,IAAAA,IAAI,EAAC,OAAA;AAAO,GAAA,EAAKrB,SAAS,CAAG,CAAC,GAAG,IAAI,EACjFH,MACM,CACI,CAAC,GACd,IAAI,EACPF,QACe,CAAC,CAAA;AAEvB,CAAC,EAAC;AACFJ,UAAU,CAACK,SAAS,GAAGN,SAAS,CAAA;AAChCC,UAAU,CAAC+B,WAAW,GAAGjC,cAAc;;;;"}