@openremote/or-vaadin-components 1.30.0 → 1.30.1

package/stories/or-vaadin-dialog.stories.ts

@@ -1,129 +0,0 @@
-/*
- * Copyright 2026, OpenRemote Inc.
- *
- * This program is free software: you can redistribute it and/or modify
- * it under the terms of the GNU Affero General Public License as
- * published by the Free Software Foundation, either version 3 of the
- * License, or (at your option) any later version.
- *
- * This program is distributed in the hope that it will be useful,
- * but WITHOUT ANY WARRANTY; without even the implied warranty of
- * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
- * GNU Affero General Public License for more details.
- *
- * You should have received a copy of the GNU Affero General Public License
- * along with this program. If not, see <https://www.gnu.org/licenses/>.
- *
- * SPDX-License-Identifier: AGPL-3.0-or-later
- */
-import { setCustomElementsManifest, type Meta, type StoryObj } from "@storybook/web-components";
-import { getORStorybookHelpers } from "../../storybook-utils";
-import customElements from "../custom-elements.json" with { type: "json" };
-import packageJson from "../package.json" with { type: "json" };
-import { html } from "lit";
-import {
-  dialogFooterRenderer,
-  dialogHeaderRenderer,
-  dialogRenderer,
-  type OrVaadinDialog,
-} from "../src/or-vaadin-dialog";
-import manager from "@openremote/core";
-import "../src/or-vaadin-button";
-import "../src/or-vaadin-dialog";
-import "../src/or-vaadin-number-field";
-import "@openremote/or-map";
-
-const tagName = "or-vaadin-dialog";
-type Story = StoryObj;
-setCustomElementsManifest(customElements);
-
-const { events, args, argTypes, template } = getORStorybookHelpers(tagName);
-
-const meta: Meta = {
-  title: "Playground/or-vaadin-components/dialog",
-  component: tagName,
-  args,
-  argTypes,
-  render: (storyArgs) => template(storyArgs),
-  excludeStories: /^[a-z].*/,
-  parameters: {
-    actions: {
-      handles: events,
-    },
-    docs: {
-      subtitle: `<${tagName}>`,
-      description:
-        "Dialog is a small window that can be used to present information and user interface elements in an overlay.",
-    },
-  },
-};
-
-export const Primary: Story = {
-  render: (_args) => {
-    return html`
-      <or-vaadin-dialog ${dialogHeaderRenderer(() => html`<h2>Dialog title</h2>`)}>
-        <p>Content</p>
-      </or-vaadin-dialog>
-      <or-vaadin-button @click="${() => (document.querySelector("or-vaadin-dialog") as OrVaadinDialog).open()}"
-        >Show dialog</or-vaadin-button
-      >
-    `;
-  },
-  parameters: {
-    docs: {
-      story: {
-        height: "360px",
-      },
-    },
-  },
-};
-
-export const MapExample: Story = {
-  render: (_args) => {
-    const footer = () => html`
-      <or-vaadin-button theme="tertiary">Cancel</or-vaadin-button>
-      <or-vaadin-button theme="primary">Save</or-vaadin-button>
-    `;
-    return html`
-      <or-vaadin-dialog header-title="Configure area" ${dialogFooterRenderer(footer)}>
-        <or-map style="aspect-ratio: 1/1;"></or-map>
-        <or-vaadin-number-field label="Radius (min. 100m)" min="100" value="100"></or-vaadin-number-field>
-      </or-vaadin-dialog>
-      <or-vaadin-button @click="${() => (document.querySelector("or-vaadin-dialog") as OrVaadinDialog).open()}"
-        >Show dialog</or-vaadin-button
-      >
-    `;
-  },
-  parameters: {
-    docs: {
-      story: {
-        height: "640px",
-      },
-    },
-  },
-  loaders: [
-    async (storyArgs) => ({
-      orManager: await loadOrManager(),
-    }),
-  ],
-};
-
-export const examples: Story[] = [MapExample];
-
-export { customElements, packageJson };
-
-/* ------------------------------------------------------- */
-/*                   UTILITY FUNCTIONS                     */
-/* ------------------------------------------------------- */
-
-async function loadOrManager() {
-  if (await manager.init({ managerUrl: "http://127.0.0.1:8080", realm: "smartcity" })) {
-    if (!manager.authenticated) {
-      manager.login();
-    }
-    return manager;
-  }
-  throw new Error("Manager could not be initialized");
-}
-
-export default meta;

