@instructure/ui-modal 8.9.2-snapshot.4 → 8.10.1-snapshot.4

package/CHANGELOG.md

@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [8.10.0](https://github.com/instructure/instructure-ui/compare/v8.9.1...v8.10.0) (2021-09-28)
+
+**Note:** Version bump only for package @instructure/ui-modal
+
 ## [8.9.1](https://github.com/instructure/instructure-ui/compare/v8.9.0...v8.9.1) (2021-09-16)
 
 **Note:** Version bump only for package @instructure/ui-modal

package/es/Modal/ModalBody/index.js

@@ -64,7 +64,7 @@ let ModalBody = (_dec = withStyle(generateStyle, generateComponentTheme), _dec2
           children = _this$props.children,
           rest = _objectWithoutProperties(_this$props, _excluded);
 
-    const passthroughProps = View.omitViewProps(omitProps(rest, ModalBody.propTypes), ModalBody);
+    const passthroughProps = View.omitViewProps(omitProps(rest, ModalBody.allowedProps), ModalBody);
     const isFit = overflow === 'fit';
     return jsx(View, Object.assign({}, passthroughProps, {
       display: "block",

package/es/Modal/props.js

@@ -23,7 +23,7 @@
  */
 import PropTypes from 'prop-types';
 import { element, Children as ChildrenPropTypes } from '@instructure/ui-prop-types';
-import { Transition } from '@instructure/ui-motion';
+import { transitionTypePropType } from '@instructure/ui-motion';
 import { ModalHeader } from './ModalHeader';
 import { ModalBody } from './ModalBody';
 import { ModalFooter } from './ModalFooter';
@@ -110,7 +110,7 @@ const propTypes = {
    * the screen reader when the `<Modal />` is open
    */
   liveRegion: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.element), PropTypes.element, PropTypes.func]),
-  transition: Transition.propTypes.type,
+  transition: transitionTypePropType,
 
   /**
    * Callback fired before the <Modal /> transitions in

package/lib/Modal/ModalBody/index.js

@@ -56,7 +56,7 @@ let ModalBody = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default)
           children = _this$props.children,
           rest = (0, _objectWithoutProperties2.default)(_this$props, _excluded);
 
-    const passthroughProps = _View.View.omitViewProps((0, _omitProps.omitProps)(rest, ModalBody.propTypes), ModalBody);
+    const passthroughProps = _View.View.omitViewProps((0, _omitProps.omitProps)(rest, ModalBody.allowedProps), ModalBody);
 
     const isFit = overflow === 'fit';
     return (0, _emotion.jsx)(_View.View, Object.assign({}, passthroughProps, {

package/lib/Modal/props.js

@@ -13,7 +13,7 @@ var _element = require("@instructure/ui-prop-types/lib/element.js");
 
 var _Children = require("@instructure/ui-prop-types/lib/Children.js");
 
-var _Transition = require("@instructure/ui-motion/lib/Transition");
+var _uiMotion = require("@instructure/ui-motion");
 
 var _ModalHeader = require("./ModalHeader");
 
@@ -127,7 +127,7 @@ const propTypes = {
    * the screen reader when the `<Modal />` is open
    */
   liveRegion: _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.element), _propTypes.default.element, _propTypes.default.func]),
-  transition: _Transition.Transition.propTypes.type,
+  transition: _uiMotion.transitionTypePropType,
 
   /**
    * Callback fired before the <Modal /> transitions in

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@instructure/ui-modal",
-  "version": "8.9.2-snapshot.4+bf1e82efc",
+  "version": "8.10.1-snapshot.4+6c5c9e653",
   "description": "A component for displaying content in a dialog overlay",
   "author": "Instructure, Inc. Engineering and Product Design",
   "type": "commonjs",
@@ -25,35 +25,35 @@
   "license": "MIT",
   "dependencies": {
     "@babel/runtime": "^7.13.10",
-    "@instructure/console": "8.9.2-snapshot.4+bf1e82efc",
-    "@instructure/emotion": "8.9.2-snapshot.4+bf1e82efc",
-    "@instructure/shared-types": "8.9.2-snapshot.4+bf1e82efc",
-    "@instructure/ui-buttons": "8.9.2-snapshot.4+bf1e82efc",
-    "@instructure/ui-dialog": "8.9.2-snapshot.4+bf1e82efc",
-    "@instructure/ui-motion": "8.9.2-snapshot.4+bf1e82efc",
-    "@instructure/ui-overlays": "8.9.2-snapshot.4+bf1e82efc",
-    "@instructure/ui-portal": "8.9.2-snapshot.4+bf1e82efc",
-    "@instructure/ui-prop-types": "8.9.2-snapshot.4+bf1e82efc",
-    "@instructure/ui-react-utils": "8.9.2-snapshot.4+bf1e82efc",
-    "@instructure/ui-testable": "8.9.2-snapshot.4+bf1e82efc",
-    "@instructure/ui-utils": "8.9.2-snapshot.4+bf1e82efc",
-    "@instructure/ui-view": "8.9.2-snapshot.4+bf1e82efc",
+    "@instructure/console": "8.10.1-snapshot.4+6c5c9e653",
+    "@instructure/emotion": "8.10.1-snapshot.4+6c5c9e653",
+    "@instructure/shared-types": "8.10.1-snapshot.4+6c5c9e653",
+    "@instructure/ui-buttons": "8.10.1-snapshot.4+6c5c9e653",
+    "@instructure/ui-dialog": "8.10.1-snapshot.4+6c5c9e653",
+    "@instructure/ui-motion": "8.10.1-snapshot.4+6c5c9e653",
+    "@instructure/ui-overlays": "8.10.1-snapshot.4+6c5c9e653",
+    "@instructure/ui-portal": "8.10.1-snapshot.4+6c5c9e653",
+    "@instructure/ui-prop-types": "8.10.1-snapshot.4+6c5c9e653",
+    "@instructure/ui-react-utils": "8.10.1-snapshot.4+6c5c9e653",
+    "@instructure/ui-testable": "8.10.1-snapshot.4+6c5c9e653",
+    "@instructure/ui-utils": "8.10.1-snapshot.4+6c5c9e653",
+    "@instructure/ui-view": "8.10.1-snapshot.4+6c5c9e653",
     "prop-types": "^15"
   },
   "peerDependencies": {
     "react": ">=16.8 <=17"
   },
   "devDependencies": {
-    "@instructure/ui-babel-preset": "8.9.2-snapshot.4+bf1e82efc",
-    "@instructure/ui-color-utils": "8.9.2-snapshot.4+bf1e82efc",
-    "@instructure/ui-position": "8.9.2-snapshot.4+bf1e82efc",
-    "@instructure/ui-test-locator": "8.9.2-snapshot.4+bf1e82efc",
-    "@instructure/ui-test-utils": "8.9.2-snapshot.4+bf1e82efc",
-    "@instructure/ui-themes": "8.9.2-snapshot.4+bf1e82efc"
+    "@instructure/ui-babel-preset": "8.10.1-snapshot.4+6c5c9e653",
+    "@instructure/ui-color-utils": "8.10.1-snapshot.4+6c5c9e653",
+    "@instructure/ui-position": "8.10.1-snapshot.4+6c5c9e653",
+    "@instructure/ui-test-locator": "8.10.1-snapshot.4+6c5c9e653",
+    "@instructure/ui-test-utils": "8.10.1-snapshot.4+6c5c9e653",
+    "@instructure/ui-themes": "8.10.1-snapshot.4+6c5c9e653"
   },
   "publishConfig": {
     "access": "public"
   },
   "sideEffects": false,
-  "gitHead": "bf1e82efccb682510708448efd369eddaa24f74b"
+  "gitHead": "6c5c9e653f7ce3d239296f4ed19c5679fdddcd5b"
 }

package/src/Modal/ModalBody/index.tsx

@@ -79,7 +79,7 @@ class ModalBody extends Component<ModalBodyProps> {
     } = this.props
 
     const passthroughProps = View.omitViewProps(
-      omitProps(rest, ModalBody.propTypes),
+      omitProps(rest, ModalBody.allowedProps),
       ModalBody
     )
     const isFit = overflow === 'fit'

package/src/Modal/ModalBody/props.ts

@@ -27,8 +27,16 @@ import PropTypes from 'prop-types'
 
 import { ThemeablePropTypes } from '@instructure/emotion'
 
-import type { Spacing, WithStyleProps } from '@instructure/emotion'
-import type { AsElementType, PropValidators } from '@instructure/shared-types'
+import type {
+  Spacing,
+  WithStyleProps,
+  ComponentStyle
+} from '@instructure/emotion'
+import type {
+  AsElementType,
+  PropValidators,
+  ModalBodyTheme
+} from '@instructure/shared-types'
 
 type ModalBodyOwnProps = {
   children?: React.ReactNode
@@ -43,7 +51,10 @@ type PropKeys = keyof ModalBodyOwnProps
 
 type AllowedPropKeys = Readonly<Array<PropKeys>>
 
-type ModalBodyProps = ModalBodyOwnProps & WithStyleProps
+type ModalBodyProps = ModalBodyOwnProps &
+  WithStyleProps<ModalBodyTheme, ModalBodyStyle>
+
+type ModalBodyStyle = ComponentStyle<'modalBody'>
 
 const propTypes: PropValidators<PropKeys> = {
   children: PropTypes.node,
@@ -63,5 +74,5 @@ const allowedProps: AllowedPropKeys = [
   'overflow'
 ]
 
-export type { ModalBodyProps }
+export type { ModalBodyProps, ModalBodyStyle }
 export { propTypes, allowedProps }

package/src/Modal/ModalBody/styles.ts

@@ -22,8 +22,8 @@
  * SOFTWARE.
  */
 
