moz-box-group.stories.mjs

Enable keyboard shortcuts

/* This Source Code Form is subject to the terms of the Mozilla Public

 * License, v. 2.0. If a copy of the MPL was not distributed with this

 * file, You can obtain one at http://mozilla.org/MPL/2.0/. */

import { html } from "../vendor/lit.all.mjs";

import "./moz-box-group.mjs";

export default {

  title: "UI Widgets/Box Group",

  component: "moz-box-group",

  parameters: {

    status: "in-development",

    fluent: `

moz-box-item =

  .label = I'm a box item

  .description = I'm part of a group

moz-box-button-1 =

  .label = I'm a box button in a group

moz-box-button-2 =

  .label = I'm another box button in a group

moz-box-link =

  .label = I'm a box link in a group

`,

},

};

const Template = () => html`

  <moz-box-group>

    <moz-box-item data-l10n-id="moz-box-item"></moz-box-item>

    <moz-box-link data-l10n-id="moz-box-link"></moz-box-link>

    <moz-box-button data-l10n-id="moz-box-button-1"></moz-box-button>

    <moz-box-button data-l10n-id="moz-box-button-2"></moz-box-button>

  </moz-box-group>

`;

export const Default = Template.bind({});

Default.args = {

  variant: "default",

};