package/stories/or-vaadin-list-box.stories.ts

@@ -1,67 +0,0 @@
-/*
- * Copyright 2026, OpenRemote Inc.
- *
- * This program is free software: you can redistribute it and/or modify
- * it under the terms of the GNU Affero General Public License as
- * published by the Free Software Foundation, either version 3 of the
- * License, or (at your option) any later version.
- *
- * This program is distributed in the hope that it will be useful,
- * but WITHOUT ANY WARRANTY; without even the implied warranty of
- * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
- * GNU Affero General Public License for more details.
- *
- * You should have received a copy of the GNU Affero General Public License
- * along with this program. If not, see <https://www.gnu.org/licenses/>.
- *
- * SPDX-License-Identifier: AGPL-3.0-or-later
- */
-import { setCustomElementsManifest, type Meta, type StoryObj } from "@storybook/web-components";
-import { getORStorybookHelpers } from "../../storybook-utils";
-import customElements from "../custom-elements.json" with { type: "json" };
-import packageJson from "../package.json" with { type: "json" };
-import "../src/or-vaadin-list-box";
-import "../src/or-vaadin-item";
-import { html } from "lit";
-
-const tagName = "or-vaadin-list-box";
-type Story = StoryObj;
-setCustomElementsManifest(customElements);
-
-const { events, args, argTypes, template } = getORStorybookHelpers(tagName);
-
-const meta: Meta = {
-  title: "Playground/or-vaadin-components/list-box",
-  component: tagName,
-  args,
-  argTypes,
-  render: (storyArgs) => template(storyArgs),
-  excludeStories: /^[a-z].*/,
-  parameters: {
-    actions: {
-      handles: events,
-    },
-    docs: {
-      subtitle: `<${tagName}>`,
-      description: "List Box allows the user to select one or more values from a scrollable list of items.",
-    },
-  },
-};
-
-export const Primary: Story = {
-  render: (args) =>
-    template(
-      args,
-      html`
-        <or-vaadin-item>Item 1</or-vaadin-item>
-        <or-vaadin-item>Item 2</or-vaadin-item>
-        <or-vaadin-item>Item 3</or-vaadin-item>
-      `
-    ),
-};
-
-export const examples: Story[] = [];
-
-export { customElements, packageJson };
-
-export default meta;

package/stories/or-vaadin-number-field.stories.ts

@@ -1,60 +0,0 @@
-/*
- * Copyright 2026, OpenRemote Inc.
- *
- * This program is free software: you can redistribute it and/or modify
- * it under the terms of the GNU Affero General Public License as
- * published by the Free Software Foundation, either version 3 of the
- * License, or (at your option) any later version.
- *
- * This program is distributed in the hope that it will be useful,
- * but WITHOUT ANY WARRANTY; without even the implied warranty of
- * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
- * GNU Affero General Public License for more details.
- *
- * You should have received a copy of the GNU Affero General Public License
- * along with this program. If not, see <https://www.gnu.org/licenses/>.
- *
- * SPDX-License-Identifier: AGPL-3.0-or-later
- */
-import { setCustomElementsManifest, type Meta, type StoryObj } from "@storybook/web-components";
-import { getORStorybookHelpers } from "../../storybook-utils";
-import customElements from "../custom-elements.json" with { type: "json" };
-import packageJson from "../package.json" with { type: "json" };
-import "../src/or-vaadin-number-field";
-
-const tagName = "or-vaadin-number-field";
-type Story = StoryObj;
-setCustomElementsManifest(customElements);
-
-const { events, args, argTypes, template } = getORStorybookHelpers(tagName);
-
-const meta: Meta = {
-  title: "Playground/or-vaadin-components/number-field",
-  component: tagName,
-  args,
-  argTypes,
-  render: (storyArgs) => template(storyArgs),
-  excludeStories: /^[a-z].*/,
-  parameters: {
-    actions: {
-      handles: events,
-    },
-    docs: {
-      subtitle: `<${tagName}>`,
-      description:
-        "Number Field is an input field that accepts only numeric input. The input can be a decimal or an integer.",
-    },
-  },
-};
-
-export const Primary: Story = {
-  args: {
-    value: 100,
-  },
-};
-
-export const examples: Story[] = [];
-
-export { customElements, packageJson };
-
-export default meta;