-import { ModalBodyTheme } from '@instructure/shared-types'
-import { ModalBodyProps } from './props'
+import type { ModalBodyTheme } from '@instructure/shared-types'
+import type { ModalBodyProps, ModalBodyStyle } from './props'
 
 /**
  * ---
@@ -38,7 +38,7 @@ import { ModalBodyProps } from './props'
 const generateStyle = (
   componentTheme: ModalBodyTheme,
   props: ModalBodyProps
-) => {
+): ModalBodyStyle => {
   const { variant } = props
 
   const backgroundStyle =

package/src/Modal/ModalFooter/props.ts

@@ -25,8 +25,11 @@
 import React from 'react'
 import PropTypes from 'prop-types'
 
-import type { PropValidators } from '@instructure/shared-types'
-import type { WithStyleProps } from '@instructure/emotion'
+import type {
+  PropValidators,
+  ModalFooterTheme
+} from '@instructure/shared-types'
+import type { WithStyleProps, ComponentStyle } from '@instructure/emotion'
 
 type ModalFooterOwnProps = {
   children?: React.ReactNode
@@ -37,7 +40,10 @@ type PropKeys = keyof ModalFooterOwnProps
 
 type AllowedPropKeys = Readonly<Array<PropKeys>>
 
-type ModalFooterProps = ModalFooterOwnProps & WithStyleProps
+type ModalFooterProps = ModalFooterOwnProps &
+  WithStyleProps<ModalFooterTheme, ModalFooterStyle>
+
+type ModalFooterStyle = ComponentStyle<'modalFooter'>
 
 const propTypes: PropValidators<PropKeys> = {
   children: PropTypes.node,
@@ -46,5 +52,5 @@ const propTypes: PropValidators<PropKeys> = {
 
 const allowedProps: AllowedPropKeys = ['children', 'variant']
 
-export type { ModalFooterProps }
+export type { ModalFooterProps, ModalFooterStyle }
 export { propTypes, allowedProps }

package/src/Modal/ModalFooter/styles.ts

@@ -22,8 +22,8 @@
  * SOFTWARE.
  */
 
-import { ModalFooterTheme } from '@instructure/shared-types'
-import { ModalFooterProps } from './props'
+import type { ModalFooterTheme } from '@instructure/shared-types'
+import type { ModalFooterProps, ModalFooterStyle } from './props'
 
 /**
  * ---
@@ -38,7 +38,7 @@ import { ModalFooterProps } from './props'
 const generateStyle = (
   componentTheme: ModalFooterTheme,
   props: ModalFooterProps
-) => {
+): ModalFooterStyle => {
   const { variant } = props
 
   const backgroundStyle =

package/src/Modal/ModalHeader/props.ts

@@ -25,8 +25,11 @@
 import React from 'react'
 import PropTypes from 'prop-types'
 
-import type { PropValidators } from '@instructure/shared-types'
-import type { WithStyleProps } from '@instructure/emotion'
+import type {
+  PropValidators,
+  ModalHeaderTheme
+} from '@instructure/shared-types'
+import type { WithStyleProps, ComponentStyle } from '@instructure/emotion'
 
 type ModalHeaderOwnProps = {
   children?: React.ReactNode
@@ -41,7 +44,10 @@ type PropKeys = keyof ModalHeaderOwnProps
 
 type AllowedPropKeys = Readonly<Array<PropKeys>>
 
-type ModalHeaderProps = ModalHeaderOwnProps & WithStyleProps
+type ModalHeaderProps = ModalHeaderOwnProps &
+  WithStyleProps<ModalHeaderTheme, ModalHeaderStyle>
+
+type ModalHeaderStyle = ComponentStyle<'modalHeader'>
 
 const propTypes: PropValidators<PropKeys> = {
   children: PropTypes.node,
@@ -50,5 +56,5 @@ const propTypes: PropValidators<PropKeys> = {
 
 const allowedProps: AllowedPropKeys = ['children', 'variant']
 
-export type { ModalHeaderProps, ModalHeaderStyleProps }
+export type { ModalHeaderProps, ModalHeaderStyleProps, ModalHeaderStyle }
 export { propTypes, allowedProps }

package/src/Modal/ModalHeader/styles.ts

@@ -22,8 +22,12 @@
  * SOFTWARE.
  */
 
