@dt-dds/react-drawer 1.0.0-beta.58 → 1.0.0-beta.60

package/CHANGELOG.md

@@ -1,5 +1,31 @@
 # @dt-ui/react-drawer
 
+## 1.0.0-beta.60
+
+### Minor Changes
+
+- feat(core): share responsive HOC from core package
+
+### Patch Changes
+
+- Updated dependencies
+  - @dt-dds/react-core@1.0.0-beta.53
+  - @dt-dds/react-icon-button@1.0.0-beta.22
+  - @dt-dds/react-typography@1.0.0-beta.44
+
+## 1.0.0-beta.59
+
+### Patch Changes
+
+- fix(config): update ESLint, TS, and Storybook config
+- fix(icon-button): add missing @dt-dds/react-icon devDependency
+- Updated dependencies
+- Updated dependencies
+  - @dt-dds/react-core@1.0.0-beta.52
+  - @dt-dds/react-icon-button@1.0.0-beta.21
+  - @dt-dds/react-typography@1.0.0-beta.43
+  - @dt-dds/themes@1.0.0-beta.10
+
 ## 1.0.0-beta.58
 
 ### Minor Changes

package/dist/index.js

@@ -52,8 +52,8 @@ __export(index_exports, {
 module.exports = __toCommonJS(index_exports);
 
 // src/Drawer.tsx
-var import_react6 = require("@emotion/react");
-var import_react7 = require("react");
+var import_react6 = require("react");
+var import_react7 = require("@emotion/react");
 
 // src/components/title/DrawerTitle.tsx
 var import_react_typography = require("@dt-dds/react-typography");
@@ -63,6 +63,25 @@ var DrawerTitle = ({ title }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(imp
 // src/components/header/DrawerHeader.tsx
 var import_react_icon_button = require("@dt-dds/react-icon-button");
 
+// src/components/header/DrawerHeader.styled.ts
+var import_styled = __toESM(require("@emotion/styled"));
+var HeaderStyled = import_styled.default.header`
+  ${({ theme }) => `
+    display: flex;
+    justify-content: space-between;
+    align-items: flex-start;
+    padding: 0 ${theme.spacing.spacing_60} ${theme.spacing.spacing_50};
+
+    &:has(+.hasScroll) {
+      box-shadow: ${theme.shadows.elevation_100};
+    }
+
+    @media only screen and (min-width: ${theme.breakpoints.mq2}px) {
+      padding: 0 ${theme.spacing.spacing_80} ${theme.spacing.spacing_50};
+    }
+  `}
+`;
+
 // ../../dt-dds-react/core/assets/svgs/AllOut.tsx
 var import_jsx_runtime2 = require("react/jsx-runtime");
 
@@ -280,25 +299,6 @@ var useDrawerContext = () => {
   return context;
 };
 
-// src/components/header/DrawerHeader.styled.ts
-var import_styled = __toESM(require("@emotion/styled"));
-var HeaderStyled = import_styled.default.header`
-  ${({ theme }) => `
-    display: flex;
-    justify-content: space-between;
-    align-items: flex-start;
-    padding: 0 ${theme.spacing.spacing_60} ${theme.spacing.spacing_50};
-
-    &:has(+.hasScroll) {
-      box-shadow: ${theme.shadows.elevation_100};
-    }
-
-    @media only screen and (min-width: ${theme.breakpoints.mq2}px) {
-      padding: 0 ${theme.spacing.spacing_80} ${theme.spacing.spacing_50};
-    }
-  `}
-`;
-
 // src/components/header/DrawerHeader.tsx
 var import_jsx_runtime60 = require("react/jsx-runtime");
 var DrawerHeader = ({ children }) => {
@@ -372,9 +372,9 @@ var DrawerBody = ({ children, style, dataTestId }) => {
 };
 
 // src/Drawer.styled.ts
-var import_react_core = require("@dt-dds/react-core");
 var import_react5 = require("@emotion/react");
 var import_styled3 = __toESM(require("@emotion/styled"));
+var import_react_core = require("@dt-dds/react-core");
 var GlobalStyle = import_react5.css`
   body {
     overflow: hidden;
@@ -433,15 +433,15 @@ var Drawer = ({
   children,
   dataTestId
 }) => {
-  const [isTransformed, setIsTransformed] = (0, import_react7.useState)(false);
-  const theme = (0, import_react6.useTheme)();
-  const handleClose = (0, import_react7.useCallback)(() => {
+  const [isTransformed, setIsTransformed] = (0, import_react6.useState)(false);
+  const theme = (0, import_react7.useTheme)();
+  const handleClose = (0, import_react6.useCallback)(() => {
     setIsTransformed(false);
     setTimeout(() => {
       setIsVisible(false);
     }, animationToMiliseconds(theme.animations.emphasizedDecelerate.timingFunction));
   }, [setIsVisible, theme.animations.emphasizedDecelerate.timingFunction]);
-  (0, import_react7.useEffect)(() => {
+  (0, import_react6.useEffect)(() => {
     const handleKeyDown = (event) => {
       if (event.key === "Escape") {
         handleClose();
@@ -454,7 +454,7 @@ var Drawer = ({
     };
   }, [handleClose, isVisible]);
   return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(DrawerContextProvider, { handleClose, children: /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(MainContainerStyled, { children: [
-    isVisible ? /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_react6.Global, { styles: GlobalStyle }) : null,
+    isVisible ? /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_react7.Global, { styles: GlobalStyle }) : null,
     /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
       OverlayStyled,
       {

package/dist/index.mjs

@@ -19,8 +19,8 @@ var __spreadValues = (a, b) => {
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 
 // src/Drawer.tsx
-import { useTheme as useTheme3, Global } from "@emotion/react";
 import { useCallback, useEffect as useEffect2, useState } from "react";
+import { useTheme as useTheme3, Global } from "@emotion/react";
 
 // src/components/title/DrawerTitle.tsx
 import { Typography } from "@dt-dds/react-typography";
@@ -30,6 +30,25 @@ var DrawerTitle = ({ title }) => /* @__PURE__ */ jsx(Typography, { color: "conte
 // src/components/header/DrawerHeader.tsx
 import { IconButton } from "@dt-dds/react-icon-button";
 
+// src/components/header/DrawerHeader.styled.ts
+import styled from "@emotion/styled";
+var HeaderStyled = styled.header`
+  ${({ theme }) => `
+    display: flex;
+    justify-content: space-between;
+    align-items: flex-start;
+    padding: 0 ${theme.spacing.spacing_60} ${theme.spacing.spacing_50};
+
+    &:has(+.hasScroll) {
+      box-shadow: ${theme.shadows.elevation_100};
+    }
+
+    @media only screen and (min-width: ${theme.breakpoints.mq2}px) {
+      padding: 0 ${theme.spacing.spacing_80} ${theme.spacing.spacing_50};
+    }
+  `}
+`;
+
 // ../../dt-dds-react/core/assets/svgs/AllOut.tsx
 import { jsx as jsx2, jsxs } from "react/jsx-runtime";
 
@@ -247,25 +266,6 @@ var useDrawerContext = () => {
   return context;
 };
 
-// src/components/header/DrawerHeader.styled.ts
-import styled from "@emotion/styled";
-var HeaderStyled = styled.header`
-  ${({ theme }) => `
-    display: flex;
-    justify-content: space-between;
-    align-items: flex-start;
-    padding: 0 ${theme.spacing.spacing_60} ${theme.spacing.spacing_50};
-
-    &:has(+.hasScroll) {
-      box-shadow: ${theme.shadows.elevation_100};
-    }
-
-    @media only screen and (min-width: ${theme.breakpoints.mq2}px) {
-      padding: 0 ${theme.spacing.spacing_80} ${theme.spacing.spacing_50};
-    }
-  `}
-`;
-
 // src/components/header/DrawerHeader.tsx
 import { jsx as jsx60, jsxs as jsxs25 } from "react/jsx-runtime";
 var DrawerHeader = ({ children }) => {
@@ -339,9 +339,9 @@ var DrawerBody = ({ children, style, dataTestId }) => {
 };
 
 // src/Drawer.styled.ts
-import { DRAWER_Z_INDEX } from "@dt-dds/react-core";
 import { css } from "@emotion/react";
 import styled3 from "@emotion/styled";
+import { DRAWER_Z_INDEX } from "@dt-dds/react-core";
 var GlobalStyle = css`
   body {
     overflow: hidden;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dt-dds/react-drawer",
-  "version": "1.0.0-beta.58",
+  "version": "1.0.0-beta.60",
   "license": "MIT",
   "exports": {
     ".": "./dist/index.js"
@@ -20,10 +20,10 @@
     "test:update:snapshot": "jest -u"
   },
   "dependencies": {
-    "@dt-dds/react-core": "1.0.0-beta.51",
-    "@dt-dds/react-icon-button": "1.0.0-beta.20",
-    "@dt-dds/react-typography": "1.0.0-beta.42",
-    "@dt-dds/themes": "1.0.0-beta.9"
+    "@dt-dds/react-core": "1.0.0-beta.53",
+    "@dt-dds/react-icon-button": "1.0.0-beta.22",
+    "@dt-dds/react-typography": "1.0.0-beta.44",
+    "@dt-dds/themes": "1.0.0-beta.10"
   },
   "devDependencies": {
     "@babel/core": "^7.22.9",