package/stories/or-vaadin-select.stories.ts

@@ -1,56 +0,0 @@
-/*
- * Copyright 2026, OpenRemote Inc.
- *
- * This program is free software: you can redistribute it and/or modify
- * it under the terms of the GNU Affero General Public License as
- * published by the Free Software Foundation, either version 3 of the
- * License, or (at your option) any later version.
- *
- * This program is distributed in the hope that it will be useful,
- * but WITHOUT ANY WARRANTY; without even the implied warranty of
- * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
- * GNU Affero General Public License for more details.
- *
- * You should have received a copy of the GNU Affero General Public License
- * along with this program. If not, see <https://www.gnu.org/licenses/>.
- *
- * SPDX-License-Identifier: AGPL-3.0-or-later
- */
-import { setCustomElementsManifest, type Meta, type StoryObj } from "@storybook/web-components";
-import { getORStorybookHelpers } from "../../storybook-utils";
-import customElements from "../custom-elements.json" with { type: "json" };
-import packageJson from "../package.json" with { type: "json" };
-import { html } from "lit";
-import "../src/or-vaadin-select";
-
-const tagName = "or-vaadin-select";
-type Story = StoryObj;
-setCustomElementsManifest(customElements);
-
-const { events, args, argTypes, template } = getORStorybookHelpers(tagName);
-
-const meta: Meta = {
-  title: "Playground/or-vaadin-components/select",
-  component: tagName,
-  args,
-  argTypes,
-  render: (storyArgs) => template(storyArgs),
-  excludeStories: /^[a-z].*/,
-  parameters: {
-    actions: {
-      handles: events,
-    },
-    docs: {
-      subtitle: `<${tagName}>`,
-      description: "A select allows users to choose a single value from a list of options presented in an overlay.",
-    },
-  },
-};
-
-export const Primary: Story = {
-  render: (args) => template(args, html`<span slot="label">Select your option</span>`),
-};
-
-export { customElements, packageJson };
-
-export default meta;

package/stories/or-vaadin-text-area.stories.ts

@@ -1,108 +0,0 @@
-/*
- * Copyright 2026, OpenRemote Inc.
- *
- * This program is free software: you can redistribute it and/or modify
- * it under the terms of the GNU Affero General Public License as
- * published by the Free Software Foundation, either version 3 of the
- * License, or (at your option) any later version.
- *
- * This program is distributed in the hope that it will be useful,
- * but WITHOUT ANY WARRANTY; without even the implied warranty of
- * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
- * GNU Affero General Public License for more details.
- *
- * You should have received a copy of the GNU Affero General Public License
- * along with this program. If not, see <https://www.gnu.org/licenses/>.
- *
- * SPDX-License-Identifier: AGPL-3.0-or-later
- */
-import { setCustomElementsManifest, type Meta, type StoryObj } from "@storybook/web-components";
-import { getORStorybookHelpers } from "../../storybook-utils";
-import customElements from "../custom-elements.json" with { type: "json" };
-import packageJson from "../package.json" with { type: "json" };
-import "../src/or-vaadin-text-area";
-
-const tagName = "or-vaadin-text-area";
-type Story = StoryObj;
-setCustomElementsManifest(customElements);
-
-const { events, args, argTypes, template } = getORStorybookHelpers(tagName);
-
-const meta: Meta = {
-  title: "Playground/or-vaadin-components/text-area",
-  component: tagName,
-  args,
-  argTypes,
-  render: (storyArgs) => template(storyArgs),
-  excludeStories: /^[a-z].*/,
-  parameters: {
-    actions: {
-      handles: events,
-    },
-    docs: {
-      subtitle: `<${tagName}>`,
-      description:
-        "Text Area is a multi-line text input. By default it automatically resizes with its content, bounded by `min-rows`/`max-rows`; set `manualresize` for a fixed height (starting at `min-rows`) with a native resize handle.",
-    },
-  },
-};
-
-// Default: automatically resizes with the content.
-export const Primary: Story = {
-  args: {
-    label: "Notes",
-    value: "OpenRemote",
-  },
-  parameters: {
-    docs: {
-      story: {
-        height: "120px",
-      },
-    },
-  },
-};
-
-// Fixed height with a native vertical resize handle; overflow scrolls until dragged.
-export const ManualResize: Story = {
-  parameters: {
-    title: "Manual resizing",
-    summary:
-      "With `manualresize` the field starts at `min-rows`, keeps a fixed height, and shows the native resize handle. Overflowing content scrolls until the handle is dragged.",
-    docs: {
-      story: {
-        height: "180px",
-      },
-    },
-  },
-  args: {
-    label: "Notes",
-    minRows: 5,
-    manualresize: true,
-    value: "one\ntwo\nthree\nfour\nfive\nsix\nseven\neight",
-  },
-};
-
-// Automatic resizing constrained to a number of rows.
-export const BoundedAutoresize: Story = {
-  parameters: {
-    title: "Bounded automatic resizing",
-    summary:
-      "`min-rows` and `max-rows` bound the automatic resizing: the field starts at `min-rows` and grows with the content until `max-rows`, after which it scrolls.",
-    docs: {
-      story: {
-        height: "140px",
-      },
-    },
-  },
-  args: {
-    label: "Notes",
-    minRows: 2,
-    maxRows: 6,
-  },
-};
-
-export const examples: Story[] = [ManualResize, BoundedAutoresize];
-
-export { customElements, packageJson };
-
-export default meta;

