@okta/odyssey-react-mui 1.13.9 → 1.13.11

package/CHANGELOG.md

@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [1.13.11](https://github.com/okta/odyssey/compare/v1.13.10...v1.13.11) (2024-02-15)
+
+**Note:** Version bump only for package @okta/odyssey-react-mui
+
+## [1.13.10](https://github.com/okta/odyssey/compare/v1.13.9...v1.13.10) (2024-02-14)
+
+**Note:** Version bump only for package @okta/odyssey-react-mui
+
 ## [1.13.9](https://github.com/okta/odyssey/compare/v1.13.8...v1.13.9) (2024-02-14)
 
 **Note:** Version bump only for package @okta/odyssey-react-mui

package/dist/Button.js

@@ -10,9 +10,10 @@ import _Button from "@mui/material/Button";
  *
  * See the License for the specific language governing permissions and limitations under the License.
  */
-import { memo, useCallback, useImperativeHandle, useRef } from "react";
+import { memo, useCallback, useImperativeHandle, useMemo, useRef } from "react";
 import { MuiPropsContext, useMuiProps } from "./MuiPropsContext.js";
 import { Tooltip } from "./Tooltip.js";
+import { useButton } from "./ButtonContext.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 export const buttonSizeValues = ["small", "medium", "large"];
 export const buttonTypeValues = ["button", "submit", "reset"];
@@ -28,7 +29,7 @@ const Button = ({
   endIcon,
   id,
   isDisabled,
-  isFullWidth,
+  isFullWidth: isFullWidthProp,
   label = "",
   onClick,
   size = "medium",
@@ -43,6 +44,8 @@ const Button = ({
   const muiProps = useMuiProps();
   const variant = variantProp === "tertiary" ? "secondary" : variantProp;
   const localButtonRef = useRef(null);
+  const buttonContext = useButton();
+  const isFullWidth = useMemo(() => buttonContext.isFullWidth ? buttonContext.isFullWidth : isFullWidthProp, [buttonContext, isFullWidthProp]);
   useImperativeHandle(buttonRef, () => {
     return {
       focus: () => {

package/dist/Button.js.map

@@ -1 +1 @@
-{"version":3,"file":"Button.js","names":["memo","useCallback","useImperativeHandle","useRef","MuiPropsContext","useMuiProps","Tooltip","jsx","_jsx","buttonSizeValues","buttonTypeValues","buttonVariantValues","Button","ariaControls","ariaDescribedBy","ariaExpanded","ariaHasPopup","ariaLabel","ariaLabelledBy","buttonRef","endIcon","id","isDisabled","isFullWidth","label","onClick","size","startIcon","tabIndex","testId","tooltipText","translate","type","variant","variantProp","muiProps","localButtonRef","focus","current","renderButton","ref","_Button","disabled","fullWidth","children","ariaType","placement","text","Consumer","MemoizedButton","displayName"],"sources":["../src/Button.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport { Button as MuiButton } from \"@mui/material\";\nimport type { ButtonProps as MuiButtonProps } from \"@mui/material\";\nimport {\n  ComponentProps,\n  HTMLAttributes,\n  memo,\n  ReactElement,\n  useCallback,\n  useImperativeHandle,\n  useRef,\n} from \"react\";\n\nimport { MuiPropsContext, useMuiProps } from \"./MuiPropsContext\";\nimport { Tooltip } from \"./Tooltip\";\nimport type { HtmlProps } from \"./HtmlProps\";\nimport { FocusHandle } from \"./inputUtils\";\n\nexport const buttonSizeValues = [\"small\", \"medium\", \"large\"] as const;\nexport const buttonTypeValues = [\"button\", \"submit\", \"reset\"] as const;\nexport const buttonVariantValues = [\n  \"primary\",\n  \"secondary\",\n  \"danger\",\n  \"floating\",\n] as const;\n\nexport type ButtonProps = {\n  /**\n   * The global `aria-controls` property identifies the element (or elements) whose contents or presence are controlled by the element on which this attribute is set.\n   *\n   * value: A space-separated list of one or more ID values referencing the elements being controlled by the current element\n   */\n  ariaControls?: ComponentProps<\"button\">[\"aria-controls\"];\n  /**\n   * The `aria-expanded` attribute is set on an element to indicate if a control is expanded or collapsed, and whether or not the controlled elements are displayed or hidden.\n   */\n  ariaExpanded?: ComponentProps<\"button\">[\"aria-expanded\"];\n  /**\n   * The `aria-haspopup` attribute indicates the availability and type of interactive popup element that can be triggered by the element on which the attribute is set.\n   */\n  ariaHasPopup?: ComponentProps<\"button\">[\"aria-haspopup\"];\n  /**\n   * The ARIA label for the Button\n   */\n  ariaLabel?: string;\n  /**\n   * The ID of the element that labels the Button\n   */\n  ariaLabelledBy?: string;\n  /**\n   * The ID of the element that describes the Button\n   */\n  ariaDescribedBy?: string;\n  /**\n   * The ref forwarded to the Button\n   */\n  buttonRef?: React.RefObject<FocusHandle>;\n  /**\n   * The icon element to display at the end of the Button\n   */\n  endIcon?: ReactElement;\n  /**\n   * The ID of the Button\n   */\n  id?: string;\n  /**\n   * Determines whether the Button is disabled\n   */\n  isDisabled?: boolean;\n  /**\n   * Determines whether the Button should take up the full available width\n   */\n  isFullWidth?: boolean;\n  /**\n   * The text content of the Button\n   */\n  label?: string;\n  /**\n   * The click event handler for the Button\n   */\n  onClick?: MuiButtonProps[\"onClick\"];\n  /**\n   * The size of the button\n   */\n  size?: (typeof buttonSizeValues)[number];\n  /**\n   * The icon element to display at the start of the Button\n   */\n  startIcon?: ReactElement;\n  tabIndex?: HTMLAttributes<HTMLElement>[\"tabIndex\"];\n  /**\n   * The tooltip text for the Button if it's icon-only\n   */\n  tooltipText?: string;\n  /**\n   * The type of the HTML button element\n   */\n  type?: (typeof buttonTypeValues)[number];\n  /**\n   * The variant of the Button\n   */\n  variant: (typeof buttonVariantValues)[number] | \"tertiary\";\n} & (\n  | {\n      endIcon?: ReactElement;\n      label: string;\n      startIcon?: ReactElement;\n    }\n  | {\n      endIcon?: ReactElement;\n      label?: \"\" | undefined;\n      startIcon: ReactElement;\n    }\n  | {\n      endIcon: ReactElement;\n      label?: \"\" | undefined;\n      startIcon?: ReactElement;\n    }\n) &\n  HtmlProps;\n\nconst Button = ({\n  ariaControls,\n  ariaDescribedBy,\n  ariaExpanded,\n  ariaHasPopup,\n  ariaLabel,\n  ariaLabelledBy,\n  buttonRef,\n  endIcon,\n  id,\n  isDisabled,\n  isFullWidth,\n  label = \"\",\n  onClick,\n  size = \"medium\",\n  startIcon,\n  tabIndex,\n  testId,\n  tooltipText,\n  translate,\n  type = \"button\",\n  variant: variantProp,\n}: ButtonProps) => {\n  const muiProps = useMuiProps();\n\n  // We're deprecating the \"tertiary\" variant, so map it to\n  // \"secondary\" in lieu of making a breaking change\n  const variant = variantProp === \"tertiary\" ? \"secondary\" : variantProp;\n  const localButtonRef = useRef<HTMLButtonElement>(null);\n\n  useImperativeHandle(\n    buttonRef,\n    () => {\n      return {\n        focus: () => {\n          localButtonRef.current?.focus();\n        },\n      };\n    },\n    []\n  );\n\n  const renderButton = useCallback(\n    (muiProps) => {\n      muiProps?.ref?.(localButtonRef.current);\n\n      return (\n        <MuiButton\n          {...muiProps}\n          aria-controls={ariaControls}\n          aria-describedby={ariaDescribedBy}\n          aria-expanded={ariaExpanded}\n          aria-haspopup={ariaHasPopup}\n          aria-label={ariaLabel}\n          aria-labelledby={ariaLabelledBy}\n          data-se={testId}\n          disabled={isDisabled}\n          endIcon={endIcon}\n          fullWidth={isFullWidth}\n          id={id}\n          onClick={onClick}\n          ref={localButtonRef}\n          size={size}\n          startIcon={startIcon}\n          tabIndex={tabIndex}\n          translate={translate}\n          type={type}\n          variant={variant}\n        >\n          {label}\n        </MuiButton>\n      );\n    },\n    [\n      ariaControls,\n      ariaDescribedBy,\n      ariaExpanded,\n      ariaHasPopup,\n      ariaLabel,\n      ariaLabelledBy,\n      endIcon,\n      id,\n      isDisabled,\n      isFullWidth,\n      label,\n      onClick,\n      size,\n      startIcon,\n      tabIndex,\n      testId,\n      translate,\n      type,\n      variant,\n    ]\n  );\n\n  if (tooltipText) {\n    return (\n      <Tooltip ariaType=\"description\" placement=\"top\" text={tooltipText}>\n        <MuiPropsContext.Consumer>{renderButton}</MuiPropsContext.Consumer>\n      </Tooltip>\n    );\n  }\n\n  return renderButton(muiProps);\n};\n\nconst MemoizedButton = memo(Button);\nMemoizedButton.displayName = \"Button\";\n\nexport { MemoizedButton as Button };\n"],"mappings":"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"}
+{"version":3,"file":"Button.js","names":["memo","useCallback","useImperativeHandle","useMemo","useRef","MuiPropsContext","useMuiProps","Tooltip","useButton","jsx","_jsx","buttonSizeValues","buttonTypeValues","buttonVariantValues","Button","ariaControls","ariaDescribedBy","ariaExpanded","ariaHasPopup","ariaLabel","ariaLabelledBy","buttonRef","endIcon","id","isDisabled","isFullWidth","isFullWidthProp","label","onClick","size","startIcon","tabIndex","testId","tooltipText","translate","type","variant","variantProp","muiProps","localButtonRef","buttonContext","focus","current","renderButton","ref","_Button","disabled","fullWidth","children","ariaType","placement","text","Consumer","MemoizedButton","displayName"],"sources":["../src/Button.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport { Button as MuiButton } from \"@mui/material\";\nimport type { ButtonProps as MuiButtonProps } from \"@mui/material\";\nimport {\n  ComponentProps,\n  HTMLAttributes,\n  memo,\n  ReactElement,\n  useCallback,\n  useImperativeHandle,\n  useMemo,\n  useRef,\n} from \"react\";\n\nimport { MuiPropsContext, useMuiProps } from \"./MuiPropsContext\";\nimport { Tooltip } from \"./Tooltip\";\nimport type { HtmlProps } from \"./HtmlProps\";\nimport { FocusHandle } from \"./inputUtils\";\nimport { useButton } from \"./ButtonContext\";\n\nexport const buttonSizeValues = [\"small\", \"medium\", \"large\"] as const;\nexport const buttonTypeValues = [\"button\", \"submit\", \"reset\"] as const;\nexport const buttonVariantValues = [\n  \"primary\",\n  \"secondary\",\n  \"danger\",\n  \"floating\",\n] as const;\n\nexport type ButtonProps = {\n  /**\n   * The global `aria-controls` property identifies the element (or elements) whose contents or presence are controlled by the element on which this attribute is set.\n   *\n   * value: A space-separated list of one or more ID values referencing the elements being controlled by the current element\n   */\n  ariaControls?: ComponentProps<\"button\">[\"aria-controls\"];\n  /**\n   * The `aria-expanded` attribute is set on an element to indicate if a control is expanded or collapsed, and whether or not the controlled elements are displayed or hidden.\n   */\n  ariaExpanded?: ComponentProps<\"button\">[\"aria-expanded\"];\n  /**\n   * The `aria-haspopup` attribute indicates the availability and type of interactive popup element that can be triggered by the element on which the attribute is set.\n   */\n  ariaHasPopup?: ComponentProps<\"button\">[\"aria-haspopup\"];\n  /**\n   * The ARIA label for the Button\n   */\n  ariaLabel?: string;\n  /**\n   * The ID of the element that labels the Button\n   */\n  ariaLabelledBy?: string;\n  /**\n   * The ID of the element that describes the Button\n   */\n  ariaDescribedBy?: string;\n  /**\n   * The ref forwarded to the Button\n   */\n  buttonRef?: React.RefObject<FocusHandle>;\n  /**\n   * The icon element to display at the end of the Button\n   */\n  endIcon?: ReactElement;\n  /**\n   * The ID of the Button\n   */\n  id?: string;\n  /**\n   * Determines whether the Button is disabled\n   */\n  isDisabled?: boolean;\n  /**\n   * Determines whether the Button should take up the full available width\n   */\n  isFullWidth?: boolean;\n  /**\n   * The text content of the Button\n   */\n  label?: string;\n  /**\n   * The click event handler for the Button\n   */\n  onClick?: MuiButtonProps[\"onClick\"];\n  /**\n   * The size of the button\n   */\n  size?: (typeof buttonSizeValues)[number];\n  /**\n   * The icon element to display at the start of the Button\n   */\n  startIcon?: ReactElement;\n  tabIndex?: HTMLAttributes<HTMLElement>[\"tabIndex\"];\n  /**\n   * The tooltip text for the Button if it's icon-only\n   */\n  tooltipText?: string;\n  /**\n   * The type of the HTML button element\n   */\n  type?: (typeof buttonTypeValues)[number];\n  /**\n   * The variant of the Button\n   */\n  variant: (typeof buttonVariantValues)[number] | \"tertiary\";\n} & (\n  | {\n      endIcon?: ReactElement;\n      label: string;\n      startIcon?: ReactElement;\n    }\n  | {\n      endIcon?: ReactElement;\n      label?: \"\" | undefined;\n      startIcon: ReactElement;\n    }\n  | {\n      endIcon: ReactElement;\n      label?: \"\" | undefined;\n      startIcon?: ReactElement;\n    }\n) &\n  HtmlProps;\n\nconst Button = ({\n  ariaControls,\n  ariaDescribedBy,\n  ariaExpanded,\n  ariaHasPopup,\n  ariaLabel,\n  ariaLabelledBy,\n  buttonRef,\n  endIcon,\n  id,\n  isDisabled,\n  isFullWidth: isFullWidthProp,\n  label = \"\",\n  onClick,\n  size = \"medium\",\n  startIcon,\n  tabIndex,\n  testId,\n  tooltipText,\n  translate,\n  type = \"button\",\n  variant: variantProp,\n}: ButtonProps) => {\n  const muiProps = useMuiProps();\n\n  // We're deprecating the \"tertiary\" variant, so map it to\n  // \"secondary\" in lieu of making a breaking change\n  const variant = variantProp === \"tertiary\" ? \"secondary\" : variantProp;\n  const localButtonRef = useRef<HTMLButtonElement>(null);\n  const buttonContext = useButton();\n  const isFullWidth = useMemo(\n    () =>\n      buttonContext.isFullWidth ? buttonContext.isFullWidth : isFullWidthProp,\n    [buttonContext, isFullWidthProp]\n  );\n\n  useImperativeHandle(\n    buttonRef,\n    () => {\n      return {\n        focus: () => {\n          localButtonRef.current?.focus();\n        },\n      };\n    },\n    []\n  );\n\n  const renderButton = useCallback(\n    (muiProps) => {\n      muiProps?.ref?.(localButtonRef.current);\n\n      return (\n        <MuiButton\n          {...muiProps}\n          aria-controls={ariaControls}\n          aria-describedby={ariaDescribedBy}\n          aria-expanded={ariaExpanded}\n          aria-haspopup={ariaHasPopup}\n          aria-label={ariaLabel}\n          aria-labelledby={ariaLabelledBy}\n          data-se={testId}\n          disabled={isDisabled}\n          endIcon={endIcon}\n          fullWidth={isFullWidth}\n          id={id}\n          onClick={onClick}\n          ref={localButtonRef}\n          size={size}\n          startIcon={startIcon}\n          tabIndex={tabIndex}\n          translate={translate}\n          type={type}\n          variant={variant}\n        >\n          {label}\n        </MuiButton>\n      );\n    },\n    [\n      ariaControls,\n      ariaDescribedBy,\n      ariaExpanded,\n      ariaHasPopup,\n      ariaLabel,\n      ariaLabelledBy,\n      endIcon,\n      id,\n      isDisabled,\n      isFullWidth,\n      label,\n      onClick,\n      size,\n      startIcon,\n      tabIndex,\n      testId,\n      translate,\n      type,\n      variant,\n    ]\n  );\n\n  if (tooltipText) {\n    return (\n      <Tooltip ariaType=\"description\" placement=\"top\" text={tooltipText}>\n        <MuiPropsContext.Consumer>{renderButton}</MuiPropsContext.Consumer>\n      </Tooltip>\n    );\n  }\n\n  return renderButton(muiProps);\n};\n\nconst MemoizedButton = memo(Button);\nMemoizedButton.displayName = \"Button\";\n\nexport { MemoizedButton as Button };\n"],"mappings":"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"}

package/dist/ButtonContext.js

@@ -0,0 +1,18 @@
+/*!
+ * Copyright (c) 2024-present, Okta, Inc. and/or its affiliates. All rights reserved.
+ * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the "License.")
+ *
+ * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *
+ * See the License for the specific language governing permissions and limitations under the License.
+ */
+
+import { createContext, useContext } from "react";
+export const ButtonContext = createContext({
+  isFullWidth: false
+});
+export const useButton = () => useContext(ButtonContext);
+//# sourceMappingURL=ButtonContext.js.map

package/dist/ButtonContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonContext.js","names":["createContext","useContext","ButtonContext","isFullWidth","useButton"],"sources":["../src/ButtonContext.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2024-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport { createContext, useContext } from \"react\";\n\nexport type ButtonContextValue = {\n  isFullWidth: boolean;\n};\n\nexport const ButtonContext = createContext<ButtonContextValue>({\n  isFullWidth: false,\n});\n\nexport const useButton = () => useContext(ButtonContext);\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAASA,aAAa,EAAEC,UAAU,QAAQ,OAAO;AAMjD,OAAO,MAAMC,aAAa,GAAGF,aAAa,CAAqB;EAC7DG,WAAW,EAAE;AACf,CAAC,CAAC;AAEF,OAAO,MAAMC,SAAS,GAAGA,CAAA,KAAMH,UAAU,CAACC,aAAa,CAAC"}

package/dist/Form.js

@@ -27,9 +27,11 @@ const Form = ({
   encodingType,
   formActions,
   id: idOverride,
+  isFullWidth,
   method,
   name,
   noValidate = false,
+  onSubmit,
   target,
   testId,
   title,
@@ -45,9 +47,10 @@ const Form = ({
     method: method,
     name: name,
     noValidate: noValidate,
+    onSubmit: onSubmit,
     target: target,
     sx: {
-      maxWidth: theme => theme.mixins.maxWidth,
+      maxWidth: theme => isFullWidth ? "100%" : theme.mixins.maxWidth,
       margin: theme => theme.spacing(0),
       padding: theme => theme.spacing(0)
     },
@@ -71,7 +74,7 @@ const Form = ({
       component: "div",
       sx: {
         display: "flex",
-        justifyContent: "flex-start",
+        justifyContent: "flex-end",
         gap: theme => theme.spacing(1),
         marginBlockStart: theme => theme.spacing(7)
       },

package/dist/Form.js.map

@@ -1 +1 @@
-{"version":3,"file":"Form.js","names":["memo","Heading4","Support","useUniqueId","jsx","_jsx","jsxs","_jsxs","formEncodingTypeValues","formAutoCompleteTypeValues","formMethodValues","Form","alert","autoCompleteType","children","description","encodingType","formActions","id","idOverride","method","name","noValidate","target","testId","title","translate","_Box","autoComplete","component","encType","sx","maxWidth","theme","mixins","margin","spacing","padding","marginBlockEnd","display","justifyContent","gap","marginBlockStart","MemoizedForm","displayName"],"sources":["../src/Form.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport { memo, ReactElement } from \"react\";\n\nimport { Box } from \"@mui/material\";\nimport { Button } from \"./Button\";\nimport { Callout } from \"./Callout\";\nimport { Heading4, Support } from \"./Typography\";\nimport { useUniqueId } from \"./useUniqueId\";\nimport type { HtmlProps } from \"./HtmlProps\";\n\nexport const formEncodingTypeValues = [\n  \"application/x-www-form-urlencoded\",\n  \"application/json\",\n  \"multipart/form-data\",\n  \"text/plain\",\n] as const;\nexport const formAutoCompleteTypeValues = [\"on\", \"off\"] as const;\nexport const formMethodValues = [\"post\", \"get\", \"dialog\"] as const;\n\nexport type FormProps = {\n  /**\n   * A Callout indicating a Form-wide error or status update.\n   */\n  alert?: ReactElement<typeof Callout>;\n  /**\n   * Indicates whether input elements can by default have their values automatically completed by the browser.\n   * `autocomplete` attributes on form elements override it on <form>\n   */\n  autoCompleteType?: (typeof formAutoCompleteTypeValues)[number];\n  /**\n   * The Field or FieldSet components within the Form\n   */\n  children: ReactElement | Array<ReactElement>;\n  /**\n   * A supplementary description\n   */\n  description?: string;\n  /**\n   * If the value of the method attribute is post, enctype is the MIME type of the form submission.\n   * This value can be overridden by formenctype attributes on <button>, <input type=\"submit\">, or <input type=\"image\"> elements.\n   */\n  encodingType?: (typeof formEncodingTypeValues)[number];\n  /**\n   * The Field or FieldGroup components within the Form\n   */\n  formActions?:\n    | ReactElement<typeof Button>\n    | Array<ReactElement<typeof Button>>;\n  /**\n   * Defines a unique identifier (ID) which must be unique in the whole document.\n   */\n  id?: string;\n  /**\n   * The HTTP method to submit the form with.\n   * This value is overridden by formmethod attributes on <button>, <input type=\"submit\">, or <input type=\"image\"> elements.\n   */\n  method?: (typeof formMethodValues)[number];\n  /**\n   * The name of the form. The value must not be the empty string, and must be unique among the form elements in the forms collection that it is in, if any.\n   */\n  name: string;\n  /**\n   * This Boolean attribute indicates that the form shouldn't be validated when submitted.\n   * If this attribute is not set (and therefore the form is validated),\n   * it can be overridden by a formnovalidate attribute on a <button>, <input type=\"submit\">, or <input type=\"image\"> element belonging to the form.\n   */\n  noValidate?: boolean;\n  /**\n   * Indicates where to display the response after submitting the form. It is a name/keyword for a browsing context (for example, tab, window, or iframe).\n   * This value can be overridden by a formtarget attribute on a <button>, <input type=\"submit\">, or <input type=\"image\"> element.\n   */\n  target?: string;\n  /**\n   * The title of the Form\n   */\n  title?: string;\n} & HtmlProps;\n\nconst Form = ({\n  alert,\n  autoCompleteType,\n  children,\n  description,\n  encodingType,\n  formActions,\n  id: idOverride,\n  method,\n  name,\n  noValidate = false,\n  target,\n  testId,\n  title,\n  translate,\n}: FormProps) => {\n  const id = useUniqueId(idOverride);\n\n  return (\n    <Box\n      autoComplete={autoCompleteType}\n      component=\"form\"\n      data-se={testId}\n      encType={encodingType}\n      id={id}\n      method={method}\n      name={name}\n      noValidate={noValidate}\n      target={target}\n      sx={{\n        maxWidth: (theme) => theme.mixins.maxWidth,\n        margin: (theme) => theme.spacing(0),\n        padding: (theme) => theme.spacing(0),\n      }}\n    >\n      <Box\n        component=\"div\"\n        sx={{\n          marginBlockEnd: (theme) => theme.spacing(4),\n        }}\n      >\n        {title && (\n          <Heading4 component=\"h1\" translate={translate}>\n            {title}\n          </Heading4>\n        )}\n        {description && <Support translate={translate}>{description}</Support>}\n        {alert}\n      </Box>\n      <Box component=\"div\">{children}</Box>\n      {formActions && (\n        <Box\n          component=\"div\"\n          sx={{\n            display: \"flex\",\n            justifyContent: \"flex-start\",\n            gap: (theme) => theme.spacing(1),\n            marginBlockStart: (theme) => theme.spacing(7),\n          }}\n        >\n          {formActions}\n        </Box>\n      )}\n    </Box>\n  );\n};\n\nconst MemoizedForm = memo(Form);\nMemoizedForm.displayName = \"Form\";\n\nexport { MemoizedForm as Form };\n"],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAASA,IAAI,QAAsB,OAAO;AAAC,SAKlCC,QAAQ,EAAEC,OAAO;AAAA,SACjBC,WAAW;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAGpB,OAAO,MAAMC,sBAAsB,GAAG,CACpC,mCAAmC,EACnC,kBAAkB,EAClB,qBAAqB,EACrB,YAAY,CACJ;AACV,OAAO,MAAMC,0BAA0B,GAAG,CAAC,IAAI,EAAE,KAAK,CAAU;AAChE,OAAO,MAAMC,gBAAgB,GAAG,CAAC,MAAM,EAAE,KAAK,EAAE,QAAQ,CAAU;AA6DlE,MAAMC,IAAI,GAAGA,CAAC;EACZC,KAAK;EACLC,gBAAgB;EAChBC,QAAQ;EACRC,WAAW;EACXC,YAAY;EACZC,WAAW;EACXC,EAAE,EAAEC,UAAU;EACdC,MAAM;EACNC,IAAI;EACJC,UAAU,GAAG,KAAK;EAClBC,MAAM;EACNC,MAAM;EACNC,KAAK;EACLC;AACS,CAAC,KAAK;EACf,MAAMR,EAAE,GAAGf,WAAW,CAACgB,UAAU,CAAC;EAElC,OACEZ,KAAA,CAAAoB,IAAA;IACEC,YAAY,EAAEf,gBAAiB;IAC/BgB,SAAS,EAAC,MAAM;IAChB,WAASL,MAAO;IAChBM,OAAO,EAAEd,YAAa;IACtBE,EAAE,EAAEA,EAAG;IACPE,MAAM,EAAEA,MAAO;IACfC,IAAI,EAAEA,IAAK;IACXC,UAAU,EAAEA,UAAW;IACvBC,MAAM,EAAEA,MAAO;IACfQ,EAAE,EAAE;MACFC,QAAQ,EAAGC,KAAK,IAAKA,KAAK,CAACC,MAAM,CAACF,QAAQ;MAC1CG,MAAM,EAAGF,KAAK,IAAKA,KAAK,CAACG,OAAO,CAAC,CAAC,CAAC;MACnCC,OAAO,EAAGJ,KAAK,IAAKA,KAAK,CAACG,OAAO,CAAC,CAAC;IACrC,CAAE;IAAAtB,QAAA,GAEFP,KAAA,CAAAoB,IAAA;MACEE,SAAS,EAAC,KAAK;MACfE,EAAE,EAAE;QACFO,cAAc,EAAGL,KAAK,IAAKA,KAAK,CAACG,OAAO,CAAC,CAAC;MAC5C,CAAE;MAAAtB,QAAA,GAEDW,KAAK,IACJpB,IAAA,CAACJ,QAAQ;QAAC4B,SAAS,EAAC,IAAI;QAACH,SAAS,EAAEA,SAAU;QAAAZ,QAAA,EAC3CW;MAAK,CACE,CACX,EACAV,WAAW,IAAIV,IAAA,CAACH,OAAO;QAACwB,SAAS,EAAEA,SAAU;QAAAZ,QAAA,EAAEC;MAAW,CAAU,CAAC,EACrEH,KAAK;IAAA,CACH,CAAC,EACNP,IAAA,CAAAsB,IAAA;MAAKE,SAAS,EAAC,KAAK;MAAAf,QAAA,EAAEA;IAAQ,CAAM,CAAC,EACpCG,WAAW,IACVZ,IAAA,CAAAsB,IAAA;MACEE,SAAS,EAAC,KAAK;MACfE,EAAE,EAAE;QACFQ,OAAO,EAAE,MAAM;QACfC,cAAc,EAAE,YAAY;QAC5BC,GAAG,EAAGR,KAAK,IAAKA,KAAK,CAACG,OAAO,CAAC,CAAC,CAAC;QAChCM,gBAAgB,EAAGT,KAAK,IAAKA,KAAK,CAACG,OAAO,CAAC,CAAC;MAC9C,CAAE;MAAAtB,QAAA,EAEDG;IAAW,CACT,CACN;EAAA,CACE,CAAC;AAEV,CAAC;AAED,MAAM0B,YAAY,GAAG3C,IAAI,CAACW,IAAI,CAAC;AAC/BgC,YAAY,CAACC,WAAW,GAAG,MAAM;AAEjC,SAASD,YAAY,IAAIhC,IAAI"}
+{"version":3,"file":"Form.js","names":["memo","Heading4","Support","useUniqueId","jsx","_jsx","jsxs","_jsxs","formEncodingTypeValues","formAutoCompleteTypeValues","formMethodValues","Form","alert","autoCompleteType","children","description","encodingType","formActions","id","idOverride","isFullWidth","method","name","noValidate","onSubmit","target","testId","title","translate","_Box","autoComplete","component","encType","sx","maxWidth","theme","mixins","margin","spacing","padding","marginBlockEnd","display","justifyContent","gap","marginBlockStart","MemoizedForm","displayName"],"sources":["../src/Form.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport { FormEventHandler, memo, ReactElement } from \"react\";\nimport { Box } from \"@mui/material\";\n\nimport { Button } from \"./Button\";\nimport { Callout } from \"./Callout\";\nimport { FieldComponentProps } from \"./FieldComponentProps\";\nimport type { HtmlProps } from \"./HtmlProps\";\nimport { Heading4, Support } from \"./Typography\";\nimport { useUniqueId } from \"./useUniqueId\";\n\nexport const formEncodingTypeValues = [\n  \"application/x-www-form-urlencoded\",\n  \"application/json\",\n  \"multipart/form-data\",\n  \"text/plain\",\n] as const;\nexport const formAutoCompleteTypeValues = [\"on\", \"off\"] as const;\nexport const formMethodValues = [\"post\", \"get\", \"dialog\"] as const;\n\nexport type FormProps = {\n  /**\n   * A Callout indicating a Form-wide error or status update.\n   */\n  alert?: ReactElement<typeof Callout>;\n  /**\n   * Indicates whether input elements can by default have their values automatically completed by the browser.\n   * `autocomplete` attributes on form elements override it on <form>\n   */\n  autoCompleteType?: (typeof formAutoCompleteTypeValues)[number];\n  /**\n   * The Field or FieldSet components within the Form\n   */\n  children: ReactElement | Array<ReactElement>;\n  /**\n   * A supplementary description\n   */\n  description?: string;\n  /**\n   * If the value of the method attribute is post, enctype is the MIME type of the form submission.\n   * This value can be overridden by formenctype attributes on <button>, <input type=\"submit\">, or <input type=\"image\"> elements.\n   */\n  encodingType?: (typeof formEncodingTypeValues)[number];\n  /**\n   * The Field or FieldGroup components within the Form\n   */\n  formActions?:\n    | ReactElement<typeof Button>\n    | Array<ReactElement<typeof Button>>;\n  /**\n   * Defines a unique identifier (ID) which must be unique in the whole document.\n   */\n  id?: string;\n  /**\n   * The HTTP method to submit the form with.\n   * This value is overridden by formmethod attributes on <button>, <input type=\"submit\">, or <input type=\"image\"> elements.\n   */\n  method?: (typeof formMethodValues)[number];\n  /**\n   * The name of the form. The value must not be the empty string, and must be unique among the form elements in the forms collection that it is in, if any.\n   */\n  name: string;\n  /**\n   * This Boolean attribute indicates that the form shouldn't be validated when submitted.\n   * If this attribute is not set (and therefore the form is validated),\n   * it can be overridden by a formnovalidate attribute on a <button>, <input type=\"submit\">, or <input type=\"image\"> element belonging to the form.\n   */\n  noValidate?: boolean;\n  /**\n   * Callback that passes the submit event to the consumer\n   */\n  onSubmit?: FormEventHandler<HTMLFormElement>;\n  /**\n   * Indicates where to display the response after submitting the form. It is a name/keyword for a browsing context (for example, tab, window, or iframe).\n   * This value can be overridden by a formtarget attribute on a <button>, <input type=\"submit\">, or <input type=\"image\"> element.\n   */\n  target?: string;\n  /**\n   * The title of the Form\n   */\n  title?: string;\n} & Pick<FieldComponentProps, \"isFullWidth\"> &\n  HtmlProps;\n\nconst Form = ({\n  alert,\n  autoCompleteType,\n  children,\n  description,\n  encodingType,\n  formActions,\n  id: idOverride,\n  isFullWidth,\n  method,\n  name,\n  noValidate = false,\n  onSubmit,\n  target,\n  testId,\n  title,\n  translate,\n}: FormProps) => {\n  const id = useUniqueId(idOverride);\n\n  return (\n    <Box\n      autoComplete={autoCompleteType}\n      component=\"form\"\n      data-se={testId}\n      encType={encodingType}\n      id={id}\n      method={method}\n      name={name}\n      noValidate={noValidate}\n      onSubmit={onSubmit}\n      target={target}\n      sx={{\n        maxWidth: (theme) => (isFullWidth ? \"100%\" : theme.mixins.maxWidth),\n        margin: (theme) => theme.spacing(0),\n        padding: (theme) => theme.spacing(0),\n      }}\n    >\n      <Box\n        component=\"div\"\n        sx={{\n          marginBlockEnd: (theme) => theme.spacing(4),\n        }}\n      >\n        {title && (\n          <Heading4 component=\"h1\" translate={translate}>\n            {title}\n          </Heading4>\n        )}\n        {description && <Support translate={translate}>{description}</Support>}\n        {alert}\n      </Box>\n      <Box component=\"div\">{children}</Box>\n      {formActions && (\n        <Box\n          component=\"div\"\n          sx={{\n            display: \"flex\",\n            justifyContent: \"flex-end\",\n            gap: (theme) => theme.spacing(1),\n            marginBlockStart: (theme) => theme.spacing(7),\n          }}\n        >\n          {formActions}\n        </Box>\n      )}\n    </Box>\n  );\n};\n\nconst MemoizedForm = memo(Form);\nMemoizedForm.displayName = \"Form\";\n\nexport { MemoizedForm as Form };\n"],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAA2BA,IAAI,QAAsB,OAAO;AAAC,SAOpDC,QAAQ,EAAEC,OAAO;AAAA,SACjBC,WAAW;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAEpB,OAAO,MAAMC,sBAAsB,GAAG,CACpC,mCAAmC,EACnC,kBAAkB,EAClB,qBAAqB,EACrB,YAAY,CACJ;AACV,OAAO,MAAMC,0BAA0B,GAAG,CAAC,IAAI,EAAE,KAAK,CAAU;AAChE,OAAO,MAAMC,gBAAgB,GAAG,CAAC,MAAM,EAAE,KAAK,EAAE,QAAQ,CAAU;AAkElE,MAAMC,IAAI,GAAGA,CAAC;EACZC,KAAK;EACLC,gBAAgB;EAChBC,QAAQ;EACRC,WAAW;EACXC,YAAY;EACZC,WAAW;EACXC,EAAE,EAAEC,UAAU;EACdC,WAAW;EACXC,MAAM;EACNC,IAAI;EACJC,UAAU,GAAG,KAAK;EAClBC,QAAQ;EACRC,MAAM;EACNC,MAAM;EACNC,KAAK;EACLC;AACS,CAAC,KAAK;EACf,MAAMV,EAAE,GAAGf,WAAW,CAACgB,UAAU,CAAC;EAElC,OACEZ,KAAA,CAAAsB,IAAA;IACEC,YAAY,EAAEjB,gBAAiB;IAC/BkB,SAAS,EAAC,MAAM;IAChB,WAASL,MAAO;IAChBM,OAAO,EAAEhB,YAAa;IACtBE,EAAE,EAAEA,EAAG;IACPG,MAAM,EAAEA,MAAO;IACfC,IAAI,EAAEA,IAAK;IACXC,UAAU,EAAEA,UAAW;IACvBC,QAAQ,EAAEA,QAAS;IACnBC,MAAM,EAAEA,MAAO;IACfQ,EAAE,EAAE;MACFC,QAAQ,EAAGC,KAAK,IAAMf,WAAW,GAAG,MAAM,GAAGe,KAAK,CAACC,MAAM,CAACF,QAAS;MACnEG,MAAM,EAAGF,KAAK,IAAKA,KAAK,CAACG,OAAO,CAAC,CAAC,CAAC;MACnCC,OAAO,EAAGJ,KAAK,IAAKA,KAAK,CAACG,OAAO,CAAC,CAAC;IACrC,CAAE;IAAAxB,QAAA,GAEFP,KAAA,CAAAsB,IAAA;MACEE,SAAS,EAAC,KAAK;MACfE,EAAE,EAAE;QACFO,cAAc,EAAGL,KAAK,IAAKA,KAAK,CAACG,OAAO,CAAC,CAAC;MAC5C,CAAE;MAAAxB,QAAA,GAEDa,KAAK,IACJtB,IAAA,CAACJ,QAAQ;QAAC8B,SAAS,EAAC,IAAI;QAACH,SAAS,EAAEA,SAAU;QAAAd,QAAA,EAC3Ca;MAAK,CACE,CACX,EACAZ,WAAW,IAAIV,IAAA,CAACH,OAAO;QAAC0B,SAAS,EAAEA,SAAU;QAAAd,QAAA,EAAEC;MAAW,CAAU,CAAC,EACrEH,KAAK;IAAA,CACH,CAAC,EACNP,IAAA,CAAAwB,IAAA;MAAKE,SAAS,EAAC,KAAK;MAAAjB,QAAA,EAAEA;IAAQ,CAAM,CAAC,EACpCG,WAAW,IACVZ,IAAA,CAAAwB,IAAA;MACEE,SAAS,EAAC,KAAK;MACfE,EAAE,EAAE;QACFQ,OAAO,EAAE,MAAM;QACfC,cAAc,EAAE,UAAU;QAC1BC,GAAG,EAAGR,KAAK,IAAKA,KAAK,CAACG,OAAO,CAAC,CAAC,CAAC;QAChCM,gBAAgB,EAAGT,KAAK,IAAKA,KAAK,CAACG,OAAO,CAAC,CAAC;MAC9C,CAAE;MAAAxB,QAAA,EAEDG;IAAW,CACT,CACN;EAAA,CACE,CAAC;AAEV,CAAC;AAED,MAAM4B,YAAY,GAAG7C,IAAI,CAACW,IAAI,CAAC;AAC/BkC,YAAY,CAACC,WAAW,GAAG,MAAM;AAEjC,SAASD,YAAY,IAAIlC,IAAI"}

package/dist/MenuContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"MenuContext.js","names":["createContext","MenuContext","closeMenu","openMenu","shouldCloseOnSelect"],"sources":["../src/MenuContext.ts"],"sourcesContent":["/*!\n * Copyright (c) 2023-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport { createContext, MouseEventHandler } from \"react\";\n\nexport type MenuContextType = {\n  closeMenu: () => void;\n  openMenu: MouseEventHandler<HTMLElement>;\n  shouldCloseOnSelect: boolean;\n};\n\nexport const MenuContext = createContext<MenuContextType>({\n  // eslint-disable-next-line @typescript-eslint/no-empty-function\n  closeMenu: () => {},\n  // eslint-disable-next-line @typescript-eslint/no-empty-function\n  openMenu: () => {},\n  shouldCloseOnSelect: true,\n});\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAASA,aAAa,QAA2B,OAAO;AAQxD,OAAO,MAAMC,WAAW,GAAGD,aAAa,CAAkB;EAExDE,SAAS,EAAEA,CAAA,KAAM,CAAC,CAAC;EAEnBC,QAAQ,EAAEA,CAAA,KAAM,CAAC,CAAC;EAClBC,mBAAmB,EAAE;AACvB,CAAC,CAAC"}
+{"version":3,"file":"MenuContext.js","names":["createContext","MenuContext","closeMenu","openMenu","shouldCloseOnSelect"],"sources":["../src/MenuContext.ts"],"sourcesContent":["/*!\n * Copyright (c) 2023-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport { MouseEventHandler, createContext } from \"react\";\n\nexport type MenuContextType = {\n  closeMenu: () => void;\n  openMenu: MouseEventHandler<HTMLElement>;\n  shouldCloseOnSelect: boolean;\n};\n\nexport const MenuContext = createContext<MenuContextType>({\n  // eslint-disable-next-line @typescript-eslint/no-empty-function\n  closeMenu: () => {},\n  // eslint-disable-next-line @typescript-eslint/no-empty-function\n  openMenu: () => {},\n  shouldCloseOnSelect: true,\n});\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAA4BA,aAAa,QAAQ,OAAO;AAQxD,OAAO,MAAMC,WAAW,GAAGD,aAAa,CAAkB;EAExDE,SAAS,EAAEA,CAAA,KAAM,CAAC,CAAC;EAEnBC,QAAQ,EAAEA,CAAA,KAAM,CAAC,CAAC;EAClBC,mBAAmB,EAAE;AACvB,CAAC,CAAC"}

package/dist/Tile.js

@@ -0,0 +1,94 @@
+import _Card from "@mui/material/Card";
+import _CardActionArea from "@mui/material/CardActionArea";
+import _CardActions from "@mui/material/CardActions";
+/*!
+ * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.
+ * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the "License.")
+ *
+ * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *
+ * See the License for the specific language governing permissions and limitations under the License.
+ */
+
+import { memo, useMemo } from "react";
+import { ButtonContext } from "./ButtonContext.js";
+import { Heading5, Paragraph, Support } from "./Typography.js";
+import { MoreIcon } from "./icons.generated/index.js";
+import styled from "@emotion/styled";
+import { useOdysseyDesignTokens } from "./OdysseyDesignTokensContext.js";
+import { MenuButton } from "./MenuButton.js";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Fragment as _Fragment } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+const ImageContainer = styled.div`
+  display: flex;
+  align-items: flex-start;
+  max-height: 64px;
+  margin-block-end: ${props => props.odysseyDesignTokens.Spacing5};
+  padding-right: ${props => props.hasMenuItems ? props.odysseyDesignTokens.Spacing5 : 0};
+`;
+const MenuButtonContainer = styled.div`
+  position: absolute;
+  right: ${props => props.odysseyDesignTokens.Spacing3};
+  top: ${props => props.odysseyDesignTokens.Spacing3};
+`;
+const Tile = ({
+  button,
+  description,
+  image,
+  menuItems,
+  onClick,
+  overline,
+  title
+}) => {
+  const odysseyDesignTokens = useOdysseyDesignTokens();
+  const cardContent = useMemo(() => {
+    return _jsxs(_Fragment, {
+      children: [image && _jsx(ImageContainer, {
+        odysseyDesignTokens: odysseyDesignTokens,
+        hasMenuItems: Boolean(menuItems),
+        children: image
+      }), overline && _jsx(Support, {
+        component: "div",
+        children: overline
+      }), title && _jsx(Heading5, {
+        component: "div",
+        children: title
+      }), description && _jsx(Paragraph, {
+        color: "textSecondary",
+        children: description
+      }), button && _jsx(_CardActions, {
+        children: _jsx(ButtonContext.Provider, {
+          value: {
+            isFullWidth: true
+          },
+          children: button
+        })
+      })]
+    });
+  }, [button, description, image, menuItems, overline, title, odysseyDesignTokens]);
+  return _jsxs(_Card, {
+    className: onClick ? "isClickable" : "",
+    children: [onClick && _jsx(_CardActionArea, {
+      onClick: onClick,
+      children: cardContent
+    }), !onClick && cardContent, menuItems && _jsx(MenuButtonContainer, {
+      odysseyDesignTokens: odysseyDesignTokens,
+      children: _jsx(MenuButton, {
+        endIcon: _jsx(MoreIcon, {}),
+        ariaLabel: "Tile menu",
+        buttonVariant: "floating",
+        menuAlignment: "right",
+        size: "small",
+        children: menuItems
+      })
+    })]
+  });
+};
+const MemoizedTile = memo(Tile);
+MemoizedTile.displayName = "Tile";
+export { MemoizedTile as Tile };
+//# sourceMappingURL=Tile.js.map

package/dist/Tile.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tile.js","names":["memo","useMemo","ButtonContext","Heading5","Paragraph","Support","MoreIcon","styled","useOdysseyDesignTokens","MenuButton","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","ImageContainer","div","props","odysseyDesignTokens","Spacing5","hasMenuItems","MenuButtonContainer","Spacing3","Tile","button","description","image","menuItems","onClick","overline","title","cardContent","children","Boolean","component","color","_CardActions","Provider","value","isFullWidth","_Card","className","_CardActionArea","endIcon","ariaLabel","buttonVariant","menuAlignment","size","MemoizedTile","displayName"],"sources":["../src/Tile.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport { ReactElement, memo, useMemo } from \"react\";\n\nimport { NullElement } from \"./NullElement\";\nimport {\n  Card as MuiCard,\n  CardActions as MuiCardActions,\n  CardActionArea as MuiCardActionArea,\n} from \"@mui/material\";\nimport { Button } from \"./Button\";\nimport { ButtonContext } from \"./ButtonContext\";\nimport { Heading5, Paragraph, Support } from \"./Typography\";\nimport { MoreIcon } from \"./icons.generated\";\nimport { HtmlProps } from \"./HtmlProps\";\nimport styled from \"@emotion/styled\";\nimport {\n  DesignTokens,\n  useOdysseyDesignTokens,\n} from \"./OdysseyDesignTokensContext\";\nimport { MenuButton } from \"./MenuButton\";\n\nexport type TileProps = {\n  description?: string;\n  image?: ReactElement | NullElement; // Icon or image\n  menuItems?: ReactElement;\n  overline?: string;\n  title?: string;\n} & ( // You can't have actions and onClick at the same time\n  | {\n      onClick: () => void;\n      button?: never;\n      menuItems?: never;\n    }\n  | {\n      onClick?: never;\n      button?: ReactElement<typeof Button> | NullElement;\n      menuItems?: ReactElement;\n    }\n) &\n  HtmlProps;\n\nconst ImageContainer = styled.div<{\n  odysseyDesignTokens: DesignTokens;\n  hasMenuItems: boolean;\n}>`\n  display: flex;\n  align-items: flex-start;\n  max-height: 64px;\n  margin-block-end: ${(props) => props.odysseyDesignTokens.Spacing5};\n  padding-right: ${(props) =>\n    props.hasMenuItems ? props.odysseyDesignTokens.Spacing5 : 0};\n`;\n\nconst MenuButtonContainer = styled.div<{ odysseyDesignTokens: DesignTokens }>`\n  position: absolute;\n  right: ${(props) => props.odysseyDesignTokens.Spacing3};\n  top: ${(props) => props.odysseyDesignTokens.Spacing3};\n`;\n\nconst Tile = ({\n  button,\n  description,\n  image,\n  menuItems,\n  onClick,\n  overline,\n  title,\n}: TileProps) => {\n  const odysseyDesignTokens = useOdysseyDesignTokens();\n\n  const cardContent = useMemo(() => {\n    return (\n      <>\n        {image && (\n          <ImageContainer\n            odysseyDesignTokens={odysseyDesignTokens}\n            hasMenuItems={Boolean(menuItems)}\n          >\n            {image}\n          </ImageContainer>\n        )}\n\n        {overline && <Support component=\"div\">{overline}</Support>}\n        {title && <Heading5 component=\"div\">{title}</Heading5>}\n        {description && (\n          <Paragraph color=\"textSecondary\">{description}</Paragraph>\n        )}\n\n        {button && (\n          <MuiCardActions>\n            <ButtonContext.Provider value={{ isFullWidth: true }}>\n              {button}\n            </ButtonContext.Provider>\n          </MuiCardActions>\n        )}\n      </>\n    );\n  }, [\n    button,\n    description,\n    image,\n    menuItems,\n    overline,\n    title,\n    odysseyDesignTokens,\n  ]);\n\n  return (\n    <MuiCard className={onClick ? \"isClickable\" : \"\"}>\n      {onClick && (\n        <MuiCardActionArea onClick={onClick}>{cardContent}</MuiCardActionArea>\n      )}\n\n      {!onClick && cardContent}\n\n      {menuItems && (\n        <MenuButtonContainer odysseyDesignTokens={odysseyDesignTokens}>\n          <MenuButton\n            endIcon={<MoreIcon />}\n            ariaLabel=\"Tile menu\"\n            buttonVariant=\"floating\"\n            menuAlignment=\"right\"\n            size=\"small\"\n          >\n            {menuItems}\n          </MenuButton>\n        </MenuButtonContainer>\n      )}\n    </MuiCard>\n  );\n};\n\nconst MemoizedTile = memo(Tile);\nMemoizedTile.displayName = \"Tile\";\n\nexport { MemoizedTile as Tile };\n"],"mappings":";;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAAuBA,IAAI,EAAEC,OAAO,QAAQ,OAAO;AAAC,SAS3CC,aAAa;AAAA,SACbC,QAAQ,EAAEC,SAAS,EAAEC,OAAO;AAAA,SAC5BC,QAAQ;AAEjB,OAAOC,MAAM,MAAM,iBAAiB;AAAC,SAGnCC,sBAAsB;AAAA,SAEfC,UAAU;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,QAAA,IAAAC,SAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAsBnB,MAAMC,cAAc,GAAGT,MAAM,CAACU,GAG3B;AACH;AACA;AACA;AACA,sBAAuBC,KAAK,IAAKA,KAAK,CAACC,mBAAmB,CAACC,QAAS;AACpE,mBAAoBF,KAAK,IACrBA,KAAK,CAACG,YAAY,GAAGH,KAAK,CAACC,mBAAmB,CAACC,QAAQ,GAAG,CAAE;AAChE,CAAC;AAED,MAAME,mBAAmB,GAAGf,MAAM,CAACU,GAA2C;AAC9E;AACA,WAAYC,KAAK,IAAKA,KAAK,CAACC,mBAAmB,CAACI,QAAS;AACzD,SAAUL,KAAK,IAAKA,KAAK,CAACC,mBAAmB,CAACI,QAAS;AACvD,CAAC;AAED,MAAMC,IAAI,GAAGA,CAAC;EACZC,MAAM;EACNC,WAAW;EACXC,KAAK;EACLC,SAAS;EACTC,OAAO;EACPC,QAAQ;EACRC;AACS,CAAC,KAAK;EACf,MAAMZ,mBAAmB,GAAGX,sBAAsB,CAAC,CAAC;EAEpD,MAAMwB,WAAW,GAAG/B,OAAO,CAAC,MAAM;IAChC,OACEc,KAAA,CAAAF,SAAA;MAAAoB,QAAA,GACGN,KAAK,IACJhB,IAAA,CAACK,cAAc;QACbG,mBAAmB,EAAEA,mBAAoB;QACzCE,YAAY,EAAEa,OAAO,CAACN,SAAS,CAAE;QAAAK,QAAA,EAEhCN;MAAK,CACQ,CACjB,EAEAG,QAAQ,IAAInB,IAAA,CAACN,OAAO;QAAC8B,SAAS,EAAC,KAAK;QAAAF,QAAA,EAAEH;MAAQ,CAAU,CAAC,EACzDC,KAAK,IAAIpB,IAAA,CAACR,QAAQ;QAACgC,SAAS,EAAC,KAAK;QAAAF,QAAA,EAAEF;MAAK,CAAW,CAAC,EACrDL,WAAW,IACVf,IAAA,CAACP,SAAS;QAACgC,KAAK,EAAC,eAAe;QAAAH,QAAA,EAAEP;MAAW,CAAY,CAC1D,EAEAD,MAAM,IACLd,IAAA,CAAA0B,YAAA;QAAAJ,QAAA,EACEtB,IAAA,CAACT,aAAa,CAACoC,QAAQ;UAACC,KAAK,EAAE;YAAEC,WAAW,EAAE;UAAK,CAAE;UAAAP,QAAA,EAClDR;QAAM,CACe;MAAC,CACX,CACjB;IAAA,CACD,CAAC;EAEP,CAAC,EAAE,CACDA,MAAM,EACNC,WAAW,EACXC,KAAK,EACLC,SAAS,EACTE,QAAQ,EACRC,KAAK,EACLZ,mBAAmB,CACpB,CAAC;EAEF,OACEJ,KAAA,CAAA0B,KAAA;IAASC,SAAS,EAAEb,OAAO,GAAG,aAAa,GAAG,EAAG;IAAAI,QAAA,GAC9CJ,OAAO,IACNlB,IAAA,CAAAgC,eAAA;MAAmBd,OAAO,EAAEA,OAAQ;MAAAI,QAAA,EAAED;IAAW,CAAoB,CACtE,EAEA,CAACH,OAAO,IAAIG,WAAW,EAEvBJ,SAAS,IACRjB,IAAA,CAACW,mBAAmB;MAACH,mBAAmB,EAAEA,mBAAoB;MAAAc,QAAA,EAC5DtB,IAAA,CAACF,UAAU;QACTmC,OAAO,EAAEjC,IAAA,CAACL,QAAQ,IAAE,CAAE;QACtBuC,SAAS,EAAC,WAAW;QACrBC,aAAa,EAAC,UAAU;QACxBC,aAAa,EAAC,OAAO;QACrBC,IAAI,EAAC,OAAO;QAAAf,QAAA,EAEXL;MAAS,CACA;IAAC,CACM,CACtB;EAAA,CACM,CAAC;AAEd,CAAC;AAED,MAAMqB,YAAY,GAAGjD,IAAI,CAACwB,IAAI,CAAC;AAC/ByB,YAAY,CAACC,WAAW,GAAG,MAAM;AAEjC,SAASD,YAAY,IAAIzB,IAAI"}

package/dist/index.js

@@ -19,6 +19,7 @@ export * from "./Banner.js";
 export * from "./Box.js";
 export * from "./Breadcrumbs.js";
 export * from "./Button.js";
+export * from "./Tile.js";
 export * from "./Callout.js";
 export * from "./Checkbox.js";
 export * from "./CheckboxGroup.js";

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["deepmerge","visuallyHidden","createTheme","DialogContentText","Divider","InputAdornment","InputBase","ListItemIcon","ListItemText","ListSubheader","MenuList","Paper","ScopedCssBaseline","ThemeProvider","useOdysseyDesignTokens","odysseyTranslate"],"sources":["../src/index.ts"],"sourcesContent":["/*!\n * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nexport { deepmerge, visuallyHidden } from \"@mui/utils\";\n\nexport {\n  createTheme,\n  /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n  DialogContentText,\n  /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n  Divider,\n  /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n  InputAdornment,\n  /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n  InputBase,\n  /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n  ListItemIcon,\n  /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n  ListItemText,\n  /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n  ListSubheader,\n  /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n  MenuList,\n  /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n  Paper,\n  /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n  ScopedCssBaseline,\n  ThemeProvider,\n} from \"@mui/material\";\n\nexport type {\n  CssBaselineProps,\n  DialogContentTextProps,\n  DividerProps,\n  InputAdornmentProps,\n  InputBaseProps,\n  ListItemIconProps,\n  ListItemTextProps,\n  ListSubheaderProps,\n  MenuListProps,\n  PaperProps,\n  ScopedCssBaselineProps,\n  ThemeOptions,\n} from \"@mui/material\";\n\nexport type { FocusHandle } from \"./inputUtils\";\n\nexport { useOdysseyDesignTokens } from \"./OdysseyDesignTokensContext\";\n\nexport * from \"./Accordion\";\nexport * from \"./Autocomplete\";\nexport * from \"./Banner\";\nexport * from \"./Box\";\nexport * from \"./Breadcrumbs\";\nexport * from \"./Button\";\nexport * from \"./Callout\";\nexport * from \"./Checkbox\";\nexport * from \"./CheckboxGroup\";\nexport * from \"./CircularProgress\";\nexport * from \"./CssBaseline\";\nexport * from \"./createShadowRootElement\";\nexport * from \"./createUniqueId\";\nexport * from \"./Dialog\";\nexport * from \"./Fieldset\";\nexport * from \"./FieldComponentProps\";\nexport * from \"./Form\";\nexport * from \"./HintLink\";\nexport * from \"./Link\";\nexport * from \"./MenuButton\";\nexport * from \"./MenuItem\";\nexport * from \"./NativeSelect\";\nexport * from \"./NullElement\";\nexport * from \"./OdysseyCacheProvider\";\nexport { odysseyTranslate } from \"./i18n\";\nexport * from \"./OdysseyProvider\";\nexport * from \"./OdysseyThemeProvider\";\nexport * from \"./OdysseyTranslationProvider\";\nexport * from \"./PasswordField\";\nexport * from \"./Radio\";\nexport * from \"./RadioGroup\";\nexport * from \"./ScreenReaderText\";\nexport * from \"./SearchField\";\nexport * from \"./Select\";\nexport * from \"./Status\";\nexport * from \"./Tabs\";\nexport * from \"./Tag\";\nexport * from \"./TagList\";\nexport * from \"./TextField\";\nexport * from \"./theme\";\nexport * from \"./Toast\";\nexport * from \"./ToastStack\";\nexport * from \"./labs/Switch\";\nexport * from \"./Tooltip\";\nexport * from \"./Typography\";\nexport * from \"./useUniqueId\";\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAASA,SAAS,EAAEC,cAAc,QAAQ,YAAY;AAEtD,SACEC,WAAW,EAEXC,iBAAiB,EAEjBC,OAAO,EAEPC,cAAc,EAEdC,SAAS,EAETC,YAAY,EAEZC,YAAY,EAEZC,aAAa,EAEbC,QAAQ,EAERC,KAAK,EAELC,iBAAiB,EACjBC,aAAa,QACR,eAAe;AAAC,SAmBdC,sBAAsB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,SA0BtBC,gBAAgB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA"}
+{"version":3,"file":"index.js","names":["deepmerge","visuallyHidden","createTheme","DialogContentText","Divider","InputAdornment","InputBase","ListItemIcon","ListItemText","ListSubheader","MenuList","Paper","ScopedCssBaseline","ThemeProvider","useOdysseyDesignTokens","odysseyTranslate"],"sources":["../src/index.ts"],"sourcesContent":["/*!\n * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nexport { deepmerge, visuallyHidden } from \"@mui/utils\";\n\nexport {\n  createTheme,\n  /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n  DialogContentText,\n  /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n  Divider,\n  /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n  InputAdornment,\n  /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n  InputBase,\n  /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n  ListItemIcon,\n  /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n  ListItemText,\n  /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n  ListSubheader,\n  /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n  MenuList,\n  /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n  Paper,\n  /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n  ScopedCssBaseline,\n  ThemeProvider,\n} from \"@mui/material\";\n\nexport type {\n  CssBaselineProps,\n  DialogContentTextProps,\n  DividerProps,\n  InputAdornmentProps,\n  InputBaseProps,\n  ListItemIconProps,\n  ListItemTextProps,\n  ListSubheaderProps,\n  MenuListProps,\n  PaperProps,\n  ScopedCssBaselineProps,\n  ThemeOptions,\n} from \"@mui/material\";\n\nexport type { FocusHandle } from \"./inputUtils\";\n\nexport { useOdysseyDesignTokens } from \"./OdysseyDesignTokensContext\";\n\nexport * from \"./Accordion\";\nexport * from \"./Autocomplete\";\nexport * from \"./Banner\";\nexport * from \"./Box\";\nexport * from \"./Breadcrumbs\";\nexport * from \"./Button\";\nexport * from \"./Tile\";\nexport * from \"./Callout\";\nexport * from \"./Checkbox\";\nexport * from \"./CheckboxGroup\";\nexport * from \"./CircularProgress\";\nexport * from \"./CssBaseline\";\nexport * from \"./createShadowRootElement\";\nexport * from \"./createUniqueId\";\nexport * from \"./Dialog\";\nexport * from \"./Fieldset\";\nexport * from \"./FieldComponentProps\";\nexport * from \"./Form\";\nexport * from \"./HintLink\";\nexport * from \"./Link\";\nexport * from \"./MenuButton\";\nexport * from \"./MenuItem\";\nexport * from \"./NativeSelect\";\nexport * from \"./NullElement\";\nexport * from \"./OdysseyCacheProvider\";\nexport { odysseyTranslate } from \"./i18n\";\nexport * from \"./OdysseyProvider\";\nexport * from \"./OdysseyThemeProvider\";\nexport * from \"./OdysseyTranslationProvider\";\nexport * from \"./PasswordField\";\nexport * from \"./Radio\";\nexport * from \"./RadioGroup\";\nexport * from \"./ScreenReaderText\";\nexport * from \"./SearchField\";\nexport * from \"./Select\";\nexport * from \"./Status\";\nexport * from \"./Tabs\";\nexport * from \"./Tag\";\nexport * from \"./TagList\";\nexport * from \"./TextField\";\nexport * from \"./theme\";\nexport * from \"./Toast\";\nexport * from \"./ToastStack\";\nexport * from \"./labs/Switch\";\nexport * from \"./Tooltip\";\nexport * from \"./Typography\";\nexport * from \"./useUniqueId\";\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAASA,SAAS,EAAEC,cAAc,QAAQ,YAAY;AAEtD,SACEC,WAAW,EAEXC,iBAAiB,EAEjBC,OAAO,EAEPC,cAAc,EAEdC,SAAS,EAETC,YAAY,EAEZC,YAAY,EAEZC,aAAa,EAEbC,QAAQ,EAERC,KAAK,EAELC,iBAAiB,EACjBC,aAAa,QACR,eAAe;AAAC,SAmBdC,sBAAsB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,SA2BtBC,gBAAgB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA"}

package/dist/src/Button.d.ts

@@ -105,6 +105,6 @@ export type ButtonProps = {
     label?: "" | undefined;
     startIcon?: ReactElement;
 }) & HtmlProps;
-declare const MemoizedButton: import("react").MemoExoticComponent<({ ariaControls, ariaDescribedBy, ariaExpanded, ariaHasPopup, ariaLabel, ariaLabelledBy, buttonRef, endIcon, id, isDisabled, isFullWidth, label, onClick, size, startIcon, tabIndex, testId, tooltipText, translate, type, variant: variantProp, }: ButtonProps) => JSX.Element>;
+declare const MemoizedButton: import("react").MemoExoticComponent<({ ariaControls, ariaDescribedBy, ariaExpanded, ariaHasPopup, ariaLabel, ariaLabelledBy, buttonRef, endIcon, id, isDisabled, isFullWidth: isFullWidthProp, label, onClick, size, startIcon, tabIndex, testId, tooltipText, translate, type, variant: variantProp, }: ButtonProps) => JSX.Element>;
 export { MemoizedButton as Button };
 //# sourceMappingURL=Button.d.ts.map

package/dist/src/Button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../src/Button.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAGH,OAAO,KAAK,EAAE,WAAW,IAAI,cAAc,EAAE,MAAM,eAAe,CAAC;AACnE,OAAO,EACL,cAAc,EACd,cAAc,EAEd,YAAY,EAIb,MAAM,OAAO,CAAC;AAIf,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAC7C,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAE3C,eAAO,MAAM,gBAAgB,uCAAwC,CAAC;AACtE,eAAO,MAAM,gBAAgB,wCAAyC,CAAC;AACvE,eAAO,MAAM,mBAAmB,yDAKtB,CAAC;AAEX,MAAM,MAAM,WAAW,GAAG;IACxB;;;;OAIG;IACH,YAAY,CAAC,EAAE,cAAc,CAAC,QAAQ,CAAC,CAAC,eAAe,CAAC,CAAC;IACzD;;OAEG;IACH,YAAY,CAAC,EAAE,cAAc,CAAC,QAAQ,CAAC,CAAC,eAAe,CAAC,CAAC;IACzD;;OAEG;IACH,YAAY,CAAC,EAAE,cAAc,CAAC,QAAQ,CAAC,CAAC,eAAe,CAAC,CAAC;IACzD;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB;;OAEG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB;;OAEG;IACH,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IACzC;;OAEG;IACH,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB;;OAEG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ;;OAEG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;OAEG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,OAAO,CAAC,EAAE,cAAc,CAAC,SAAS,CAAC,CAAC;IACpC;;OAEG;IACH,IAAI,CAAC,EAAE,CAAC,OAAO,gBAAgB,CAAC,CAAC,MAAM,CAAC,CAAC;IACzC;;OAEG;IACH,SAAS,CAAC,EAAE,YAAY,CAAC;IACzB,QAAQ,CAAC,EAAE,cAAc,CAAC,WAAW,CAAC,CAAC,UAAU,CAAC,CAAC;IACnD;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,IAAI,CAAC,EAAE,CAAC,OAAO,gBAAgB,CAAC,CAAC,MAAM,CAAC,CAAC;IACzC;;OAEG;IACH,OAAO,EAAE,CAAC,OAAO,mBAAmB,CAAC,CAAC,MAAM,CAAC,GAAG,UAAU,CAAC;CAC5D,GAAG,CACA;IACE,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,YAAY,CAAC;CAC1B,GACD;IACE,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB,KAAK,CAAC,EAAE,EAAE,GAAG,SAAS,CAAC;IACvB,SAAS,EAAE,YAAY,CAAC;CACzB,GACD;IACE,OAAO,EAAE,YAAY,CAAC;IACtB,KAAK,CAAC,EAAE,EAAE,GAAG,SAAS,CAAC;IACvB,SAAS,CAAC,EAAE,YAAY,CAAC;CAC1B,CACJ,GACC,SAAS,CAAC;AA6GZ,QAAA,MAAM,cAAc,0RArFjB,WAAW,iBAqFqB,CAAC;AAGpC,OAAO,EAAE,cAAc,IAAI,MAAM,EAAE,CAAC"}
+{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../src/Button.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAGH,OAAO,KAAK,EAAE,WAAW,IAAI,cAAc,EAAE,MAAM,eAAe,CAAC;AACnE,OAAO,EACL,cAAc,EACd,cAAc,EAEd,YAAY,EAKb,MAAM,OAAO,CAAC;AAIf,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAC7C,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAG3C,eAAO,MAAM,gBAAgB,uCAAwC,CAAC;AACtE,eAAO,MAAM,gBAAgB,wCAAyC,CAAC;AACvE,eAAO,MAAM,mBAAmB,yDAKtB,CAAC;AAEX,MAAM,MAAM,WAAW,GAAG;IACxB;;;;OAIG;IACH,YAAY,CAAC,EAAE,cAAc,CAAC,QAAQ,CAAC,CAAC,eAAe,CAAC,CAAC;IACzD;;OAEG;IACH,YAAY,CAAC,EAAE,cAAc,CAAC,QAAQ,CAAC,CAAC,eAAe,CAAC,CAAC;IACzD;;OAEG;IACH,YAAY,CAAC,EAAE,cAAc,CAAC,QAAQ,CAAC,CAAC,eAAe,CAAC,CAAC;IACzD;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB;;OAEG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB;;OAEG;IACH,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IACzC;;OAEG;IACH,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB;;OAEG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ;;OAEG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;OAEG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,OAAO,CAAC,EAAE,cAAc,CAAC,SAAS,CAAC,CAAC;IACpC;;OAEG;IACH,IAAI,CAAC,EAAE,CAAC,OAAO,gBAAgB,CAAC,CAAC,MAAM,CAAC,CAAC;IACzC;;OAEG;IACH,SAAS,CAAC,EAAE,YAAY,CAAC;IACzB,QAAQ,CAAC,EAAE,cAAc,CAAC,WAAW,CAAC,CAAC,UAAU,CAAC,CAAC;IACnD;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,IAAI,CAAC,EAAE,CAAC,OAAO,gBAAgB,CAAC,CAAC,MAAM,CAAC,CAAC;IACzC;;OAEG;IACH,OAAO,EAAE,CAAC,OAAO,mBAAmB,CAAC,CAAC,MAAM,CAAC,GAAG,UAAU,CAAC;CAC5D,GAAG,CACA;IACE,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,YAAY,CAAC;CAC1B,GACD;IACE,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB,KAAK,CAAC,EAAE,EAAE,GAAG,SAAS,CAAC;IACvB,SAAS,EAAE,YAAY,CAAC;CACzB,GACD;IACE,OAAO,EAAE,YAAY,CAAC;IACtB,KAAK,CAAC,EAAE,EAAE,GAAG,SAAS,CAAC;IACvB,SAAS,CAAC,EAAE,YAAY,CAAC;CAC1B,CACJ,GACC,SAAS,CAAC;AAmHZ,QAAA,MAAM,cAAc,2SA3FjB,WAAW,iBA2FqB,CAAC;AAGpC,OAAO,EAAE,cAAc,IAAI,MAAM,EAAE,CAAC"}

package/dist/src/ButtonContext.d.ts

@@ -0,0 +1,18 @@
+/*!
+ * Copyright (c) 2024-present, Okta, Inc. and/or its affiliates. All rights reserved.
+ * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the "License.")
+ *
+ * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *
+ * See the License for the specific language governing permissions and limitations under the License.
+ */
+/// <reference types="react" />
+export type ButtonContextValue = {
+    isFullWidth: boolean;
+};
+export declare const ButtonContext: import("react").Context<ButtonContextValue>;
+export declare const useButton: () => ButtonContextValue;
+//# sourceMappingURL=ButtonContext.d.ts.map

package/dist/src/ButtonContext.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonContext.d.ts","sourceRoot":"","sources":["../../src/ButtonContext.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;;AAIH,MAAM,MAAM,kBAAkB,GAAG;IAC/B,WAAW,EAAE,OAAO,CAAC;CACtB,CAAC;AAEF,eAAO,MAAM,aAAa,6CAExB,CAAC;AAEH,eAAO,MAAM,SAAS,0BAAkC,CAAC"}

package/dist/src/Form.d.ts

@@ -9,9 +9,10 @@
  *
  * See the License for the specific language governing permissions and limitations under the License.
  */
-import { ReactElement } from "react";
+import { FormEventHandler, ReactElement } from "react";
 import { Button } from "./Button";
 import { Callout } from "./Callout";
+import { FieldComponentProps } from "./FieldComponentProps";
 import type { HtmlProps } from "./HtmlProps";
 export declare const formEncodingTypeValues: readonly ["application/x-www-form-urlencoded", "application/json", "multipart/form-data", "text/plain"];
 export declare const formAutoCompleteTypeValues: readonly ["on", "off"];
@@ -62,6 +63,10 @@ export type FormProps = {
      * it can be overridden by a formnovalidate attribute on a <button>, <input type="submit">, or <input type="image"> element belonging to the form.
      */
     noValidate?: boolean;
+    /**
+     * Callback that passes the submit event to the consumer
+     */
+    onSubmit?: FormEventHandler<HTMLFormElement>;
     /**
      * Indicates where to display the response after submitting the form. It is a name/keyword for a browsing context (for example, tab, window, or iframe).
      * This value can be overridden by a formtarget attribute on a <button>, <input type="submit">, or <input type="image"> element.
@@ -71,7 +76,7 @@ export type FormProps = {
      * The title of the Form
      */
     title?: string;
-} & HtmlProps;
-declare const MemoizedForm: import("react").MemoExoticComponent<({ alert, autoCompleteType, children, description, encodingType, formActions, id: idOverride, method, name, noValidate, target, testId, title, translate, }: FormProps) => JSX.Element>;
+} & Pick<FieldComponentProps, "isFullWidth"> & HtmlProps;
+declare const MemoizedForm: import("react").MemoExoticComponent<({ alert, autoCompleteType, children, description, encodingType, formActions, id: idOverride, isFullWidth, method, name, noValidate, onSubmit, target, testId, title, translate, }: FormProps) => JSX.Element>;
 export { MemoizedForm as Form };
 //# sourceMappingURL=Form.d.ts.map

package/dist/src/Form.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Form.d.ts","sourceRoot":"","sources":["../../src/Form.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAEH,OAAO,EAAQ,YAAY,EAAE,MAAM,OAAO,CAAC;AAG3C,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAGpC,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAE7C,eAAO,MAAM,sBAAsB,yGAKzB,CAAC;AACX,eAAO,MAAM,0BAA0B,wBAAyB,CAAC;AACjE,eAAO,MAAM,gBAAgB,oCAAqC,CAAC;AAEnE,MAAM,MAAM,SAAS,GAAG;IACtB;;OAEG;IACH,KAAK,CAAC,EAAE,YAAY,CAAC,OAAO,OAAO,CAAC,CAAC;IACrC;;;OAGG;IACH,gBAAgB,CAAC,EAAE,CAAC,OAAO,0BAA0B,CAAC,CAAC,MAAM,CAAC,CAAC;IAC/D;;OAEG;IACH,QAAQ,EAAE,YAAY,GAAG,KAAK,CAAC,YAAY,CAAC,CAAC;IAC7C;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;OAGG;IACH,YAAY,CAAC,EAAE,CAAC,OAAO,sBAAsB,CAAC,CAAC,MAAM,CAAC,CAAC;IACvD;;OAEG;IACH,WAAW,CAAC,EACR,YAAY,CAAC,OAAO,MAAM,CAAC,GAC3B,KAAK,CAAC,YAAY,CAAC,OAAO,MAAM,CAAC,CAAC,CAAC;IACvC;;OAEG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ;;;OAGG;IACH,MAAM,CAAC,EAAE,CAAC,OAAO,gBAAgB,CAAC,CAAC,MAAM,CAAC,CAAC;IAC3C;;OAEG;IACH,IAAI,EAAE,MAAM,CAAC;IACb;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,GAAG,SAAS,CAAC;AAqEd,QAAA,MAAM,YAAY,mMApDf,SAAS,iBAoDmB,CAAC;AAGhC,OAAO,EAAE,YAAY,IAAI,IAAI,EAAE,CAAC"}
+{"version":3,"file":"Form.d.ts","sourceRoot":"","sources":["../../src/Form.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAEH,OAAO,EAAE,gBAAgB,EAAQ,YAAY,EAAE,MAAM,OAAO,CAAC;AAG7D,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAC5D,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAI7C,eAAO,MAAM,sBAAsB,yGAKzB,CAAC;AACX,eAAO,MAAM,0BAA0B,wBAAyB,CAAC;AACjE,eAAO,MAAM,gBAAgB,oCAAqC,CAAC;AAEnE,MAAM,MAAM,SAAS,GAAG;IACtB;;OAEG;IACH,KAAK,CAAC,EAAE,YAAY,CAAC,OAAO,OAAO,CAAC,CAAC;IACrC;;;OAGG;IACH,gBAAgB,CAAC,EAAE,CAAC,OAAO,0BAA0B,CAAC,CAAC,MAAM,CAAC,CAAC;IAC/D;;OAEG;IACH,QAAQ,EAAE,YAAY,GAAG,KAAK,CAAC,YAAY,CAAC,CAAC;IAC7C;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;OAGG;IACH,YAAY,CAAC,EAAE,CAAC,OAAO,sBAAsB,CAAC,CAAC,MAAM,CAAC,CAAC;IACvD;;OAEG;IACH,WAAW,CAAC,EACR,YAAY,CAAC,OAAO,MAAM,CAAC,GAC3B,KAAK,CAAC,YAAY,CAAC,OAAO,MAAM,CAAC,CAAC,CAAC;IACvC;;OAEG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ;;;OAGG;IACH,MAAM,CAAC,EAAE,CAAC,OAAO,gBAAgB,CAAC,CAAC,MAAM,CAAC,CAAC;IAC3C;;OAEG;IACH,IAAI,EAAE,MAAM,CAAC;IACb;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;OAEG;IACH,QAAQ,CAAC,EAAE,gBAAgB,CAAC,eAAe,CAAC,CAAC;IAC7C;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,GAAG,IAAI,CAAC,mBAAmB,EAAE,aAAa,CAAC,GAC1C,SAAS,CAAC;AAwEZ,QAAA,MAAM,YAAY,0NArDf,SAAS,iBAqDmB,CAAC;AAGhC,OAAO,EAAE,YAAY,IAAI,IAAI,EAAE,CAAC"}

package/dist/src/MenuContext.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MenuContext.d.ts","sourceRoot":"","sources":["../../src/MenuContext.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAEH,OAAO,EAAiB,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAEzD,MAAM,MAAM,eAAe,GAAG;IAC5B,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,QAAQ,EAAE,iBAAiB,CAAC,WAAW,CAAC,CAAC;IACzC,mBAAmB,EAAE,OAAO,CAAC;CAC9B,CAAC;AAEF,eAAO,MAAM,WAAW,0CAMtB,CAAC"}
+{"version":3,"file":"MenuContext.d.ts","sourceRoot":"","sources":["../../src/MenuContext.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAEH,OAAO,EAAE,iBAAiB,EAAiB,MAAM,OAAO,CAAC;AAEzD,MAAM,MAAM,eAAe,GAAG;IAC5B,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,QAAQ,EAAE,iBAAiB,CAAC,WAAW,CAAC,CAAC;IACzC,mBAAmB,EAAE,OAAO,CAAC;CAC9B,CAAC;AAEF,eAAO,MAAM,WAAW,0CAMtB,CAAC"}

package/dist/src/Tile.d.ts

@@ -0,0 +1,33 @@
+/*!
+ * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.
+ * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the "License.")
+ *
+ * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *
+ * See the License for the specific language governing permissions and limitations under the License.
+ */
+import { ReactElement } from "react";
+import { NullElement } from "./NullElement";
+import { Button } from "./Button";
+import { HtmlProps } from "./HtmlProps";
+export type TileProps = {
+    description?: string;
+    image?: ReactElement | NullElement;
+    menuItems?: ReactElement;
+    overline?: string;
+    title?: string;
+} & ({
+    onClick: () => void;
+    button?: never;
+    menuItems?: never;
+} | {
+    onClick?: never;
+    button?: ReactElement<typeof Button> | NullElement;
+    menuItems?: ReactElement;
+}) & HtmlProps;
+declare const MemoizedTile: import("react").MemoExoticComponent<({ button, description, image, menuItems, onClick, overline, title, }: TileProps) => JSX.Element>;
+export { MemoizedTile as Tile };
+//# sourceMappingURL=Tile.d.ts.map

package/dist/src/Tile.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tile.d.ts","sourceRoot":"","sources":["../../src/Tile.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAEH,OAAO,EAAE,YAAY,EAAiB,MAAM,OAAO,CAAC;AAEpD,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAM5C,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAIlC,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAQxC,MAAM,MAAM,SAAS,GAAG;IACtB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,KAAK,CAAC,EAAE,YAAY,GAAG,WAAW,CAAC;IACnC,SAAS,CAAC,EAAE,YAAY,CAAC;IACzB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,GAAG,CACA;IACE,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,MAAM,CAAC,EAAE,KAAK,CAAC;IACf,SAAS,CAAC,EAAE,KAAK,CAAC;CACnB,GACD;IACE,OAAO,CAAC,EAAE,KAAK,CAAC;IAChB,MAAM,CAAC,EAAE,YAAY,CAAC,OAAO,MAAM,CAAC,GAAG,WAAW,CAAC;IACnD,SAAS,CAAC,EAAE,YAAY,CAAC;CAC1B,CACJ,GACC,SAAS,CAAC;AA6FZ,QAAA,MAAM,YAAY,6GAjEf,SAAS,iBAiEmB,CAAC;AAGhC,OAAO,EAAE,YAAY,IAAI,IAAI,EAAE,CAAC"}

package/dist/src/index.d.ts

@@ -40,6 +40,7 @@ export * from "./Banner";
 export * from "./Box";
 export * from "./Breadcrumbs";
 export * from "./Button";
+export * from "./Tile";
 export * from "./Callout";
 export * from "./Checkbox";
 export * from "./CheckboxGroup";

package/dist/src/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAEH,OAAO,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,YAAY,CAAC;AAEvD,OAAO,EACL,WAAW;AACX,4FAA4F;AAC5F,iBAAiB;AACjB,4FAA4F;AAC5F,OAAO;AACP,4FAA4F;AAC5F,cAAc;AACd,4FAA4F;AAC5F,SAAS;AACT,4FAA4F;AAC5F,YAAY;AACZ,4FAA4F;AAC5F,YAAY;AACZ,4FAA4F;AAC5F,aAAa;AACb,4FAA4F;AAC5F,QAAQ;AACR,4FAA4F;AAC5F,KAAK;AACL,4FAA4F;AAC5F,iBAAiB,EACjB,aAAa,GACd,MAAM,eAAe,CAAC;AAEvB,YAAY,EACV,gBAAgB,EAChB,sBAAsB,EACtB,YAAY,EACZ,mBAAmB,EACnB,cAAc,EACd,iBAAiB,EACjB,iBAAiB,EACjB,kBAAkB,EAClB,aAAa,EACb,UAAU,EACV,sBAAsB,EACtB,YAAY,GACb,MAAM,eAAe,CAAC;AAEvB,YAAY,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAEhD,OAAO,EAAE,sBAAsB,EAAE,MAAM,8BAA8B,CAAC;AAEtE,cAAc,aAAa,CAAC;AAC5B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,UAAU,CAAC;AACzB,cAAc,OAAO,CAAC;AACtB,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,WAAW,CAAC;AAC1B,cAAc,YAAY,CAAC;AAC3B,cAAc,iBAAiB,CAAC;AAChC,cAAc,oBAAoB,CAAC;AACnC,cAAc,eAAe,CAAC;AAC9B,cAAc,2BAA2B,CAAC;AAC1C,cAAc,kBAAkB,CAAC;AACjC,cAAc,UAAU,CAAC;AACzB,cAAc,YAAY,CAAC;AAC3B,cAAc,uBAAuB,CAAC;AACtC,cAAc,QAAQ,CAAC;AACvB,cAAc,YAAY,CAAC;AAC3B,cAAc,QAAQ,CAAC;AACvB,cAAc,cAAc,CAAC;AAC7B,cAAc,YAAY,CAAC;AAC3B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,eAAe,CAAC;AAC9B,cAAc,wBAAwB,CAAC;AACvC,OAAO,EAAE,gBAAgB,EAAE,MAAM,QAAQ,CAAC;AAC1C,cAAc,mBAAmB,CAAC;AAClC,cAAc,wBAAwB,CAAC;AACvC,cAAc,8BAA8B,CAAC;AAC7C,cAAc,iBAAiB,CAAC;AAChC,cAAc,SAAS,CAAC;AACxB,cAAc,cAAc,CAAC;AAC7B,cAAc,oBAAoB,CAAC;AACnC,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,OAAO,CAAC;AACtB,cAAc,WAAW,CAAC;AAC1B,cAAc,aAAa,CAAC;AAC5B,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC;AAC9B,cAAc,WAAW,CAAC;AAC1B,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAEH,OAAO,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,YAAY,CAAC;AAEvD,OAAO,EACL,WAAW;AACX,4FAA4F;AAC5F,iBAAiB;AACjB,4FAA4F;AAC5F,OAAO;AACP,4FAA4F;AAC5F,cAAc;AACd,4FAA4F;AAC5F,SAAS;AACT,4FAA4F;AAC5F,YAAY;AACZ,4FAA4F;AAC5F,YAAY;AACZ,4FAA4F;AAC5F,aAAa;AACb,4FAA4F;AAC5F,QAAQ;AACR,4FAA4F;AAC5F,KAAK;AACL,4FAA4F;AAC5F,iBAAiB,EACjB,aAAa,GACd,MAAM,eAAe,CAAC;AAEvB,YAAY,EACV,gBAAgB,EAChB,sBAAsB,EACtB,YAAY,EACZ,mBAAmB,EACnB,cAAc,EACd,iBAAiB,EACjB,iBAAiB,EACjB,kBAAkB,EAClB,aAAa,EACb,UAAU,EACV,sBAAsB,EACtB,YAAY,GACb,MAAM,eAAe,CAAC;AAEvB,YAAY,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAEhD,OAAO,EAAE,sBAAsB,EAAE,MAAM,8BAA8B,CAAC;AAEtE,cAAc,aAAa,CAAC;AAC5B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,UAAU,CAAC;AACzB,cAAc,OAAO,CAAC;AACtB,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,WAAW,CAAC;AAC1B,cAAc,YAAY,CAAC;AAC3B,cAAc,iBAAiB,CAAC;AAChC,cAAc,oBAAoB,CAAC;AACnC,cAAc,eAAe,CAAC;AAC9B,cAAc,2BAA2B,CAAC;AAC1C,cAAc,kBAAkB,CAAC;AACjC,cAAc,UAAU,CAAC;AACzB,cAAc,YAAY,CAAC;AAC3B,cAAc,uBAAuB,CAAC;AACtC,cAAc,QAAQ,CAAC;AACvB,cAAc,YAAY,CAAC;AAC3B,cAAc,QAAQ,CAAC;AACvB,cAAc,cAAc,CAAC;AAC7B,cAAc,YAAY,CAAC;AAC3B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,eAAe,CAAC;AAC9B,cAAc,wBAAwB,CAAC;AACvC,OAAO,EAAE,gBAAgB,EAAE,MAAM,QAAQ,CAAC;AAC1C,cAAc,mBAAmB,CAAC;AAClC,cAAc,wBAAwB,CAAC;AACvC,cAAc,8BAA8B,CAAC;AAC7C,cAAc,iBAAiB,CAAC;AAChC,cAAc,SAAS,CAAC;AACxB,cAAc,cAAc,CAAC;AAC7B,cAAc,oBAAoB,CAAC;AACnC,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,OAAO,CAAC;AACtB,cAAc,WAAW,CAAC;AAC1B,cAAc,aAAa,CAAC;AAC5B,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC;AAC9B,cAAc,WAAW,CAAC;AAC1B,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC"}

package/dist/src/theme/components.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"components.d.ts","sourceRoot":"","sources":["../../../src/theme/components.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAEH,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAqC7C,OAAO,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAGvC,eAAO,MAAM,UAAU;mBAIN,YAAY;;MAEzB,YAAY,CAAC,YAAY,CA+mF5B,CAAC"}
+{"version":3,"file":"components.d.ts","sourceRoot":"","sources":["../../../src/theme/components.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAEH,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAqC7C,OAAO,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAGvC,eAAO,MAAM,UAAU;mBAIN,YAAY;;MAEzB,YAAY,CAAC,YAAY,CA+qF5B,CAAC"}

package/dist/theme/components.js

@@ -626,6 +626,64 @@ export const components = ({
         disableRipple: true
       }
     },
+    MuiCard: {
+      styleOverrides: {
+        root: () => ({
+          backgroundColor: odysseyTokens.HueNeutralWhite,
+          borderRadius: odysseyTokens.BorderRadiusOuter,
+          boxShadow: odysseyTokens.DepthMedium,
+          padding: odysseyTokens.Spacing5,
+          position: "relative",
+          transition: `all ${odysseyTokens.TransitionDurationMain} ${odysseyTokens.TransitionTimingMain}`,
+          "& img": {
+            height: "64px"
+          },
+          "&.isClickable:hover": {
+            backgroundColor: odysseyTokens.HueNeutral50,
+            boxShadow: odysseyTokens.DepthHigh
+          },
+          [`& .${typographyClasses.h5}`]: {
+            lineHeight: odysseyTokens.TypographyLineHeightHeading5,
+            marginBottom: odysseyTokens.Spacing3
+          },
+          [`& .${typographyClasses.subtitle2}`]: {
+            marginBottom: odysseyTokens.Spacing1,
+            textTransform: "uppercase",
+            fontWeight: odysseyTokens.TypographyWeightBodyBold,
+            fontSize: odysseyTokens.TypographySizeOverline,
+            lineHeight: odysseyTokens.TypographyLineHeightOverline,
+            color: odysseyTokens.TypographyColorSubordinate,
+            letterSpacing: 1.3
+          },
+          [`& .${typographyClasses.body1}`]: {
+            fontSize: odysseyTokens.TypographySizeSubordinate,
+            lineHeight: odysseyTokens.TypographyLineHeightBody
+          }
+        })
+      }
+    },
+    MuiCardActionArea: {
+      styleOverrides: {
+        root: () => ({
+          margin: `-${odysseyTokens.Spacing5}`,
+          padding: odysseyTokens.Spacing5,
+          width: `calc(100% + (${odysseyTokens.Spacing5} * 2))`,
+          "&:hover": {
+            "& .MuiCardActionArea-focusHighlight": {
+              display: "none"
+            }
+          }
+        })
+      }
+    },
+    MuiCardActions: {
+      styleOverrides: {
+        root: () => ({
+          marginBlockStart: odysseyTokens.Spacing5,
+          padding: 0
+        })
+      }
+    },
     MuiCheckbox: {
       defaultProps: {
         size: "small",