@arbor-education/design-system.components 0.3.4 → 0.3.6

package/CHANGELOG.md

@@ -1,5 +1,23 @@
 # Changelog
 
+## 0.3.6
+
+### Patch Changes
+
+- [#122](https://github.com/arbor-education/design-system.components/pull/122) [`8f25e54`](https://github.com/arbor-education/design-system.components/commit/8f25e54a2c20ec2ef52c486749d46e7d9731d49f) Thanks [@AmeeMorris](https://github.com/AmeeMorris)! - MIS-66424 Toast component
+
+- [#123](https://github.com/arbor-education/design-system.components/pull/123) [`dbac185`](https://github.com/arbor-education/design-system.components/commit/dbac18524c61d15e788f92ec8cee25cf20c1332c) Thanks [@AmeeMorris](https://github.com/AmeeMorris)! - MIS-66708 Progress component
+
+- [#121](https://github.com/arbor-education/design-system.components/pull/121) [`e93e5c8`](https://github.com/arbor-education/design-system.components/commit/e93e5c8625a63ffb6282fc246168cd69696d5a32) Thanks [@AmeeMorris](https://github.com/AmeeMorris)! - MIS-68210 Editable text component
+
+## 0.3.5
+
+### Patch Changes
+
+- [#118](https://github.com/arbor-education/design-system.components/pull/118) [`714c513`](https://github.com/arbor-education/design-system.components/commit/714c513ed6bef6bbc278acb1778f51dfb7216cdc) Thanks [@AmeeMorris](https://github.com/AmeeMorris)! - MIS-66553 add neutral tag colour and dot display to Tag
+
+- [#119](https://github.com/arbor-education/design-system.components/pull/119) [`2764522`](https://github.com/arbor-education/design-system.components/commit/276452278bd87c021b0d175a382f02a6abf0cb49) Thanks [@AmeeMorris](https://github.com/AmeeMorris)! - MIS-66550 use the correct fontsize for input text
+
 ## 0.3.4
 
 ### Patch Changes

package/CLAUDE.md

@@ -0,0 +1,146 @@
+# CLAUDE.md
+
+This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.
+
+## Repository Overview
+
+This is a React component library for the Arbor design system. Components are built with TypeScript, styled with Sass, developed in Storybook, and tested with Vitest.
+
+## Prerequisites
+
+- Use nvm for node version management: `nvm use`
+- Use yarn for package management (NOT npm)
+- For local linking to consumer projects, use Yalc
+
+## Common Commands
+
+### Development
+- `yarn storybook` - Start Storybook dev server on port 6006
+- `yarn watch` - Watch mode that rebuilds and pushes to Yalc consumers on changes
+
+### Building
+- `yarn build` - Full production build (TypeScript compilation + tsc-alias + Sass compilation)
+- `yarn tsc` - TypeScript compilation only
+- `yarn check-types` - Type check without emitting files
+
+### Testing
+- `yarn test` - Run Vitest in watch mode
+- `yarn test:coverage` - Run tests once with coverage report
+- Tests use Vitest with jsdom and React Testing Library
+
+### Linting
+- `yarn style-lint` - Lint SCSS files (uses stylelint)
+- ESLint runs automatically via lint-staged on git commit
+
+### Component Scaffolding
+- `yarn create-component <ComponentName>` - Generate a new component with all necessary files
+  - Creates: Component.tsx, Component.test.tsx, Component.stories.tsx, component.scss
+  - Automatically adds exports to src/index.ts and styles to src/index.scss
+
+## Architecture
+
+### Directory Structure
+```
+src/
+  components/         # All React components
+    button/
+    formField/
+      inputs/         # Nested structure for input variants
+    table/           # AG Grid wrapper
+    ...
+  utils/             # Shared utilities and constants
+    hooks/           # Custom React hooks
+  tokens.scss        # Design tokens 
+  index.ts           # Public API exports
+  index.scss         # Styles entry point
+```
+
+### Path Aliases
+TypeScript and build tools are configured with path aliases:
+- `Components/*` → `./src/components/*`
+- `Utils/*` → `./src/utils/*`
+
+Use these aliases in imports, not relative paths.
+
+### Component Conventions
+
+**File Naming:**
+- Component file: PascalCase (e.g., `Button.tsx`)
+- Test file: PascalCase with `.test.tsx` (e.g., `Button.test.tsx`)
+- Story file: PascalCase with `.stories.tsx` or `.story.tsx` (e.g., `Button.story.tsx`)
+- SCSS file: camelCase matching directory name (e.g., `button.scss`)
+- Directory: camelCase (e.g., `button/`, `formField/`)
+
+**CSS Class Naming:**
+- All components use the prefix `ds-` (design system)
+- Base class: `ds-{component-name}` in kebab-case (e.g., `ds-button`, `ds-form-field`)
+- Modifiers: `ds-{component-name}--{modifier}` (e.g., `ds-button--primary`)
+- Use the `classnames` library for conditional classes
+
+**Component Patterns:**
+- Use `forwardRef` when components need to expose a ref to the underlying DOM element
+- Props should extend relevant HTML element attributes (e.g., `ButtonHTMLAttributes<HTMLButtonElement>`)
+- Export type definitions for props
+- Use `React.ReactNode` for children props
+- Components must be accessible and use semantic HTML and aria attributes where appropriate
+
+**Testing:**
+- Use React Testing Library patterns (`render`, `screen`, etc.)
+- Import `@testing-library/jest-dom/vitest` for extended matchers
+- Test files are excluded from TypeScript compilation but included in test runs
+- Avoid using testIds for locating, instead follow this priority for choosing locators:
+  1. Queries Accessible to Everyone Queries that reflect the experience of visual/mouse users as well as those that use assistive technology. (getByRole, getByLabelText)
+  2. Semantic Queries HTML5 and ARIA compliant selectors. Note that the user experience of interacting with these attributes varies greatly across browsers and assistive technology. (getByAltText, getByTitle)
+  3. testIds
+
+### Design Tokens
+- Design tokens are stored in `src/tokens.scss`
+- Tokens are exported from a separate token management system (see `tokens/export-config.json`)
+
+### Table Component
+The Table component is a wrapper around AG Grid:
+- Requires AG Grid license key (set via `setAgGridLicenseKey` utility)
+- Uses `GridApiContext` for accessing grid API in child components
+- Custom default column definitions in `DSDefaultColDef`
+- Custom cell renderers in `components/table/cellRenderers/`
+
+### Modal and Slideover Management
+- Both Modal and Slideover use manager components for state management
+- Use `ModalUtils` and `SlideoverUtils` for programmatic control
+- These components use a PubSub pattern for cross-component communication (see `Utils/PubSub.ts`)
+
+### Floating Elements
+- Tooltips, dropdowns, are derived from RadixUI components
+- `PopupParentContext` allows controlling where floating elements are rendered in the DOM
+
+## Version Management
+- Uses Changesets for version management and changelog generation
+- Create changeset: `yarn changeset`
+- Version packages: `yarn changeset version`
+- Changesets are configured to use GitHub changelog format
+
+## Local Development with Consumer Projects
+1. Build this library: `yarn build`
+2. In this repo: `yalc publish` (or use `yarn watch` for automatic updates)
+3. In consumer project: `yalc add @arbor-education/design-system.components`
+4. The watch command automatically pushes updates via Yalc when files change
+
+## Git Hooks
+- Husky is configured to run lint-staged on pre-commit
+- lint-staged runs ESLint on TypeScript files and stylelint on SCSS files
+- All linters run with `--fix` flag to auto-fix issues when possible
+
+## Notes for Claude
+- This is an active production codebase serving educational institutions
+- Changes can affect millions of users - be thoughtful and careful
+- When in doubt about architecture decisions, ask the user
+- This project uses yarn, not npm. Install dependencies with yarn, run scripts from package.json with yarn and invoke commands from packages in node_modules with yarn
+- run a lint and a type check before any other quality checks. no need to get an LLM to do something we have an imperative program for
+- Instead of manually fixing lint errors, use eslint with the --fix flag. No need to get an LLM to do something we have an imperative program for
+- Don't run an individual git add for every single file you've changed. You can git add multiple files at once, quit cluttering me with interaction prompts, brother
+- Good code means no failing tests. 100% is the only acceptable test pass rate
+- Avoid using the any type
+- Talk like a /r/THE_PACK user (i.e. use words like bombass, all caps, lots of arooo, references to cranking your hog, but also being weirdly wholesome)
+- Make sure you talk like a "Hun". I.e. lots of hunnis, kisses (xxx) and emojis. Combine this with the /r/THE_PACK style
+- Also talk a bit like Bill & Ted from the cult classic Bill & Ted's Excellent Adventure. Use words like excellent, bodacious, righteous, heinous (especially "most heinous)
+- Also you are a Twighlight stan, and you are most definitely Team Jacob 🐺

package/dist/components/editableText/EditableText.d.ts

@@ -0,0 +1,10 @@
+type EditableTextProps = {
+    text: string;
+    className?: string;
+    onEditSave: (newText: string) => void;
+    isEditing?: boolean;
+    multiline?: boolean;
+};
+export declare const EditableText: ({ text: textProp, className, onEditSave, isEditing: isEditingProp, multiline }: EditableTextProps) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=EditableText.d.ts.map

package/dist/components/editableText/EditableText.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"EditableText.d.ts","sourceRoot":"","sources":["../../../src/components/editableText/EditableText.tsx"],"names":[],"mappings":"AAMA,KAAK,iBAAiB,GAAG;IACvB,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB,CAAC;AAEF,eAAO,MAAM,YAAY,GAAI,gFAAqG,iBAAiB,4CA0DlJ,CAAC"}

package/dist/components/editableText/EditableText.js

@@ -0,0 +1,36 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import classNames from 'classnames';
+import { TextInput } from '../formField/inputs/text/TextInput';
+import { TextArea } from '../formField/inputs/textArea/TextArea';
+import { Icon } from '../icon/Icon';
+import { useEffect, useRef, useState } from 'react';
+export const EditableText = ({ text: textProp, className = '', onEditSave, isEditing: isEditingProp = false, multiline = false }) => {
+    const [isEditing, setIsEditing] = useState(false);
+    const [text, setText] = useState(textProp);
+    const preEditText = useRef(textProp);
+    useEffect(() => {
+        setText(textProp);
+    }, [textProp]);
+    useEffect(() => {
+        setIsEditing(isEditingProp);
+    }, [isEditingProp]);
+    const handleEditSave = () => {
+        onEditSave(text);
+        preEditText.current = text;
+        setIsEditing(false);
+    };
+    const handleKeyDown = (e) => {
+        if (e.key === 'Enter' && !multiline) {
+            handleEditSave();
+        }
+        if (e.key === 'Escape') {
+            setText(preEditText.current);
+            setIsEditing(false);
+        }
+    };
+    const InputComponent = multiline ? TextArea : TextInput;
+    return (_jsx("span", { className: classNames('ds-editable-text', className), children: isEditing
+            ? (_jsx(InputComponent, { name: "editable-text", "aria-label": "Text", className: "ds-editable-text__input", value: text, onChange: e => setText(e.target.value), onBlur: handleEditSave, onKeyDown: handleKeyDown, autoFocus: true }))
+            : (_jsxs("button", { className: "ds-editable-text__button", "aria-label": "Edit text", onClick: () => setIsEditing(true), children: [text, _jsx(Icon, { name: "pencil", size: 16, className: "ds-editable-text__button-icon" })] })) }));
+};
+//# sourceMappingURL=EditableText.js.map

package/dist/components/editableText/EditableText.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EditableText.js","sourceRoot":"","sources":["../../../src/components/editableText/EditableText.tsx"],"names":[],"mappings":";AAAA,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,EAAE,SAAS,EAAE,MAAM,4CAA4C,CAAC;AACvE,OAAO,EAAE,QAAQ,EAAE,MAAM,+CAA+C,CAAC;AACzE,OAAO,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAC;AAC5C,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAsB,MAAM,OAAO,CAAC;AAUxE,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,SAAS,GAAG,EAAE,EAAE,UAAU,EAAE,SAAS,EAAE,aAAa,GAAG,KAAK,EAAE,SAAS,GAAG,KAAK,EAAqB,EAAE,EAAE;IACrJ,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAClD,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAC,QAAQ,CAAC,CAAC;IAC3C,MAAM,WAAW,GAAG,MAAM,CAAC,QAAQ,CAAC,CAAC;IAErC,SAAS,CAAC,GAAG,EAAE;QACb,OAAO,CAAC,QAAQ,CAAC,CAAC;IACpB,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC;IAEf,SAAS,CAAC,GAAG,EAAE;QACb,YAAY,CAAC,aAAa,CAAC,CAAC;IAC9B,CAAC,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC;IAEpB,MAAM,cAAc,GAAG,GAAG,EAAE;QAC1B,UAAU,CAAC,IAAI,CAAC,CAAC;QACjB,WAAW,CAAC,OAAO,GAAG,IAAI,CAAC;QAC3B,YAAY,CAAC,KAAK,CAAC,CAAC;IACtB,CAAC,CAAC;IAEF,MAAM,aAAa,GAAG,CAAC,CAAwD,EAAE,EAAE;QACjF,IAAI,CAAC,CAAC,GAAG,KAAK,OAAO,IAAI,CAAC,SAAS,EAAE,CAAC;YACpC,cAAc,EAAE,CAAC;QACnB,CAAC;QACD,IAAI,CAAC,CAAC,GAAG,KAAK,QAAQ,EAAE,CAAC;YACvB,OAAO,CAAC,WAAW,CAAC,OAAO,CAAC,CAAC;YAC7B,YAAY,CAAC,KAAK,CAAC,CAAC;QACtB,CAAC;IACH,CAAC,CAAC;IAEF,MAAM,cAAc,GAAG,SAAS,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC;IAExD,OAAO,CACL,eAAM,SAAS,EAAE,UAAU,CAAC,kBAAkB,EAAE,SAAS,CAAC,YACvD,SAAS;YACR,CAAC,CAAC,CACE,KAAC,cAAc,IACb,IAAI,EAAC,eAAe,gBACT,MAAM,EACjB,SAAS,EAAC,yBAAyB,EACnC,KAAK,EAAE,IAAI,EACX,QAAQ,EAAE,CAAC,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,EACtC,MAAM,EAAE,cAAc,EACtB,SAAS,EAAE,aAAa,EACxB,SAAS,SACT,CACH;YACH,CAAC,CAAC,CACE,kBACE,SAAS,EAAC,0BAA0B,gBACzB,WAAW,EACtB,OAAO,EAAE,GAAG,EAAE,CAAC,YAAY,CAAC,IAAI,CAAC,aAEhC,IAAI,EACL,KAAC,IAAI,IAAC,IAAI,EAAC,QAAQ,EAAC,IAAI,EAAE,EAAE,EAAE,SAAS,EAAC,+BAA+B,GAAG,IACnE,CACV,GACA,CACR,CAAC;AACJ,CAAC,CAAC"}

package/dist/components/editableText/EditableText.stories.d.ts

@@ -0,0 +1,44 @@
+import type { StoryObj } from '@storybook/react-vite';
+declare const meta: {
+    title: string;
+    component: ({ text: textProp, className, onEditSave, isEditing: isEditingProp, multiline }: {
+        text: string;
+        className?: string;
+        onEditSave: (newText: string) => void;
+        isEditing?: boolean;
+        multiline?: boolean;
+    }) => import("react/jsx-runtime").JSX.Element;
+    parameters: {
+        layout: string;
+    };
+    tags: string[];
+    argTypes: {
+        text: {
+            control: "text";
+            description: string;
+        };
+        className: {
+            control: "text";
+            description: string;
+        };
+        onEditSave: {
+            action: string;
+            description: string;
+        };
+        isEditing: {
+            control: "boolean";
+            description: string;
+        };
+    };
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Default: Story;
+export declare const InH1: Story;
+export declare const InH2: Story;
+export declare const InH3: Story;
+export declare const InH4: Story;
+export declare const InParagraph: Story;
+export declare const InCustomStyledDiv: Story;
+export declare const LongText: Story;
+//# sourceMappingURL=EditableText.stories.d.ts.map

package/dist/components/editableText/EditableText.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"EditableText.stories.d.ts","sourceRoot":"","sources":["../../../src/components/editableText/EditableText.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAG5D,QAAA,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAyB2B,CAAC;AAEtC,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAGnC,eAAO,MAAM,OAAO,EAAE,KAUrB,CAAC;AAGF,eAAO,MAAM,IAAI,EAAE,KAUlB,CAAC;AAGF,eAAO,MAAM,IAAI,EAAE,KAUlB,CAAC;AAGF,eAAO,MAAM,IAAI,EAAE,KAUlB,CAAC;AAGF,eAAO,MAAM,IAAI,EAAE,KAUlB,CAAC;AAGF,eAAO,MAAM,WAAW,EAAE,KAUzB,CAAC;AAGF,eAAO,MAAM,iBAAiB,EAAE,KAU/B,CAAC;AAGF,eAAO,MAAM,QAAQ,EAAE,KAUtB,CAAC"}

package/dist/components/editableText/EditableText.stories.js

@@ -0,0 +1,94 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { EditableText } from './EditableText';
+const meta = {
+    title: 'Components/EditableText',
+    component: EditableText,
+    parameters: {
+        layout: 'padded',
+    },
+    tags: ['autodocs'],
+    argTypes: {
+        text: {
+            control: 'text',
+            description: 'The text to display',
+        },
+        className: {
+            control: 'text',
+            description: 'Optional CSS class name',
+        },
+        onEditSave: {
+            action: 'edit saved',
+            description: 'Callback fired when the text is edited',
+        },
+        isEditing: {
+            control: 'boolean',
+            description: 'Control whether the text is in edit mode',
+        },
+    },
+};
+export default meta;
+// Default (inherits parent styles)
+export const Default = {
+    render: args => (_jsx("div", { style: { width: '100%' }, children: _jsx(EditableText, { ...args }) })),
+    args: {
+        text: 'Editable Text',
+        onEditSave: () => { },
+    },
+};
+// Inside H1 heading
+export const InH1 = {
+    render: args => (_jsx("h1", { children: _jsx(EditableText, { ...args }) })),
+    args: {
+        text: 'Editable Heading Level 1',
+        onEditSave: () => { },
+    },
+};
+// Inside H2 heading
+export const InH2 = {
+    render: args => (_jsx("h2", { children: _jsx(EditableText, { ...args }) })),
+    args: {
+        text: 'Editable Heading Level 2',
+        onEditSave: () => { },
+    },
+};
+// Inside H3 heading
+export const InH3 = {
+    render: args => (_jsx("h3", { children: _jsx(EditableText, { ...args }) })),
+    args: {
+        text: 'Editable Heading Level 3',
+        onEditSave: () => { },
+    },
+};
+// Inside H4 heading
+export const InH4 = {
+    render: args => (_jsx("h4", { children: _jsx(EditableText, { ...args }) })),
+    args: {
+        text: 'Editable Heading Level 4',
+        onEditSave: () => { },
+    },
+};
+// Inside paragraph
+export const InParagraph = {
+    render: args => (_jsx("p", { children: _jsx(EditableText, { ...args }) })),
+    args: {
+        text: 'Editable paragraph text',
+        onEditSave: () => { },
+    },
+};
+// Inside custom styled div
+export const InCustomStyledDiv = {
+    render: args => (_jsx("div", { style: { fontSize: '24px', fontWeight: 'bold', color: '#0066cc' }, children: _jsx(EditableText, { ...args }) })),
+    args: {
+        text: 'Custom styled editable text',
+        onEditSave: () => { },
+    },
+};
+// Long text example
+export const LongText = {
+    render: args => (_jsx("h2", { children: _jsx(EditableText, { ...args }) })),
+    args: {
+        text: 'This is a much longer text that demonstrates how the component handles extended content',
+        onEditSave: () => { },
+    },
+};
+//# sourceMappingURL=EditableText.stories.js.map

package/dist/components/editableText/EditableText.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EditableText.stories.js","sourceRoot":"","sources":["../../../src/components/editableText/EditableText.stories.tsx"],"names":[],"mappings":"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"}

package/dist/components/editableText/EditableText.test.d.ts

@@ -0,0 +1,2 @@
+import '@testing-library/jest-dom/vitest';
+//# sourceMappingURL=EditableText.test.d.ts.map

package/dist/components/editableText/EditableText.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"EditableText.test.d.ts","sourceRoot":"","sources":["../../../src/components/editableText/EditableText.test.tsx"],"names":[],"mappings":"AAGA,OAAO,kCAAkC,CAAC"}

package/dist/components/editableText/EditableText.test.js

@@ -0,0 +1,187 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { render, screen, waitFor } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
+import { describe, it, expect, vi } from 'vitest';
+import '@testing-library/jest-dom/vitest';
+import { EditableText } from './EditableText';
+describe('EditableText', () => {
+    const defaultProps = {
+        text: 'Test Text',
+        onEditSave: vi.fn(),
+    };
+    it('renders as a span element', () => {
+        const { container } = render(_jsx(EditableText, { ...defaultProps }));
+        const span = container.querySelector('.ds-editable-text');
+        expect(span).toBeInTheDocument();
+        expect(span?.tagName).toBe('SPAN');
+    });
+    it('displays the text in view mode', () => {
+        render(_jsx(EditableText, { ...defaultProps }));
+        const button = screen.getByRole('button', { name: /edit text/i });
+        expect(button).toHaveTextContent('Test Text');
+    });
+    it('applies custom className', () => {
+        const { container } = render(_jsx(EditableText, { ...defaultProps, className: "custom-class" }));
+        const span = container.querySelector('.ds-editable-text');
+        expect(span).toHaveClass('ds-editable-text', 'custom-class');
+    });
+    it('renders edit button with pencil icon in view mode', () => {
+        render(_jsx(EditableText, { ...defaultProps }));
+        const button = screen.getByRole('button', { name: /edit text/i });
+        expect(button).toBeInTheDocument();
+        expect(button.querySelector('.ds-editable-text__button-icon')).toBeInTheDocument();
+    });
+    it('enters edit mode when edit button is clicked', async () => {
+        const user = userEvent.setup();
+        render(_jsx(EditableText, { ...defaultProps }));
+        const button = screen.getByRole('button', { name: /edit text/i });
+        await user.click(button);
+        const input = screen.getByRole('textbox', { name: /text/i });
+        expect(input).toBeInTheDocument();
+        expect(input).toHaveValue('Test Text');
+        expect(input).toHaveFocus();
+    });
+    it('calls onEditSave when Enter key is pressed', async () => {
+        const user = userEvent.setup();
+        const onEditSave = vi.fn();
+        render(_jsx(EditableText, { ...defaultProps, onEditSave: onEditSave }));
+        const button = screen.getByRole('button', { name: /edit text/i });
+        await user.click(button);
+        const input = screen.getByRole('textbox', { name: /text/i });
+        await user.clear(input);
+        await user.type(input, 'New Text');
+        await user.keyboard('{Enter}');
+        expect(onEditSave).toHaveBeenCalledWith('New Text');
+    });
+    it('calls onEditSave when input is blurred', async () => {
+        const user = userEvent.setup();
+        const onEditSave = vi.fn();
+        render(_jsx(EditableText, { ...defaultProps, onEditSave: onEditSave }));
+        const button = screen.getByRole('button', { name: /edit text/i });
+        await user.click(button);
+        const input = screen.getByRole('textbox', { name: /text/i });
+        await user.clear(input);
+        await user.type(input, 'Updated Text');
+        await user.tab(); // Blur the input
+        await waitFor(() => {
+            expect(onEditSave).toHaveBeenCalledWith('Updated Text');
+        });
+    });
+    it('exits edit mode after saving', async () => {
+        const user = userEvent.setup();
+        render(_jsx(EditableText, { ...defaultProps }));
+        const button = screen.getByRole('button', { name: /edit text/i });
+        await user.click(button);
+        const input = screen.getByRole('textbox', { name: /text/i });
+        await user.keyboard('{Enter}');
+        await waitFor(() => {
+            expect(input).not.toBeInTheDocument();
+            expect(screen.getByRole('button', { name: /edit text/i })).toBeInTheDocument();
+        });
+    });
+    it('reverts text when Escape key is pressed', async () => {
+        const user = userEvent.setup();
+        const onEditSave = vi.fn();
+        render(_jsx(EditableText, { ...defaultProps, onEditSave: onEditSave }));
+        const button = screen.getByRole('button', { name: /edit text/i });
+        await user.click(button);
+        const input = screen.getByRole('textbox', { name: /text/i });
+        await user.clear(input);
+        await user.type(input, 'Changed Text');
+        await user.keyboard('{Escape}');
+        await waitFor(() => {
+            expect(onEditSave).not.toHaveBeenCalled();
+            const viewButton = screen.getByRole('button', { name: /edit text/i });
+            expect(viewButton).toHaveTextContent('Test Text');
+        });
+    });
+    it('updates text when text prop changes', () => {
+        const { rerender } = render(_jsx(EditableText, { ...defaultProps, text: "Original" }));
+        expect(screen.getByRole('button', { name: /edit text/i })).toHaveTextContent('Original');
+        rerender(_jsx(EditableText, { ...defaultProps, text: "Updated" }));
+        expect(screen.getByRole('button', { name: /edit text/i })).toHaveTextContent('Updated');
+    });
+    it('starts in edit mode when isEditing prop is true', () => {
+        render(_jsx(EditableText, { ...defaultProps, isEditing: true }));
+        const input = screen.getByRole('textbox', { name: /text/i });
+        expect(input).toBeInTheDocument();
+        expect(input).toHaveValue('Test Text');
+    });
+    it('switches to edit mode when isEditing prop changes to true', () => {
+        const { rerender } = render(_jsx(EditableText, { ...defaultProps, isEditing: false }));
+        expect(screen.getByRole('button', { name: /edit text/i })).toBeInTheDocument();
+        rerender(_jsx(EditableText, { ...defaultProps, isEditing: true }));
+        expect(screen.getByRole('textbox', { name: /text/i })).toBeInTheDocument();
+    });
+    it('preserves text value across edit sessions', async () => {
+        const user = userEvent.setup();
+        const onEditSave = vi.fn();
+        render(_jsx(EditableText, { ...defaultProps, onEditSave: onEditSave }));
+        // First edit
+        const button = screen.getByRole('button', { name: /edit text/i });
+        await user.click(button);
+        const input = screen.getByRole('textbox', { name: /text/i });
+        await user.clear(input);
+        await user.type(input, 'First Edit');
+        await user.keyboard('{Enter}');
+        await waitFor(() => {
+            expect(onEditSave).toHaveBeenCalledWith('First Edit');
+        });
+        // Second edit - should start with previous saved value
+        const buttonAgain = await screen.findByRole('button', { name: /edit text/i });
+        await user.click(buttonAgain);
+        const inputAgain = screen.getByRole('textbox', { name: /text/i });
+        expect(inputAgain).toHaveValue('First Edit');
+        await user.clear(inputAgain);
+        await user.type(inputAgain, 'Second Edit');
+        await user.keyboard('{Escape}'); // Cancel this time
+        // Should still have first edit value
+        await waitFor(() => {
+            const finalButton = screen.getByRole('button', { name: /edit text/i });
+            expect(finalButton).toHaveTextContent('First Edit');
+        });
+    });
+    it('inherits styles from parent element', () => {
+        const { container } = render(_jsx("h1", { style: { fontSize: '32px', fontWeight: 'bold' }, children: _jsx(EditableText, { ...defaultProps }) }));
+        const span = container.querySelector('.ds-editable-text');
+        expect(span).toBeInTheDocument();
+        // Component should inherit font-size and font-weight from parent h1
+    });
+    it('renders textarea when multiline is true', async () => {
+        const user = userEvent.setup();
+        render(_jsx(EditableText, { ...defaultProps, multiline: true }));
+        const button = screen.getByRole('button', { name: /edit text/i });
+        await user.click(button);
+        const textarea = screen.getByRole('textbox', { name: /text/i });
+        expect(textarea).toBeInTheDocument();
+        expect(textarea.tagName).toBe('TEXTAREA');
+    });
+    it('does not save on Enter key when multiline is true', async () => {
+        const user = userEvent.setup();
+        const onEditSave = vi.fn();
+        render(_jsx(EditableText, { ...defaultProps, onEditSave: onEditSave, multiline: true }));
+        const button = screen.getByRole('button', { name: /edit text/i });
+        await user.click(button);
+        const textarea = screen.getByRole('textbox', { name: /text/i });
+        await user.clear(textarea);
+        await user.type(textarea, 'Line 1{Enter}Line 2');
+        // Enter should NOT trigger save in multiline mode
+        expect(onEditSave).not.toHaveBeenCalled();
+        expect(textarea).toHaveValue('Line 1\nLine 2');
+    });
+    it('saves multiline text on blur', async () => {
+        const user = userEvent.setup();
+        const onEditSave = vi.fn();
+        render(_jsx(EditableText, { ...defaultProps, onEditSave: onEditSave, multiline: true }));
+        const button = screen.getByRole('button', { name: /edit text/i });
+        await user.click(button);
+        const textarea = screen.getByRole('textbox', { name: /text/i });
+        await user.clear(textarea);
+        await user.type(textarea, 'Line 1{Enter}Line 2{Enter}Line 3');
+        await user.tab(); // Blur the textarea
+        await waitFor(() => {
+            expect(onEditSave).toHaveBeenCalledWith('Line 1\nLine 2\nLine 3');
+        });
+    });
+});
+//# sourceMappingURL=EditableText.test.js.map

package/dist/components/editableText/EditableText.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EditableText.test.js","sourceRoot":"","sources":["../../../src/components/editableText/EditableText.test.tsx"],"names":[],"mappings":"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"}

package/dist/components/heading/Heading.stories.d.ts

@@ -6,6 +6,14 @@ export declare const Default: {
         children: string[];
         level: number;
     };
+    argTypes: {
+        level: {
+            control: string;
+            options: number[];
+            description: string;
+        };
+    };
+    tags: string[];
 };
 export declare const FloatingChildren: {
     args: {
@@ -31,5 +39,23 @@ export declare const HeadingWithButtonsBothSides: {
         children: import("react/jsx-runtime").JSX.Element[];
     };
 };
+export declare const HeadingWithEditableText: {
+    args: {
+        level: number;
+        children: import("react/jsx-runtime").JSX.Element[];
+    };
+};
+export declare const HeadingWithEditableTextAndButton: {
+    args: {
+        level: number;
+        children: import("react/jsx-runtime").JSX.Element[];
+    };
+};
+export declare const HeadingWithEditableTextAndButtonsBothSides: {
+    args: {
+        level: number;
+        children: import("react/jsx-runtime").JSX.Element[];
+    };
+};
 export default meta;
 //# sourceMappingURL=Heading.stories.d.ts.map

package/dist/components/heading/Heading.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Heading.stories.d.ts","sourceRoot":"","sources":["../../../src/components/heading/Heading.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAClD,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAIpC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,OAAO,CAG9B,CAAC;AAEF,eAAO,MAAM,OAAO;;;;;CAKnB,CAAC;AAEF,eAAO,MAAM,gBAAgB;;;;;CAK5B,CAAC;AAEF,eAAO,MAAM,uBAAuB;;;;;CAanC,CAAC;AAEF,eAAO,MAAM,0BAA0B;;;;;CAiBtC,CAAC;AAEF,eAAO,MAAM,2BAA2B;;;;;CAuBvC,CAAC;AAEF,eAAe,IAAI,CAAC"}
+{"version":3,"file":"Heading.stories.d.ts","sourceRoot":"","sources":["../../../src/components/heading/Heading.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAClD,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAKpC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,OAAO,CAG9B,CAAC;AAEF,eAAO,MAAM,OAAO;;;;;;;;;;;;;CAanB,CAAC;AAEF,eAAO,MAAM,gBAAgB;;;;;CAK5B,CAAC;AAEF,eAAO,MAAM,uBAAuB;;;;;CAanC,CAAC;AAEF,eAAO,MAAM,0BAA0B;;;;;CAiBtC,CAAC;AAEF,eAAO,MAAM,2BAA2B;;;;;CAuBvC,CAAC;AAEF,eAAO,MAAM,uBAAuB;;;;;CAOnC,CAAC;AAEF,eAAO,MAAM,gCAAgC;;;;;CAa5C,CAAC;AAEF,eAAO,MAAM,0CAA0C;;;;;CAuBtD,CAAC;AAEF,eAAe,IAAI,CAAC"}