package/stories/or-vaadin-text-field.stories.ts

@@ -1,61 +0,0 @@
-/*
- * Copyright 2026, OpenRemote Inc.
- *
- * This program is free software: you can redistribute it and/or modify
- * it under the terms of the GNU Affero General Public License as
- * published by the Free Software Foundation, either version 3 of the
- * License, or (at your option) any later version.
- *
- * This program is distributed in the hope that it will be useful,
- * but WITHOUT ANY WARRANTY; without even the implied warranty of
- * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
- * GNU Affero General Public License for more details.
- *
- * You should have received a copy of the GNU Affero General Public License
- * along with this program. If not, see <https://www.gnu.org/licenses/>.
- *
- * SPDX-License-Identifier: AGPL-3.0-or-later
- */
-import { setCustomElementsManifest, type Meta, type StoryObj } from "@storybook/web-components";
-import { getORStorybookHelpers } from "../../storybook-utils";
-import customElements from "../custom-elements.json" with { type: "json" };
-import packageJson from "../package.json" with { type: "json" };
-import "../src/or-vaadin-text-field";
-
-const tagName = "or-vaadin-text-field";
-type Story = StoryObj;
-setCustomElementsManifest(customElements);
-
-const { events, args, argTypes, template } = getORStorybookHelpers(tagName);
-
-const meta: Meta = {
-  title: "Playground/or-vaadin-components/text-field",
-  component: tagName,
-  args,
-  argTypes,
-  render: (storyArgs) => template(storyArgs),
-  excludeStories: /^[a-z].*/,
-  parameters: {
-    actions: {
-      handles: events,
-    },
-    docs: {
-      subtitle: `<${tagName}>`,
-      description:
-        "Text Field allows users to enter text. Prefix and suffix components, such as icons, are also supported.",
-    },
-  },
-};
-
-export const Primary: Story = {
-  args: {
-    label: "Organization",
-    value: "OpenRemote",
-  },
-};
-
-export const examples: Story[] = [];
-
-export { customElements, packageJson };
-
-export default meta;

package/stories/or-vaadin-toggle.stories.ts

