@warp-ds/elements 2.3.1 → 2.4.0-next.1

package/dist/packages/deadtoggle/dead-toggle.react.stories.d.ts

@@ -0,0 +1,15 @@
+import React from 'react';
+import { StoryObj } from '@storybook/react';
+import { DeadToggle } from './react';
+declare const _default: {
+    title: string;
+    render(args: Omit<React.HTMLAttributes<import(".").WarpDeadToggle>, "render" | "renderOptions" | "connectedCallback" | "disconnectedCallback" | "renderRoot" | "isUpdatePending" | "hasUpdated" | "addController" | "removeController" | "attributeChangedCallback" | "requestUpdate" | "updateComplete" | "disabled" | "type" | "invalid" | "checked" | "indeterminate" | "indeterminateMarker"> & {} & Partial<Omit<import(".").WarpDeadToggle, keyof HTMLElement>> & React.RefAttributes<import(".").WarpDeadToggle>): React.JSX.Element;
+    component: import("@lit/react").ReactWebComponent<import(".").WarpDeadToggle, {}>;
+};
+export default _default;
+export type Story = StoryObj<typeof DeadToggle>;
+export declare const Radio: Story;
+export declare const Checkbox: Story;
+export declare const Indeterminate: Story;
+export declare const Checked: Story;
+export declare const Invalid: Story;

package/dist/packages/deadtoggle/dead-toggle.react.stories.js

@@ -0,0 +1,34 @@
+import React from 'react';
+import { DeadToggle } from './react';
+export default {
+    title: 'Forms/Dead toggle',
+    render(args) {
+        return React.createElement(DeadToggle, { ...args });
+    },
+    component: DeadToggle,
+};
+export const Radio = {
+    args: {
+        type: 'radio',
+    },
+};
+export const Checkbox = {
+    args: {
+        type: 'checkbox',
+    },
+};
+export const Indeterminate = {
+    args: {
+        indeterminate: true,
+    },
+};
+export const Checked = {
+    args: {
+        checked: true,
+    },
+};
+export const Invalid = {
+    args: {
+        invalid: true,
+    },
+};

package/dist/packages/deadtoggle/dead-toggle.stories.d.ts

@@ -0,0 +1,14 @@
+import type { Meta, StoryObj } from '@storybook/web-components-vite';
+import type { WarpDeadToggle } from './index.js';
+import './index.js';
+declare const args: Partial<WarpDeadToggle> & {
+    [key: string]: any;
+};
+declare const meta: Meta<typeof args>;
+export default meta;
+type Story = StoryObj<typeof args>;
+export declare const Radio: Story;
+export declare const Checkbox: Story;
+export declare const Indeterminate: Story;
+export declare const Checked: Story;
+export declare const Invalid: Story;

package/dist/packages/deadtoggle/dead-toggle.stories.js

@@ -0,0 +1,45 @@
+import { spread } from '@open-wc/lit-helpers';
+import { getStorybookHelpers } from '@wc-toolkit/storybook-helpers';
+import { html } from 'lit';
+import { prespread } from '../../.storybook/utilities.js';
+import './index.js';
+const { events, args, argTypes } = getStorybookHelpers('w-dead-toggle');
+const meta = {
+    title: 'Forms/Dead toggle',
+    render(args) {
+        return html `<w-dead-toggle ${spread(prespread(args))}></w-dead-toggle>`;
+    },
+    args,
+    argTypes,
+    parameters: {
+        actions: {
+            handles: events,
+        },
+    },
+};
+export default meta;
+export const Radio = {
+    args: {
+        type: 'radio',
+    },
+};
+export const Checkbox = {
+    args: {
+        type: 'checkbox',
+    },
+};
+export const Indeterminate = {
+    args: {
+        indeterminate: true,
+    },
+};
+export const Checked = {
+    args: {
+        checked: true,
+    },
+};
+export const Invalid = {
+    args: {
+        invalid: true,
+    },
+};

package/dist/packages/deadtoggle/dead-toggle.test.d.ts

@@ -0,0 +1 @@
+import './index.js';

package/dist/packages/deadtoggle/dead-toggle.test.js

@@ -0,0 +1,9 @@
+import { html } from 'lit';
+import { expect, test } from 'vitest';
+import { render } from 'vitest-browser-lit';
+import './index.js';
+test('renders the dead toggle', async () => {
+    const component = html `<w-dead-toggle data-testid="dead-toggle"></w-dead-toggle>`;
+    const page = render(component);
+    await expect.element(page.getByTestId('dead-toggle')).toBeVisible();
+});

package/dist/packages/deadtoggle/index.d.ts

@@ -0,0 +1,17 @@
+import { CSSResultGroup, LitElement } from 'lit';
+/**
+ * Dead toggle can be used where the appearance of a checkbox or radio is needed - but for accessibility purposes an actual input element should not be present.
+ *
+ * [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/forms-dead-toggle--docs)
+ */
+export declare class WarpDeadToggle extends LitElement {
+    type: 'radio' | 'checkbox';
+    checked: boolean;
+    indeterminate: boolean;
+    invalid: boolean;
+    disabled: boolean;
+    /** @internal */
+    get indeterminateMarker(): "" | "–";
+    render(): import("lit").TemplateResult<1>;
+    static styles?: CSSResultGroup | undefined;
+}