-import { ModalHeaderTheme } from '@instructure/shared-types'
-import { ModalHeaderProps, ModalHeaderStyleProps } from './props'
+import type { ModalHeaderTheme } from '@instructure/shared-types'
+import type {
+  ModalHeaderProps,
+  ModalHeaderStyleProps,
+  ModalHeaderStyle
+} from './props'
 
 /**
  * ---
@@ -39,7 +43,7 @@ const generateStyle = (
   componentTheme: ModalHeaderTheme,
   props: ModalHeaderProps,
   state: ModalHeaderStyleProps
-) => {
+): ModalHeaderStyle => {
   const { variant } = props
   const { withCloseButton } = state
 

package/src/Modal/index.tsx

@@ -223,7 +223,6 @@ class Modal extends Component<ModalProps> {
       <Mask
         placement={this.maskPlacement}
         fullscreen={constrain === 'window'}
-        // @ts-expect-error ts-migrate(2769) FIXME: No overload matches this call.
         themeOverride={
           isFullScreen ? { borderRadius: '0em', borderWidth: '0em' } : {}
         }

package/src/Modal/props.ts

@@ -29,16 +29,20 @@ import {
   element,
   Children as ChildrenPropTypes
 } from '@instructure/ui-prop-types'
-import { Transition } from '@instructure/ui-motion'
+import { transitionTypePropType } from '@instructure/ui-motion'
 import { ModalHeader } from './ModalHeader'
 import { ModalBody } from './ModalBody'
 import { ModalFooter } from './ModalFooter'
 
-import type { AsElementType, PropValidators } from '@instructure/shared-types'
+import type {
+  AsElementType,
+  PropValidators,
+  ModalTheme
+} from '@instructure/shared-types'
 import type { PortalNode } from '@instructure/ui-portal'
 import type { PositionMountNode } from '@instructure/ui-position'
 import type { TransitionType } from '@instructure/ui-motion'
-import type { WithStyleProps } from '@instructure/emotion'
+import type { WithStyleProps, ComponentStyle } from '@instructure/emotion'
 
 type ModalOwnProps = {
   label: string
@@ -75,7 +79,9 @@ type PropKeys = keyof ModalOwnProps
 
 type AllowedPropKeys = Readonly<Array<PropKeys>>
 
-type ModalProps = ModalOwnProps & WithStyleProps
+type ModalProps = ModalOwnProps & WithStyleProps<ModalTheme, ModalStyle>
+
+type ModalStyle = ComponentStyle<'modal' | 'constrainContext'>
 
 const propTypes: PropValidators<PropKeys> = {
   /**
@@ -169,7 +175,7 @@ const propTypes: PropValidators<PropKeys> = {
     PropTypes.func
   ]),
 
-  transition: Transition.propTypes.type,
+  transition: transitionTypePropType,
 
   /**
    * Callback fired before the <Modal /> transitions in
@@ -234,5 +240,5 @@ const allowedProps: AllowedPropKeys = [
   'overflow'
 ]
 
-export type { ModalProps }
+export type { ModalProps, ModalStyle }
 export { propTypes, allowedProps }

package/src/Modal/styles.ts

@@ -22,8 +22,8 @@
  * SOFTWARE.
  */
 
-import { ModalTheme } from '@instructure/shared-types'
-import { ModalProps } from './props'
+import type { ModalTheme } from '@instructure/shared-types'
+import type { ModalProps, ModalStyle } from './props'
 
 /**
  * ---
@@ -35,7 +35,10 @@ import { ModalProps } from './props'
  * @param  {Object} state the state of the component, the style is applied to
  * @return {Object} The final style object, which will be used in the component
  */
