@dt-dds/react-empty-state 1.0.0-beta.58

package/CHANGELOG.md

@@ -0,0 +1,570 @@
+# @dt-ui/react-empty-state
+
+## 1.0.0-beta.58
+
+### Major Changes
+
+- refactor!: rename pkg and publish to npmjs
+
+### Patch Changes
+
+- Updated dependencies
+  - @dt-dds/react-button@1.0.0-beta.38
+  - @dt-dds/react-core@1.0.0-beta.41
+  - @dt-dds/react-typography@1.0.0-beta.32
+
+## 0.1.0-beta.57
+
+### Patch Changes
+
+- refactor: theme typography values
+- Updated dependencies
+  - @dt-ui/react-core@0.1.0-beta.40
+  - @dt-ui/react-button@0.1.0-beta.37
+  - @dt-ui/react-typography@0.1.0-beta.31
+
+## 0.1.0-beta.56
+
+### Minor Changes
+
+- feat: update shadow theme values
+
+### Patch Changes
+
+- Updated dependencies
+  - @dt-ui/react-core@0.1.0-beta.39
+  - @dt-ui/react-button@0.1.0-beta.36
+  - @dt-ui/react-typography@0.1.0-beta.30
+
+## 0.1.0-beta.55
+
+### Patch Changes
+
+- chore: update theme font-styles
+- Updated dependencies
+  - @dt-ui/react-core@0.1.0-beta.38
+  - @dt-ui/react-button@0.1.0-beta.35
+  - @dt-ui/react-typography@0.1.0-beta.29
+
+## 0.1.0-beta.54
+
+### Patch Changes
+
+- chore: review OSS files
+- Updated dependencies
+  - @dt-ui/react-button@0.1.0-beta.34
+  - @dt-ui/react-core@0.1.0-beta.37
+  - @dt-ui/react-typography@0.1.0-beta.28
+
+## 0.1.0-beta.53
+
+### Minor Changes
+
+- feat: add mobile breakpoint for button
+
+### Patch Changes
+
+- Updated dependencies
+  - @dt-ui/react-button@0.1.0-beta.33
+
+## 0.1.0-beta.52
+
+### Patch Changes
+
+- chore: update contextual colors
+- Updated dependencies
+  - @dt-ui/react-button@0.1.0-beta.32
+  - @dt-ui/react-core@0.1.0-beta.36
+  - @dt-ui/react-typography@0.1.0-beta.27
+
+## 0.1.0-beta.51
+
+### Patch Changes
+
+- fix: change content.light contextual color
+- Updated dependencies
+  - @dt-ui/react-core@0.1.0-beta.35
+  - @dt-ui/react-button@0.1.0-beta.31
+  - @dt-ui/react-typography@0.1.0-beta.26
+
+## 0.1.0-beta.50
+
+### Minor Changes
+
+- feat: move icon-button to independent
+
+### Patch Changes
+
+- fix: reduce button height
+- Updated dependencies
+  - @dt-ui/react-button@0.1.0-beta.30
+
+## 0.1.0-beta.49
+
+### Patch Changes
+
+- fix: add accent to colors type
+- Updated dependencies
+  - @dt-ui/react-core@0.1.0-beta.34
+  - @dt-ui/react-button@0.1.0-beta.29
+  - @dt-ui/react-typography@0.1.0-beta.25
+
+## 0.1.0-beta.48
+
+### Patch Changes
+
+- fix: button styles
+- Updated dependencies
+  - @dt-ui/react-button@0.1.0-beta.28
+
+## 0.1.0-beta.47
+
+### Patch Changes
+
+- fix: change button text according to ux
+- Updated dependencies
+  - @dt-ui/react-button@0.1.0-beta.27
+  - @dt-ui/react-core@0.1.0-beta.33
+  - @dt-ui/react-typography@0.1.0-beta.24
+
+## 0.1.0-beta.46
+
+### Patch Changes
+
+- fix: change button styles
+- Updated dependencies
+  - @dt-ui/react-button@0.1.0-beta.26
+
+## 0.1.0-beta.45
+
+### Patch Changes
+
+- chore: update contexual colors
+- Updated dependencies
+  - @dt-ui/react-button@0.1.0-beta.25
+  - @dt-ui/react-core@0.1.0-beta.32
+  - @dt-ui/react-typography@0.1.0-beta.23
+
+## 0.1.0-beta.44
+
+### Patch Changes
+
+- fix: button loading responsiveness
+- refactor: avoid centring spinner
+- Updated dependencies
+- Updated dependencies
+  - @dt-ui/react-button@0.1.0-beta.24
+
+## 0.1.0-beta.43
+
+### Patch Changes
+
+- style: update responsive font styles
+- Updated dependencies
+  - @dt-ui/react-core@0.1.0-beta.31
+  - @dt-ui/react-button@0.1.0-beta.23
+  - @dt-ui/react-typography@0.1.0-beta.22
+
+## 0.1.0-beta.42
+
+### Minor Changes
+
+- feat: add accent color to button appearance
+- feat: add spinner size 'extra-small' & update specs
+
+### Patch Changes
+
+- Updated dependencies
+- Updated dependencies
+  - @dt-ui/react-button@0.1.0-beta.22
+  - @dt-ui/react-core@0.1.0-beta.30
+  - @dt-ui/react-typography@0.1.0-beta.21
+
+## 0.1.0-beta.41
+
+### Patch Changes
+
+- chore: add theme breakpoints
+- Updated dependencies
+  - @dt-ui/react-core@0.1.0-beta.29
+  - @dt-ui/react-button@0.1.0-beta.21
+  - @dt-ui/react-typography@0.1.0-beta.20
+
+## 0.1.0-beta.40
+
+### Patch Changes
+
+- fix(button-styles): update :disabled colors
+- Updated dependencies
+  - @dt-ui/react-button@0.1.0-beta.20
+
+## 0.1.0-beta.39
+
+### Minor Changes
+
+- feat: add id to base props
+
+### Patch Changes
+
+- Updated dependencies
+  - @dt-ui/react-core@0.1.0-beta.28
+  - @dt-ui/react-typography@0.1.0-beta.19
+  - @dt-ui/react-button@0.1.0-beta.19
+
+## 0.1.0-beta.38
+
+### Minor Changes
+
+- feat: change breakpoints values
+
+### Patch Changes
+
+- Updated dependencies
+  - @dt-ui/react-button@0.1.0-beta.18
+  - @dt-ui/react-core@0.1.0-beta.27
+  - @dt-ui/react-typography@0.1.0-beta.18
+
+## 0.1.0-beta.37
+
+### Patch Changes
+
+- fix: replace body to correct one
+- Updated dependencies
+  - @dt-ui/react-core@0.1.0-beta.26
+  - @dt-ui/react-button@0.1.0-beta.17
+  - @dt-ui/react-typography@0.1.0-beta.17
+
+## 0.1.0-beta.36
+
+### Patch Changes
+
+- chore: add theme colors missing types
+- Updated dependencies
+  - @dt-ui/react-core@0.1.0-beta.25
+  - @dt-ui/react-button@0.1.0-beta.16
+  - @dt-ui/react-typography@0.1.0-beta.16
+
+## 0.1.0-beta.35
+
+### Patch Changes
+
+- refactor: drop truckapi theme
+- Updated dependencies
+  - @dt-ui/react-core@0.1.0-beta.24
+  - @dt-ui/react-button@0.1.0-beta.15
+  - @dt-ui/react-typography@0.1.0-beta.15
+
+## 0.1.0-beta.34
+
+### Minor Changes
+
+- feat: update core and semantic colors
+- feat: remove greenlane theme
+
+### Patch Changes
+
+- Updated dependencies
+- Updated dependencies
+  - @dt-ui/react-button@0.1.0-beta.14
+  - @dt-ui/react-core@0.1.0-beta.23
+  - @dt-ui/react-typography@0.1.0-beta.14
+
+## 0.1.0-beta.33
+
+### Minor Changes
+
+- feat: add icon option for truckapi theme
+
+### Patch Changes
+
+- Updated dependencies
+  - @dt-ui/react-core@0.1.0-beta.22
+  - @dt-ui/react-button@0.1.0-beta.13
+  - @dt-ui/react-typography@0.1.0-beta.13
+
+## 0.1.0-beta.32
+
+### Patch Changes
+
+- fix: tooltip z index
+- Updated dependencies
+  - @dt-ui/react-core@0.1.0-beta.21
+  - @dt-ui/react-button@0.1.0-beta.12
+  - @dt-ui/react-typography@0.1.0-beta.12
+
+## 0.1.0-beta.31
+
+### Minor Changes
+
+- feat: add segmented control component
+
+### Patch Changes
+
+- Updated dependencies
+  - @dt-ui/react-core@0.1.0-beta.20
+  - @dt-ui/react-button@0.1.0-beta.11
+  - @dt-ui/react-typography@0.1.0-beta.11
+
+## 0.1.0-beta.30
+
+### Patch Changes
+
+- fix: add shape for tooltip on truckapi theme
+- Updated dependencies
+  - @dt-ui/react-core@0.1.0-beta.19
+  - @dt-ui/react-button@0.1.0-beta.10
+  - @dt-ui/react-typography@0.1.0-beta.10
+
+## 0.1.0-beta.29
+
+### Patch Changes
+
+- fix: remove devDependecy export
+- Updated dependencies
+  - @dt-ui/react-core@0.1.0-beta.18
+  - @dt-ui/react-button@0.1.0-beta.9
+  - @dt-ui/react-typography@0.1.0-beta.9
+
+## 0.1.0-beta.28
+
+### Patch Changes
+
+- test: add test custom render
+- Updated dependencies
+  - @dt-ui/react-core@0.1.0-beta.17
+  - @dt-ui/react-button@0.1.0-beta.8
+  - @dt-ui/react-typography@0.1.0-beta.8
+
+## 0.1.0-beta.27
+
+### Minor Changes
+
+- feat: create select
+
+### Patch Changes
+
+- Updated dependencies
+  - @dt-ui/react-core@0.1.0-beta.16
+  - @dt-ui/react-button@0.1.0-beta.7
+  - @dt-ui/react-typography@0.1.0-beta.7
+
+## 0.1.0-beta.26
+
+### Patch Changes
+
+- fix: show shadows only when scroll is visible
+- Updated dependencies
+  - @dt-ui/react-core@0.1.0-beta.15
+  - @dt-ui/react-button@0.1.0-beta.6
+  - @dt-ui/react-typography@0.1.0-beta.6
+
+## 0.1.0-beta.25
+
+### Patch Changes
+
+- fix: update border radius theme specifications
+- Updated dependencies
+  - @dt-ui/react-core@0.1.0-beta.14
+  - @dt-ui/react-button@0.1.0-beta.5
+  - @dt-ui/react-typography@0.1.0-beta.5
+
+## 0.1.0-beta.24
+
+### Patch Changes
+
+- fix: change the default type of button
+- Updated dependencies
+  - @dt-ui/react-button@0.1.0-beta.4
+
+## 0.1.0-beta.23
+
+### Patch Changes
+
+- fix: match accordion design
+- Updated dependencies
+  - @dt-ui/react-core@0.1.0-beta.13
+  - @dt-ui/react-button@0.1.0-beta.3
+  - @dt-ui/react-typography@0.1.0-beta.4
+
+## 0.1.0-beta.22
+
+### Minor Changes
+
+- feat: add button contrast style
+
+### Patch Changes
+
+- Updated dependencies
+  - @dt-ui/react-button@0.1.0-beta.2
+
+## 0.1.0-beta.21
+
+### Patch Changes
+
+- chore: make Button component independent
+- Updated dependencies
+  - @dt-ui/react-button@0.1.0-beta.1
+
+## 0.1.0-beta.20
+
+### Patch Changes
+
+- fix: make icons an optional property in theme
+- Updated dependencies
+  - @dt-ui/react-core@0.1.0-beta.12
+  - @dt-ui/react-typography@0.1.0-beta.3
+
+## 0.1.0-beta.19
+
+### Patch Changes
+
+- refactor: extract text-field to new package with greenlane theme
+- Updated dependencies
+  - @dt-ui/react-core@0.1.0-beta.11
+  - @dt-ui/react-typography@0.1.0-beta.2
+
+## 0.1.0-beta.18
+
+### Patch Changes
+
+- chore: make Typography component independent
+- Updated dependencies
+  - @dt-ui/react-typography@0.1.0-beta.1
+
+## 0.1.0-beta.17
+
+### Patch Changes
+
+- refactor: move and refactor checkbox refactor checkbox according to design
+- Updated dependencies
+  - @dt-ui/react-core@0.1.0-beta.10
+
+## 0.1.0-beta.16
+
+### Patch Changes
+
+- fix(icons): export css and update imports on deps
+- Updated dependencies
+  - @dt-ui/react-core@0.1.0-beta.9
+
+## 0.1.0-beta.15
+
+### Patch Changes
+
+- chore: update component generator and lint fixes
+
+## 0.1.0-beta.14
+
+### Patch Changes
+
+- chore: move util functions to the core
+- Updated dependencies
+  - @dt-ui/react-core@0.1.0-beta.8
+
+## 0.1.0-beta.13
+
+### Minor Changes
+
+- feat: add contextual color add content tertiary to palette
+
+### Patch Changes
+
+- Updated dependencies
+  - @dt-ui/react-core@0.1.0-beta.7
+
+## 0.1.0-beta.12
+
+### Minor Changes
+
+- feat: create Icons package
+- feat: add icons to theme Provider
+
+### Patch Changes
+
+- Updated dependencies
+- Updated dependencies
+  - @dt-ui/react-core@0.1.0-beta.6
+
+## 0.1.0-beta.11
+
+### Minor Changes
+
+- feat: create TruckAPI theme and update default
+
+### Patch Changes
+
+- Updated dependencies
+  - @dt-ui/react-core@0.1.0-beta.5
+
+## 0.1.0-beta.10
+
+### Minor Changes
+
+- feat: update contextual color to follow figma spec
+
+### Patch Changes
+
+- Updated dependencies
+  - @dt-ui/react-core@0.1.0-beta.4
+
+## 0.1.0-beta.9
+
+### Minor Changes
+
+- feat: review Message designs based on designs
+
+### Patch Changes
+
+- fix: move react-core to main dependencies
+- Updated dependencies
+  - @dt-ui/react-core@0.1.0-beta.3
+
+## 0.1.0-beta.8
+
+### Patch Changes
+
+- chore: migrate jest setup file to jest package
+- chore: migrate jest configuration to typescript
+
+## 0.1.0-beta.7
+
+### Patch Changes
+
+- chore: create core package
+
+## 0.1.0-beta.6
+
+### Patch Changes
+
+- refactor: change storybook template names to default
+
+## 0.1.0-beta.5
+
+### Patch Changes
+
+- refactor: update story files
+
+## 0.1.0-beta.4
+
+### Patch Changes
+
+- refactor: update dt-ui to use contextual colors
+
+## 0.1.0-beta.3
+
+### Patch Changes
+
+- fix: update typography sizes and text-trasnform
+- fix: remove isUppercased prop from button
+
+## 0.1.0-beta.2
+
+### Patch Changes
+
+- refactor: add style and dataTestId props to EmptyState
+
+## 0.1.0-beta.1
+
+### Patch Changes
+
+- chore: make empty-state an independent package