@@ -1,145 +0,0 @@
-/*
- * Copyright 2026, OpenRemote Inc.
- *
- * This program is free software: you can redistribute it and/or modify
- * it under the terms of the GNU Affero General Public License as
- * published by the Free Software Foundation, either version 3 of the
- * License, or (at your option) any later version.
- *
- * This program is distributed in the hope that it will be useful,
- * but WITHOUT ANY WARRANTY; without even the implied warranty of
- * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
- * GNU Affero General Public License for more details.
- *
- * You should have received a copy of the GNU Affero General Public License
- * along with this program. If not, see <https://www.gnu.org/licenses/>.
- *
- * SPDX-License-Identifier: AGPL-3.0-or-later
- */
-import { setCustomElementsManifest, type Meta, type StoryObj } from "@storybook/web-components";
-import { getORStorybookHelpers } from "../../storybook-utils";
-import customElements from "../custom-elements.json" with { type: "json" };
-import packageJson from "../package.json" with { type: "json" };
-import { html } from "lit";
-import "../src/or-vaadin-toggle";
-import "../src/or-vaadin-toggle-group";
-
-const tagName = "or-vaadin-toggle";
-type Story = StoryObj;
-setCustomElementsManifest(customElements);
-
-const { events, args, argTypes, template } = getORStorybookHelpers(tagName);
-
-const meta: Meta = {
-  title: "Playground/or-vaadin-components/toggle",
-  component: tagName,
-  args,
-  argTypes,
-  render: (storyArgs) => template(storyArgs),
-  excludeStories: /^[a-z].*/,
-  parameters: {
-    actions: {
-      handles: events,
-    },
-    docs: {
-      subtitle: `<${tagName}>`,
-      description:
-        "Toggle is an input field representing a binary on/off choice. It reuses the Vaadin checkbox as its base, so it supports the same states (checked, disabled, readonly, required) and events (`change`, `checked-changed`), while being exposed to assistive technology as a switch.",
-    },
-  },
-};
-
-export const Primary: Story = {
-  args: {
-    label: "Toggle",
-    checked: true,
-  },
-};
-
-/** Disabled and readonly toggles, in both the off and on state. */
-export const DisabledReadonly: Story = {
-  name: "Disabled & Readonly",
-  parameters: {
-    title: "Disabled & Readonly",
-    summary:
-      "Use `disabled` to block interaction entirely and `readonly` to show a value that cannot be edited. Both combine with `checked`.",
-    docs: {
-      story: {
-        height: "130px",
-      },
-    },
-  },
-  render: () => html`
-    <div style="display: grid; grid-template-columns: repeat(2, max-content); gap: 24px 64px; padding: 8px;">
-      <or-vaadin-toggle label="Disabled, off" disabled></or-vaadin-toggle>
-      <or-vaadin-toggle label="Disabled, on" checked disabled></or-vaadin-toggle>
-      <or-vaadin-toggle label="Readonly, off" readonly></or-vaadin-toggle>
-      <or-vaadin-toggle label="Readonly, on" checked readonly></or-vaadin-toggle>
-    </div>
-  `,
-};
-
-/** Several toggles combined inside a toggle group, in both orientations. */
-export const Groups: Story = {
-  name: "Groups",
-  parameters: {
-    title: "Groups",
-    summary:
-      'Multiple toggles can be combined inside an `<or-vaadin-toggle-group>` to share a group label, helper text and validation. Under the theme the group is horizontal by default; use `theme="vertical"` to stack them.',
-    docs: {
-      story: {
-        height: "280px",
-      },
-    },
-  },
-  render: () => html`
-    <div style="display: flex; flex-direction: column; gap: 32px; padding: 8px;">
-      <or-vaadin-toggle-group
-        label="Notifications (vertical)"
-        theme="vertical"
-        helper-text="Choose how you want to be notified"
-      >
-        <or-vaadin-toggle label="Email" value="email" checked></or-vaadin-toggle>
-        <or-vaadin-toggle label="SMS" value="sms"></or-vaadin-toggle>
-        <or-vaadin-toggle label="Push" value="push" checked></or-vaadin-toggle>
-      </or-vaadin-toggle-group>
-
-      <or-vaadin-toggle-group label="Notifications (horizontal)" helper-text="Choose how you want to be notified">
-        <or-vaadin-toggle label="Email" value="email" checked></or-vaadin-toggle>
-        <or-vaadin-toggle label="SMS" value="sms"></or-vaadin-toggle>
-        <or-vaadin-toggle label="Push" value="push" checked></or-vaadin-toggle>
-      </or-vaadin-toggle-group>
-    </div>
-  `,
-};
-
-/** Helper text gives extra context below the toggle. */
-export const HelperText: Story = {
-  name: "Helper text",
-  parameters: {
-    title: "Helper text",
-    summary:
-      "Use `helper-text` to show additional context below the toggle, for example to explain why a choice is `required`.",
-    docs: {
-      story: {
-        height: "110px",
-      },
-    },
-  },
-  render: () => html`
-    <div style="display: grid; grid-template-columns: repeat(2, max-content); gap: 24px 64px; padding: 8px;">
-      <or-vaadin-toggle
-        label="With helper text"
-        checked
-        helper-text="Additional context shown below the toggle"
-      ></or-vaadin-toggle>
-      <or-vaadin-toggle label="Required" required helper-text="This choice is required"></or-vaadin-toggle>
-    </div>
-  `,
-};
-
-export const examples = [DisabledReadonly, Groups, HelperText];
-
-export { customElements, packageJson };
-
-export default meta;