-const generateStyle = (componentTheme: ModalTheme, props: ModalProps) => {
+const generateStyle = (
+  componentTheme: ModalTheme,
+  props: ModalProps
+): ModalStyle => {
   const { size, variant, overflow } = props
 
   const commonSizeStyleExceptForFullscreen = {

package/types/Modal/ModalBody/index.d.ts

@@ -15,12 +15,7 @@ declare class ModalBody extends Component<ModalBodyProps> {
         padding?: import("@instructure/emotion/types/styleUtils/ThemeablePropValues").Spacing | undefined;
         elementRef?: ((...args: any[]) => any) | undefined;
         as?: import("@instructure/shared-types/types/CommonProps").AsElementType | undefined;
-        variant?: "default" | "inverse" | undefined; /**
-        ---
-        parent: Modal
-        id: Modal.Body
-        ---
-        **/
+        variant?: "default" | "inverse" | undefined;
         overflow?: "scroll" | "fit" | undefined;
     }>;
     static allowedProps: readonly (keyof {
@@ -28,12 +23,7 @@ declare class ModalBody extends Component<ModalBodyProps> {
         padding?: import("@instructure/emotion/types/styleUtils/ThemeablePropValues").Spacing | undefined;
         elementRef?: ((...args: any[]) => any) | undefined;
         as?: import("@instructure/shared-types/types/CommonProps").AsElementType | undefined;
-        variant?: "default" | "inverse" | undefined; /**
-        ---
-        parent: Modal
-        id: Modal.Body
-        ---
-        **/
+        variant?: "default" | "inverse" | undefined;
         overflow?: "scroll" | "fit" | undefined;
     })[];
     static defaultProps: {

package/types/Modal/ModalBody/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/Modal/ModalBody/index.tsx"],"names":[],"mappings":"AAwBA,eAAe;AACf,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAMjC,OAAO,EAAa,GAAG,EAAE,MAAM,sBAAsB,CAAA;AAKrD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAA;AAE7C;;;;;GAKG;AACH,cAEM,SAAU,SAAQ,SAAS,CAAC,cAAc,CAAC;IAC/C,MAAM,CAAC,QAAQ,CAAC,WAAW,gBAAe;IAE1C,MAAM,CAAC,SAAS;;;;;qDAXlB;;;;;WAKG;;OAM2B;IAC5B,MAAM,CAAC,YAAY;;;;;qDAZrB;;;;;WAKG;;SAOiC;IAClC,MAAM,CAAC,YAAY;;;;;MAKlB;IAED,iBAAiB;IAMjB,kBAAkB,CAAC,SAAS,KAAA,EAAE,SAAS,KAAA,EAAE,QAAQ,KAAA;IAKjD,MAAM;CAiCP;AAED,eAAe,SAAS,CAAA;AACxB,OAAO,EAAE,SAAS,EAAE,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/Modal/ModalBody/index.tsx"],"names":[],"mappings":"AAwBA,eAAe;AACf,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAMjC,OAAO,EAAa,GAAG,EAAE,MAAM,sBAAsB,CAAA;AAKrD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAA;AAE7C;;;;;GAKG;AACH,cAEM,SAAU,SAAQ,SAAS,CAAC,cAAc,CAAC;IAC/C,MAAM,CAAC,QAAQ,CAAC,WAAW,gBAAe;IAE1C,MAAM,CAAC,SAAS;;;;;;;OAAY;IAC5B,MAAM,CAAC,YAAY;;;;;;;SAAe;IAClC,MAAM,CAAC,YAAY;;;;;MAKlB;IAED,iBAAiB;IAMjB,kBAAkB,CAAC,SAAS,KAAA,EAAE,SAAS,KAAA,EAAE,QAAQ,KAAA;IAKjD,MAAM;CAiCP;AAED,eAAe,SAAS,CAAA;AACxB,OAAO,EAAE,SAAS,EAAE,CAAA"}

package/types/Modal/ModalBody/props.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
-import type { Spacing, WithStyleProps } from '@instructure/emotion';
-import type { AsElementType, PropValidators } from '@instructure/shared-types';
+import type { Spacing, WithStyleProps, ComponentStyle } from '@instructure/emotion';
+import type { AsElementType, PropValidators, ModalBodyTheme } from '@instructure/shared-types';
 declare type ModalBodyOwnProps = {
     children?: React.ReactNode;
     padding?: Spacing;
@@ -11,9 +11,10 @@ declare type ModalBodyOwnProps = {
 };
 declare type PropKeys = keyof ModalBodyOwnProps;
 declare type AllowedPropKeys = Readonly<Array<PropKeys>>;
-declare type ModalBodyProps = ModalBodyOwnProps & WithStyleProps;
+declare type ModalBodyProps = ModalBodyOwnProps & WithStyleProps<ModalBodyTheme, ModalBodyStyle>;
+declare type ModalBodyStyle = ComponentStyle<'modalBody'>;
 declare const propTypes: PropValidators<PropKeys>;
 declare const allowedProps: AllowedPropKeys;
-export type { ModalBodyProps };
+export type { ModalBodyProps, ModalBodyStyle };
 export { propTypes, allowedProps };
 //# sourceMappingURL=props.d.ts.map

package/types/Modal/ModalBody/props.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../../src/Modal/ModalBody/props.ts"],"names":[],"mappings":"AAwBA,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB,OAAO,KAAK,EAAE,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAA;AACnE,OAAO,KAAK,EAAE,aAAa,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAA;AAE9E,aAAK,iBAAiB,GAAG;IACvB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,UAAU,CAAC,EAAE,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,GAAG,CAAA;IACpC,EAAE,CAAC,EAAE,aAAa,CAAA;IAClB,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,CAAA;IAC/B,QAAQ,CAAC,EAAE,QAAQ,GAAG,KAAK,CAAA;CAC5B,CAAA;AAED,aAAK,QAAQ,GAAG,MAAM,iBAAiB,CAAA;AAEvC,aAAK,eAAe,GAAG,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAA;AAEhD,aAAK,cAAc,GAAG,iBAAiB,GAAG,cAAc,CAAA;AAExD,QAAA,MAAM,SAAS,EAAE,cAAc,CAAC,QAAQ,CAOvC,CAAA;AAED,QAAA,MAAM,YAAY,EAAE,eAOnB,CAAA;AAED,YAAY,EAAE,cAAc,EAAE,CAAA;AAC9B,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,CAAA"}
+{"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../../src/Modal/ModalBody/props.ts"],"names":[],"mappings":"AAwBA,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB,OAAO,KAAK,EACV,OAAO,EACP,cAAc,EACd,cAAc,EACf,MAAM,sBAAsB,CAAA;AAC7B,OAAO,KAAK,EACV,aAAa,EACb,cAAc,EACd,cAAc,EACf,MAAM,2BAA2B,CAAA;AAElC,aAAK,iBAAiB,GAAG;IACvB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,UAAU,CAAC,EAAE,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,GAAG,CAAA;IACpC,EAAE,CAAC,EAAE,aAAa,CAAA;IAClB,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,CAAA;IAC/B,QAAQ,CAAC,EAAE,QAAQ,GAAG,KAAK,CAAA;CAC5B,CAAA;AAED,aAAK,QAAQ,GAAG,MAAM,iBAAiB,CAAA;AAEvC,aAAK,eAAe,GAAG,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAA;AAEhD,aAAK,cAAc,GAAG,iBAAiB,GACrC,cAAc,CAAC,cAAc,EAAE,cAAc,CAAC,CAAA;AAEhD,aAAK,cAAc,GAAG,cAAc,CAAC,WAAW,CAAC,CAAA;AAEjD,QAAA,MAAM,SAAS,EAAE,cAAc,CAAC,QAAQ,CAOvC,CAAA;AAED,QAAA,MAAM,YAAY,EAAE,eAOnB,CAAA;AAED,YAAY,EAAE,cAAc,EAAE,cAAc,EAAE,CAAA;AAC9C,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,CAAA"}

package/types/Modal/ModalBody/styles.d.ts

@@ -1,5 +1,5 @@
-import { ModalBodyTheme } from '@instructure/shared-types';
-import { ModalBodyProps } from './props';
+import type { ModalBodyTheme } from '@instructure/shared-types';
+import type { ModalBodyProps, ModalBodyStyle } from './props';
 /**
  * ---
  * private: true
@@ -10,26 +10,6 @@ import { ModalBodyProps } from './props';
  * @param  {Object} state the state of the component, the style is applied to
  * @return {Object} The final style object, which will be used in the component
  */
-declare const generateStyle: (componentTheme: ModalBodyTheme, props: ModalBodyProps) => {
-    modalBody: {
-        background: string;
-        label: string;
-        boxSizing: string;
-        flex: string;
-        overflowY: string;
-        '&:focus': {
-            outline: string;
-        };
-    } | {
-        background?: undefined;
-        label: string;
-        boxSizing: string;
-        flex: string;
-        overflowY: string;
-        '&:focus': {
-            outline: string;
-        };
-    };
-};
+declare const generateStyle: (componentTheme: ModalBodyTheme, props: ModalBodyProps) => ModalBodyStyle;
 export default generateStyle;
 //# sourceMappingURL=styles.d.ts.map

package/types/Modal/ModalBody/styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/Modal/ModalBody/styles.ts"],"names":[],"mappings":"AAwBA,OAAO,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAA;AAC1D,OAAO,EAAE,cAAc,EAAE,MAAM,SAAS,CAAA;AAExC;;;;;;;;;GASG;AACH,QAAA,MAAM,aAAa,mBACD,cAAc,SACvB,cAAc;;;;;;;;;;;;;;;;;;;;CAuBtB,CAAA;AAED,eAAe,aAAa,CAAA"}
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/Modal/ModalBody/styles.ts"],"names":[],"mappings":"AAwBA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAA;AAC/D,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,SAAS,CAAA;AAE7D;;;;;;;;;GASG;AACH,QAAA,MAAM,aAAa,mBACD,cAAc,SACvB,cAAc,KACpB,cAsBF,CAAA;AAED,eAAe,aAAa,CAAA"}

package/types/Modal/ModalFooter/props.d.ts

@@ -1,15 +1,16 @@
 import React from 'react';
-import type { PropValidators } from '@instructure/shared-types';
-import type { WithStyleProps } from '@instructure/emotion';
+import type { PropValidators, ModalFooterTheme } from '@instructure/shared-types';
+import type { WithStyleProps, ComponentStyle } from '@instructure/emotion';
 declare type ModalFooterOwnProps = {
     children?: React.ReactNode;
     variant?: 'default' | 'inverse';
 };
 declare type PropKeys = keyof ModalFooterOwnProps;
 declare type AllowedPropKeys = Readonly<Array<PropKeys>>;
-declare type ModalFooterProps = ModalFooterOwnProps & WithStyleProps;
+declare type ModalFooterProps = ModalFooterOwnProps & WithStyleProps<ModalFooterTheme, ModalFooterStyle>;
+declare type ModalFooterStyle = ComponentStyle<'modalFooter'>;
 declare const propTypes: PropValidators<PropKeys>;
 declare const allowedProps: AllowedPropKeys;
-export type { ModalFooterProps };
+export type { ModalFooterProps, ModalFooterStyle };
 export { propTypes, allowedProps };
 //# sourceMappingURL=props.d.ts.map

package/types/Modal/ModalFooter/props.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../../src/Modal/ModalFooter/props.ts"],"names":[],"mappings":"AAwBA,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAA;AAC/D,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAA;AAE1D,aAAK,mBAAmB,GAAG;IACzB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,CAAA;CAChC,CAAA;AAED,aAAK,QAAQ,GAAG,MAAM,mBAAmB,CAAA;AAEzC,aAAK,eAAe,GAAG,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAA;AAEhD,aAAK,gBAAgB,GAAG,mBAAmB,GAAG,cAAc,CAAA;AAE5D,QAAA,MAAM,SAAS,EAAE,cAAc,CAAC,QAAQ,CAGvC,CAAA;AAED,QAAA,MAAM,YAAY,EAAE,eAAyC,CAAA;AAE7D,YAAY,EAAE,gBAAgB,EAAE,CAAA;AAChC,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,CAAA"}
+{"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../../src/Modal/ModalFooter/props.ts"],"names":[],"mappings":"AAwBA,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,KAAK,EACV,cAAc,EACd,gBAAgB,EACjB,MAAM,2BAA2B,CAAA;AAClC,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAA;AAE1E,aAAK,mBAAmB,GAAG;IACzB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,CAAA;CAChC,CAAA;AAED,aAAK,QAAQ,GAAG,MAAM,mBAAmB,CAAA;AAEzC,aAAK,eAAe,GAAG,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAA;AAEhD,aAAK,gBAAgB,GAAG,mBAAmB,GACzC,cAAc,CAAC,gBAAgB,EAAE,gBAAgB,CAAC,CAAA;AAEpD,aAAK,gBAAgB,GAAG,cAAc,CAAC,aAAa,CAAC,CAAA;AAErD,QAAA,MAAM,SAAS,EAAE,cAAc,CAAC,QAAQ,CAGvC,CAAA;AAED,QAAA,MAAM,YAAY,EAAE,eAAyC,CAAA;AAE7D,YAAY,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,CAAA;AAClD,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,CAAA"}

package/types/Modal/ModalFooter/styles.d.ts

@@ -1,5 +1,5 @@
-import { ModalFooterTheme } from '@instructure/shared-types';
-import { ModalFooterProps } from './props';
+import type { ModalFooterTheme } from '@instructure/shared-types';
+import type { ModalFooterProps, ModalFooterStyle } from './props';
 /**
  * ---
  * private: true
@@ -10,19 +10,6 @@ import { ModalFooterProps } from './props';
  * @param  {Object} state the state of the component, the style is applied to
  * @return {Object} The final style object, which will be used in the component
  */
-declare const generateStyle: (componentTheme: ModalFooterTheme, props: ModalFooterProps) => {
-    modalFooter: {
-        background: string;
-        borderTop: string;
-        label: string;
-        flex: string;
-        boxSizing: string;
-        padding: string | 0;
-        borderBottomRightRadius: string | 0;
-        borderBottomLeftRadius: string | 0;
-        display: string;
-        justifyContent: string;
-    };
-};
+declare const generateStyle: (componentTheme: ModalFooterTheme, props: ModalFooterProps) => ModalFooterStyle;
 export default generateStyle;
 //# sourceMappingURL=styles.d.ts.map

package/types/Modal/ModalFooter/styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/Modal/ModalFooter/styles.ts"],"names":[],"mappings":"AAwBA,OAAO,EAAE,gBAAgB,EAAE,MAAM,2BAA2B,CAAA;AAC5D,OAAO,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAA;AAE1C;;;;;;;;;GASG;AACH,QAAA,MAAM,aAAa,mBACD,gBAAgB,SACzB,gBAAgB;;;;;;;;;;;;;CA4BxB,CAAA;AAED,eAAe,aAAa,CAAA"}
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/Modal/ModalFooter/styles.ts"],"names":[],"mappings":"AAwBA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,2BAA2B,CAAA;AACjE,OAAO,KAAK,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAA;AAEjE;;;;;;;;;GASG;AACH,QAAA,MAAM,aAAa,mBACD,gBAAgB,SACzB,gBAAgB,KACtB,gBA2BF,CAAA;AAED,eAAe,aAAa,CAAA"}

package/types/Modal/ModalHeader/props.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
-import type { PropValidators } from '@instructure/shared-types';
-import type { WithStyleProps } from '@instructure/emotion';
+import type { PropValidators, ModalHeaderTheme } from '@instructure/shared-types';
+import type { WithStyleProps, ComponentStyle } from '@instructure/emotion';
 declare type ModalHeaderOwnProps = {
     children?: React.ReactNode;
     variant?: 'default' | 'inverse';
@@ -10,9 +10,10 @@ declare type ModalHeaderStyleProps = {
 };
 declare type PropKeys = keyof ModalHeaderOwnProps;
 declare type AllowedPropKeys = Readonly<Array<PropKeys>>;
-declare type ModalHeaderProps = ModalHeaderOwnProps & WithStyleProps;
+declare type ModalHeaderProps = ModalHeaderOwnProps & WithStyleProps<ModalHeaderTheme, ModalHeaderStyle>;
+declare type ModalHeaderStyle = ComponentStyle<'modalHeader'>;
 declare const propTypes: PropValidators<PropKeys>;
 declare const allowedProps: AllowedPropKeys;
-export type { ModalHeaderProps, ModalHeaderStyleProps };
+export type { ModalHeaderProps, ModalHeaderStyleProps, ModalHeaderStyle };
 export { propTypes, allowedProps };
 //# sourceMappingURL=props.d.ts.map

package/types/Modal/ModalHeader/props.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../../src/Modal/ModalHeader/props.ts"],"names":[],"mappings":"AAwBA,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAA;AAC/D,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAA;AAE1D,aAAK,mBAAmB,GAAG;IACzB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,CAAA;CAChC,CAAA;AAED,aAAK,qBAAqB,GAAG;IAC3B,eAAe,EAAE,OAAO,CAAA;CACzB,CAAA;AAED,aAAK,QAAQ,GAAG,MAAM,mBAAmB,CAAA;AAEzC,aAAK,eAAe,GAAG,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAA;AAEhD,aAAK,gBAAgB,GAAG,mBAAmB,GAAG,cAAc,CAAA;AAE5D,QAAA,MAAM,SAAS,EAAE,cAAc,CAAC,QAAQ,CAGvC,CAAA;AAED,QAAA,MAAM,YAAY,EAAE,eAAyC,CAAA;AAE7D,YAAY,EAAE,gBAAgB,EAAE,qBAAqB,EAAE,CAAA;AACvD,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,CAAA"}
+{"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../../src/Modal/ModalHeader/props.ts"],"names":[],"mappings":"AAwBA,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,KAAK,EACV,cAAc,EACd,gBAAgB,EACjB,MAAM,2BAA2B,CAAA;AAClC,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAA;AAE1E,aAAK,mBAAmB,GAAG;IACzB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,CAAA;CAChC,CAAA;AAED,aAAK,qBAAqB,GAAG;IAC3B,eAAe,EAAE,OAAO,CAAA;CACzB,CAAA;AAED,aAAK,QAAQ,GAAG,MAAM,mBAAmB,CAAA;AAEzC,aAAK,eAAe,GAAG,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAA;AAEhD,aAAK,gBAAgB,GAAG,mBAAmB,GACzC,cAAc,CAAC,gBAAgB,EAAE,gBAAgB,CAAC,CAAA;AAEpD,aAAK,gBAAgB,GAAG,cAAc,CAAC,aAAa,CAAC,CAAA;AAErD,QAAA,MAAM,SAAS,EAAE,cAAc,CAAC,QAAQ,CAGvC,CAAA;AAED,QAAA,MAAM,YAAY,EAAE,eAAyC,CAAA;AAE7D,YAAY,EAAE,gBAAgB,EAAE,qBAAqB,EAAE,gBAAgB,EAAE,CAAA;AACzE,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,CAAA"}

package/types/Modal/ModalHeader/styles.d.ts

@@ -1,5 +1,5 @@
-import { ModalHeaderTheme } from '@instructure/shared-types';
-import { ModalHeaderProps, ModalHeaderStyleProps } from './props';
+import type { ModalHeaderTheme } from '@instructure/shared-types';
+import type { ModalHeaderProps, ModalHeaderStyleProps, ModalHeaderStyle } from './props';
 /**
  * ---
  * private: true
@@ -10,30 +10,6 @@ import { ModalHeaderProps, ModalHeaderStyleProps } from './props';
  * @param  {Object} state the state of the component, the style is applied to
  * @return {Object} The final style object, which will be used in the component
  */
-declare const generateStyle: (componentTheme: ModalHeaderTheme, props: ModalHeaderProps, state: ModalHeaderStyleProps) => {
-    modalHeader: {
-        paddingInlineEnd: string | 0;
-        background: string;
-        borderBottomColor: string;
-        label: string;
-        boxSizing: string;
-        padding: string | 0;
-        paddingInlineStart: string | 0;
-        flex: string;
-        borderBottomWidth: string;
-        borderBottomStyle: string;
-    } | {
-        paddingInlineEnd: string | 0;
-        background: string;
-        borderBottomColor: string;
-        label: string;
-        boxSizing: string;
-        padding: string | 0;
-        paddingInlineStart: string | 0;
-        flex: string;
-        borderBottomWidth: string;
-        borderBottomStyle: string;
-    };
-};
+declare const generateStyle: (componentTheme: ModalHeaderTheme, props: ModalHeaderProps, state: ModalHeaderStyleProps) => ModalHeaderStyle;
 export default generateStyle;
 //# sourceMappingURL=styles.d.ts.map

package/types/Modal/ModalHeader/styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/Modal/ModalHeader/styles.ts"],"names":[],"mappings":"AAwBA,OAAO,EAAE,gBAAgB,EAAE,MAAM,2BAA2B,CAAA;AAC5D,OAAO,EAAE,gBAAgB,EAAE,qBAAqB,EAAE,MAAM,SAAS,CAAA;AAEjE;;;;;;;;;GASG;AACH,QAAA,MAAM,aAAa,mBACD,gBAAgB,SACzB,gBAAgB,SAChB,qBAAqB;;;;;;;;;;;;;;;;;;;;;;;;CAoC7B,CAAA;AAED,eAAe,aAAa,CAAA"}
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/Modal/ModalHeader/styles.ts"],"names":[],"mappings":"AAwBA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,2BAA2B,CAAA;AACjE,OAAO,KAAK,EACV,gBAAgB,EAChB,qBAAqB,EACrB,gBAAgB,EACjB,MAAM,SAAS,CAAA;AAEhB;;;;;;;;;GASG;AACH,QAAA,MAAM,aAAa,mBACD,gBAAgB,SACzB,gBAAgB,SAChB,qBAAqB,KAC3B,gBAmCF,CAAA;AAED,eAAe,aAAa,CAAA"}

package/types/Modal/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/Modal/index.tsx"],"names":[],"mappings":"AAwBA,eAAe;AACf,OAAO,EAAY,SAAS,EAAE,YAAY,EAAE,MAAM,OAAO,CAAA;AAWzD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,wBAAwB,CAAA;AAExD,OAAO,EAAa,GAAG,EAAE,MAAM,sBAAsB,CAAA;AAErD,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAA;AAC3C,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAA;AACvC,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAA;AAM3C,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,SAAS,CAAA;AAEzC;;;;;GAKG;AACH,cAEM,KAAM,SAAQ,SAAS,CAAC,UAAU,CAAC;IACvC,MAAM,CAAC,QAAQ,CAAC,WAAW,WAAU;IAErC,MAAM,CAAC,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;OAAY;IAC5B,MAAM,CAAC,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;SAAe;IAClC,MAAM,CAAC,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;MA6BlB;IAED,MAAM,CAAC,MAAM,qBAAc;IAC3B,MAAM,CAAC,IAAI,mBAAY;IACvB,MAAM,CAAC,MAAM,qBAAc;gBAGf,KAAK,KAAA;IAQjB,QAAQ,EAAE,UAAU,CAAO;IAE3B,iBAAiB;IAMjB,kBAAkB,CAAC,SAAS,KAAA,EAAE,SAAS,KAAA,EAAE,QAAQ,KAAA;IAWjD,IAAI,mBAAmB,mHAEtB;IAED,IAAI,OAAO,IAYK,UAAU,CAVzB;IAED,IAAI,aAAa,yBAMhB;IAED,IAAI,OAAO,CAAC,EAAE,EAAE,UAAU,EAEzB;IAED,gBAAgB,YAAa,UAAU,UAEtC;IAED,sBAAsB,aAIrB;IAGD,UAAU,oBAMT;IAED,cAAc;IAqBd,YAAY,CAAC,KAAK,KAAA;IAiDlB,MAAM;CA0DP;AAED,eAAe,KAAK,CAAA;AACpB,OAAO,EAAE,KAAK,EAAE,WAAW,EAAE,SAAS,EAAE,WAAW,EAAE,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/Modal/index.tsx"],"names":[],"mappings":"AAwBA,eAAe;AACf,OAAO,EAAY,SAAS,EAAE,YAAY,EAAE,MAAM,OAAO,CAAA;AAWzD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,wBAAwB,CAAA;AAExD,OAAO,EAAa,GAAG,EAAE,MAAM,sBAAsB,CAAA;AAErD,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAA;AAC3C,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAA;AACvC,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAA;AAM3C,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,SAAS,CAAA;AAEzC;;;;;GAKG;AACH,cAEM,KAAM,SAAQ,SAAS,CAAC,UAAU,CAAC;IACvC,MAAM,CAAC,QAAQ,CAAC,WAAW,WAAU;IAErC,MAAM,CAAC,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;OAAY;IAC5B,MAAM,CAAC,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;SAAe;IAClC,MAAM,CAAC,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;MA6BlB;IAED,MAAM,CAAC,MAAM,qBAAc;IAC3B,MAAM,CAAC,IAAI,mBAAY;IACvB,MAAM,CAAC,MAAM,qBAAc;gBAGf,KAAK,KAAA;IAQjB,QAAQ,EAAE,UAAU,CAAO;IAE3B,iBAAiB;IAMjB,kBAAkB,CAAC,SAAS,KAAA,EAAE,SAAS,KAAA,EAAE,QAAQ,KAAA;IAWjD,IAAI,mBAAmB,mHAEtB;IAED,IAAI,OAAO,IAYK,UAAU,CAVzB;IAED,IAAI,aAAa,yBAMhB;IAED,IAAI,OAAO,CAAC,EAAE,EAAE,UAAU,EAEzB;IAED,gBAAgB,YAAa,UAAU,UAEtC;IAED,sBAAsB,aAIrB;IAGD,UAAU,oBAMT;IAED,cAAc;IAqBd,YAAY,CAAC,KAAK,KAAA;IAgDlB,MAAM;CA0DP;AAED,eAAe,KAAK,CAAA;AACpB,OAAO,EAAE,KAAK,EAAE,WAAW,EAAE,SAAS,EAAE,WAAW,EAAE,CAAA"}

package/types/Modal/props.d.ts

@@ -1,9 +1,9 @@
 import React from 'react';
-import type { AsElementType, PropValidators } from '@instructure/shared-types';
+import type { AsElementType, PropValidators, ModalTheme } from '@instructure/shared-types';
 import type { PortalNode } from '@instructure/ui-portal';
 import type { PositionMountNode } from '@instructure/ui-position';
 import type { TransitionType } from '@instructure/ui-motion';
-import type { WithStyleProps } from '@instructure/emotion';
+import type { WithStyleProps, ComponentStyle } from '@instructure/emotion';
 declare type ModalOwnProps = {
     label: string;
     children: React.ReactNode;
@@ -33,9 +33,10 @@ declare type ModalOwnProps = {
 };
 declare type PropKeys = keyof ModalOwnProps;
 declare type AllowedPropKeys = Readonly<Array<PropKeys>>;
-declare type ModalProps = ModalOwnProps & WithStyleProps;
+declare type ModalProps = ModalOwnProps & WithStyleProps<ModalTheme, ModalStyle>;
+declare type ModalStyle = ComponentStyle<'modal' | 'constrainContext'>;
 declare const propTypes: PropValidators<PropKeys>;
 declare const allowedProps: AllowedPropKeys;
-export type { ModalProps };
+export type { ModalProps, ModalStyle };
 export { propTypes, allowedProps };
 //# sourceMappingURL=props.d.ts.map

package/types/Modal/props.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../src/Modal/props.ts"],"names":[],"mappings":"AAwBA,OAAO,KAAK,MAAM,OAAO,CAAA;AAYzB,OAAO,KAAK,EAAE,aAAa,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAA;AAC9E,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,wBAAwB,CAAA;AACxD,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAA;AACjE,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAA;AAC5D,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAA;AAE1D,aAAK,aAAa,GAAG;IACnB,KAAK,EAAE,MAAM,CAAA;IACb,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,EAAE,CAAC,EAAE,aAAa,CAAA;IAClB,IAAI,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,GAAG,YAAY,CAAA;IAC3D,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,CAAA;IAC/B,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,mBAAmB,CAAC,EAAE,KAAK,CAAC,YAAY,GAAG,CAAC,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,GAAG,CAAC,CAAA;IACpE,iBAAiB,CAAC,EAAE,OAAO,CAAA;IAC3B,0BAA0B,CAAC,EAAE,OAAO,CAAA;IACpC,MAAM,CAAC,EAAE,CAAC,OAAO,EAAE,UAAU,KAAK,GAAG,CAAA;IACrC,OAAO,CAAC,EAAE,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,GAAG,CAAA;IACjC,SAAS,CAAC,EAAE,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,GAAG,CAAA;IACnC,UAAU,CAAC,EAAE,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,GAAG,CAAA;IACpC,SAAS,CAAC,EAAE,iBAAiB,CAAA;IAC7B,QAAQ,CAAC,EAAE,QAAQ,GAAG,KAAK,CAAA;IAC3B,UAAU,CAAC,EACP,KAAK,CAAC,YAAY,EAAE,GACpB,KAAK,CAAC,YAAY,GAClB,CAAC,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,GAAG,CAAC,CAAA;IAC7B,UAAU,CAAC,EAAE,cAAc,CAAA;IAC3B,OAAO,CAAC,EAAE,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,GAAG,CAAA;IACjC,UAAU,CAAC,EAAE,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,GAAG,CAAA;IACpC,SAAS,CAAC,EAAE,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,GAAG,CAAA;IACnC,MAAM,CAAC,EAAE,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,GAAG,CAAA;IAChC,SAAS,CAAC,EAAE,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,GAAG,CAAA;IACnC,QAAQ,CAAC,EAAE,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,GAAG,CAAA;IAClC,SAAS,CAAC,EAAE,QAAQ,GAAG,QAAQ,CAAA;IAC/B,QAAQ,CAAC,EAAE,QAAQ,GAAG,KAAK,CAAA;CAC5B,CAAA;AAED,aAAK,QAAQ,GAAG,MAAM,aAAa,CAAA;AAEnC,aAAK,eAAe,GAAG,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAA;AAEhD,aAAK,UAAU,GAAG,aAAa,GAAG,cAAc,CAAA;AAEhD,QAAA,MAAM,SAAS,EAAE,cAAc,CAAC,QAAQ,CA+HvC,CAAA;AAED,QAAA,MAAM,YAAY,EAAE,eA0BnB,CAAA;AAED,YAAY,EAAE,UAAU,EAAE,CAAA;AAC1B,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,CAAA"}
+{"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../src/Modal/props.ts"],"names":[],"mappings":"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"}

package/types/Modal/styles.d.ts

@@ -1,5 +1,5 @@
-import { ModalTheme } from '@instructure/shared-types';
-import { ModalProps } from './props';
+import type { ModalTheme } from '@instructure/shared-types';
+import type { ModalProps, ModalStyle } from './props';
 /**
  * ---
  * private: true
@@ -10,99 +10,6 @@ import { ModalProps } from './props';
  * @param  {Object} state the state of the component, the style is applied to
  * @return {Object} The final style object, which will be used in the component
  */
-declare const generateStyle: (componentTheme: ModalTheme, props: ModalProps) => {
-    modal: {
-        background: string;
-        color: string;
-        transform?: string | undefined;
-        maxWidth: string;
-        maxHeight: string;
-        flex: string;
-        minWidth: string;
-        label: string;
-        fontFamily: string;
-        display: string;
-        flexDirection: string;
-        position: string;
-        boxSizing: string;
-        boxShadow: string;
-        border: string;
-        borderRadius: string | 0;
-    } | {
-        background: string;
-        color: string;
-        transform?: string | undefined;
-        maxWidth: string;
-        maxHeight: string;
-        flex: string;
-        label: string;
-        fontFamily: string;
-        display: string;
-        minWidth: string;
-        flexDirection: string;
-        position: string;
-        boxSizing: string;
-        boxShadow: string;
-        border: string;
-        borderRadius: string | 0;
-    } | {
-        background: string;
-        color: string;
-        transform?: string | undefined;
-        maxWidth: string;
-        maxHeight: string;
-        flex: string;
-        label: string;
-        fontFamily: string;
-        display: string;
-        minWidth: string;
-        flexDirection: string;
-        position: string;
-        boxSizing: string;
-        boxShadow: string;
-        border: string;
-        borderRadius: string | 0;
-    } | {
-        background: string;
-        color: string;
-        transform?: string | undefined;
-        maxWidth: string;
-        maxHeight: string;
-        flex: string;
-        label: string;
-        fontFamily: string;
-        display: string;
-        minWidth: string;
-        flexDirection: string;
-        position: string;
-        boxSizing: string;
-        boxShadow: string;
-        border: string;
-        borderRadius: string | 0;
-    } | {
-        background: string;
-        color: string;
-        flex: number;
-        width: string;
-        height: string;
-        boxShadow: string;
-        border: string;
-        borderRadius: number;
-        label: string;
-        fontFamily: string;
-        display: string;
-        minWidth: string;
-        flexDirection: string;
-        position: string;
-        boxSizing: string;
-    };
-    constrainContext: {
-        label: string;
-        display: string;
-        position: string;
-        width: string;
-        height: string;
-    };
-};
+declare const generateStyle: (componentTheme: ModalTheme, props: ModalProps) => ModalStyle;
 export default generateStyle;
 //# sourceMappingURL=styles.d.ts.map

package/types/Modal/styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../src/Modal/styles.ts"],"names":[],"mappings":"AAwBA,OAAO,EAAE,UAAU,EAAE,MAAM,2BAA2B,CAAA;AACtD,OAAO,EAAE,UAAU,EAAE,MAAM,SAAS,CAAA;AAEpC;;;;;;;;;GASG;AACH,QAAA,MAAM,aAAa,mBAAoB,UAAU,SAAS,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAwEnE,CAAA;AAED,eAAe,aAAa,CAAA"}
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../src/Modal/styles.ts"],"names":[],"mappings":"AAwBA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,2BAA2B,CAAA;AAC3D,OAAO,KAAK,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,SAAS,CAAA;AAErD;;;;;;;;;GASG;AACH,QAAA,MAAM,aAAa,mBACD,UAAU,SACnB,UAAU,KAChB,UAwEF,CAAA;AAED,eAAe,aAAa,CAAA"}