package/LICENSE.md

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2025 Daimler Truck AG.
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,90 @@
+# EmptyState Package
+
+This package fills the width of the container where is placed and its height varies depending on the content in it.
+The usage of this package is to show a message to the user when there is no data to display.
+Furthermore, it can be used to show additional information like a button, a link or an image as children.
+
+## Usage
+
+```jsx
+import { EmptyState } from '@dt-dds/react';
+
+export const App = () => {
+  const title = 'Some Title';
+  const description = 'Some Description';
+
+  return (
+    <EmptyState>
+      <img />
+      <EmptyState.Content title={title} description={description} />
+      <Button onClick={() => {}} variant='solid'>
+        Action
+      </Button>
+    </EmptyState>
+  );
+};
+```
+
+## API
+
+### EmptyState
+
+| Property     | Type                  | Default         | Description                                       |
+| ------------ | --------------------- | --------------- | ------------------------------------------------- |
+| `children`   | `ReactNode`           | -               | Child components to be rendered.                  |
+| `dataTestId` | `string`              | `'empty-state'` | Customizable test identifier.                     |
+| `style`      | `React.CSSProperties` | -               | Gives the EmptyState some specific css properties |
+
+### EmptyState.Content
+
+| Property      | Type                  | Default                 | Description                                                 |
+| ------------- | --------------------- | ----------------------- | ----------------------------------------------------------- |
+| `dataTestId`  | `string`              | `'empty-state-content'` | Customizable test identifier.                               |
+| `style`       | `React.CSSProperties` | -                       | Gives the EmptyState Content some specific css properties   |
+| `title`       | `string`              | -                       | Text to be presented as Title within the Empty State.       |
+| `description` | `string`              | -                       | Text to be presented as Description within the Empty State. |
+
+### Stack
+
+- [TypeScript](https://www.typescriptlang.org/) for static type checking
+- [React](https://reactjs.org/) — JavaScript library for user interfaces
+- [Emotion](https://emotion.sh/docs/introduction) — for writing css styles with JavaScript
+- [Storybook](https://storybook.js.org/) — UI component environment powered by Vite
+- [Jest](https://jestjs.io/) - JavaScript Testing Framework
+- [React Testing Library](https://testing-library.com/) - to test UI components in a user-centric way
+- [ESLint](https://eslint.org/) for code linting
+- [Prettier](https://prettier.io) for code formatting
+- [Tsup](https://github.com/egoist/tsup) — TypeScript bundler powered by esbuild
+- [Yarn](https://yarnpkg.com/) from managing packages
+
+### Commands
+
+- `yarn build` - Build the package
+- `yarn dev` - Run the package locally
+- `yarn lint` - Lint all files within this package
+- `yarn test` - Run all unit tests
+- `yarn test:report` - Open the test coverage report
+- `yarn test:update:snapshot` - Run all unit tests and update the snapshot
+
+### Compilation
+
+Running `yarn build` from the root of the package will use [tsup](https://tsup.egoist.dev/) to compile the raw TypeScript and React code to plain JavaScript.
+
+The `/dist` folder contains the compiled output.
+
+```bash
+empty-state
+└── dist
+    ├── index.d.ts  <-- Types
+    ├── index.js    <-- CommonJS version
+    └── index.mjs   <-- ES Modules version
+    ...
+```
+
+### Versioning
+
+Follows [semantic versioning](https://semver.org/)
+
+## &copy; License
+
+Licensed under [MIT License](LICENSE.md)

package/dist/index.d.ts

@@ -0,0 +1,18 @@
+import { BaseProps, Theme } from '@dt-dds/react-core';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+
+interface EmptyStateContentProps extends Omit<BaseProps, 'children'> {
+    title: string;
+    description: string;
+}
+declare const EmptyState: {
+    ({ children, dataTestId, style }: BaseProps): react_jsx_runtime.JSX.Element;
+    Content({ dataTestId, style, title, description, }: EmptyStateContentProps): react_jsx_runtime.JSX.Element;
+};
+
+declare module '@emotion/react' {
+    interface Theme extends Theme {
+    }
+}
+
+export { EmptyState, EmptyStateContentProps };

package/dist/index.js

@@ -0,0 +1,100 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// index.ts
+var empty_state_exports = {};
+__export(empty_state_exports, {
+  EmptyState: () => EmptyState
+});
+module.exports = __toCommonJS(empty_state_exports);
+
+// src/EmptyState.tsx
+var import_react_typography = require("@dt-dds/react-typography");
+
+// src/EmptyState.styled.ts
+var import_styled = __toESM(require("@emotion/styled"));
+var EmptyStateStyled = import_styled.default.div`
+  ${({ theme }) => `
+    padding: ${theme.spacing.l} ${theme.spacing.s};
+    background-color: ${theme.palette.surface.light};
+    flex-direction: column;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    border-radius: ${theme.shape.emptyState};
+    border: 1px dashed ${theme.palette.border.default};
+    width: 100%;
+    height: 100%;
+    gap: ${theme.spacing.xs};
+    
+    @media only screen and (min-width: ${theme.breakpoints.s}px) {
+      padding: ${theme.spacing["2xl"]} ${theme.spacing["5xl"]};
+    }
+  `}
+`;
+var EmptyStateContentStyled = import_styled.default.div`
+  flex-direction: column;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  text-align: center;
+  ${({ theme }) => `
+      gap: ${theme.spacing["4xs"]};
+
+      @media only screen and (min-width: ${theme.breakpoints.s}px) {
+        gap: ${theme.spacing["3xs"]};
+      }
+  `}
+`;
+
+// src/EmptyState.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
+var EmptyState = ({ children, dataTestId, style }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(EmptyStateStyled, { "data-testid": dataTestId != null ? dataTestId : "empty-state", style, children });
+EmptyState.Content = ({
+  dataTestId,
+  style,
+  title,
+  description
+}) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+    EmptyStateContentStyled,
+    {
+      "data-testid": dataTestId != null ? dataTestId : "empty-state-content",
+      style,
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_typography.Typography, { color: "content.dark", element: "h2", fontStyles: "h4", children: title }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_typography.Typography, { color: "content.default", fontStyles: "body1", children: description })
+      ]
+    }
+  );
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  EmptyState
+});

package/dist/index.mjs

@@ -0,0 +1,63 @@
+// src/EmptyState.tsx
+import { Typography } from "@dt-dds/react-typography";
+
+// src/EmptyState.styled.ts
+import styled from "@emotion/styled";
+var EmptyStateStyled = styled.div`
+  ${({ theme }) => `
+    padding: ${theme.spacing.l} ${theme.spacing.s};
+    background-color: ${theme.palette.surface.light};
+    flex-direction: column;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    border-radius: ${theme.shape.emptyState};
+    border: 1px dashed ${theme.palette.border.default};
+    width: 100%;
+    height: 100%;
+    gap: ${theme.spacing.xs};
+    
+    @media only screen and (min-width: ${theme.breakpoints.s}px) {
+      padding: ${theme.spacing["2xl"]} ${theme.spacing["5xl"]};
+    }
+  `}
+`;
+var EmptyStateContentStyled = styled.div`
+  flex-direction: column;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  text-align: center;
+  ${({ theme }) => `
+      gap: ${theme.spacing["4xs"]};
+
+      @media only screen and (min-width: ${theme.breakpoints.s}px) {
+        gap: ${theme.spacing["3xs"]};
+      }
+  `}
+`;
+
+// src/EmptyState.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+var EmptyState = ({ children, dataTestId, style }) => /* @__PURE__ */ jsx(EmptyStateStyled, { "data-testid": dataTestId != null ? dataTestId : "empty-state", style, children });
+EmptyState.Content = ({
+  dataTestId,
+  style,
+  title,
+  description
+}) => {
+  return /* @__PURE__ */ jsxs(
+    EmptyStateContentStyled,
+    {
+      "data-testid": dataTestId != null ? dataTestId : "empty-state-content",
+      style,
+      children: [
+        /* @__PURE__ */ jsx(Typography, { color: "content.dark", element: "h2", fontStyles: "h4", children: title }),
+        /* @__PURE__ */ jsx(Typography, { color: "content.default", fontStyles: "body1", children: description })
+      ]
+    }
+  );
+};
+export {
+  EmptyState
+};

package/package.json

@@ -0,0 +1,56 @@
+{
+  "name": "@dt-dds/react-empty-state",
+  "version": "1.0.0-beta.58",
+  "license": "MIT",
+  "exports": {
+    ".": "./dist/index.js"
+  },
+  "main": "./dist/index.js",
+  "module": "./dist/index.mjs",
+  "types": "./dist/index.d.ts",
+  "files": [
+    "dist/**"
+  ],
+  "scripts": {
+    "build": "tsup",
+    "dev": "tsup --watch",
+    "lint": "eslint --cache .",
+    "test": "jest",
+    "test:report": "open ./jest-coverage/lcov-report/index.html",
+    "test:update:snapshot": "jest -u"
+  },
+  "dependencies": {
+    "@dt-dds/react-button": "1.0.0-beta.38",
+    "@dt-dds/react-core": "1.0.0-beta.41",
+    "@dt-dds/react-typography": "1.0.0-beta.32"
+  },
+  "devDependencies": {
+    "@babel/core": "^7.22.9",
+    "@babel/preset-env": "^7.22.9",
+    "@babel/preset-react": "^7.22.5",
+    "@babel/preset-typescript": "^7.23.3",
+    "@emotion/babel-plugin": "^11.11.0",
+    "@emotion/css": "^11.7.1",
+    "@emotion/jest": "^11.10.0",
+    "@emotion/react": "^11.8.2",
+    "@emotion/styled": "^11.8.1",
+    "@types/react": "^18.0.9",
+    "@types/react-dom": "^18.0.4",
+    "babel-loader": "^8.3.0",
+    "eslint-config-custom": "*",
+    "eslint-plugin-storybook": "^9.1.0",
+    "jest-config": "*",
+    "react": "^18.1.0",
+    "react-dom": "^18.2.0",
+    "tsconfig": "*",
+    "tsup": "^6.6.3",
+    "typescript": "^4.5.3"
+  },
+  "peerDependencies": {
+    "@emotion/css": "^11.7.1",
+    "@emotion/react": "^11.8.2",
+    "@emotion/styled": "^11.8.1",
+    "react": ">=17.0.2",
+    "react-dom": ">=17.0.2"
+  }
+}