How to use overridePresets method in storybook-root

Best JavaScript code snippet using storybook-root

dynalite-global-settings.ts

Source:dynalite-global-settings.ts

1import { ifDefined } from "lit/directives/if-defined";2import { css, CSSResultGroup, html, TemplateResult } from "lit";3import { customElement, property, queryAll, state } from "lit/decorators";4import type { HomeAssistant, Route } from "../homeassistant-frontend/src/types";5import { haStyle } from "../homeassistant-frontend/src/resources/styles";6import { fireEvent } from "../homeassistant-frontend/src/common/dom/fire_event";7import { navigate } from "../homeassistant-frontend/src/common/navigate";8import {9  CONF_ACTIVE,10  CONF_ACTIVE_INIT,11  CONF_ACTIVE_OFF,12  CONF_ACTIVE_ON,13  CONF_AUTODISCOVER,14  CONF_CHANNEL,15  CONF_CHANNEL_COVER,16  CONF_CLASS,17  CONF_CLOSE,18  CONF_DURATION,19  CONF_FADE,20  CONF_NAME,21  CONF_OPEN,22  CONF_OVERRIDE_PRESETS,23  CONF_OVERRIDE_TEMPLATES,24  CONF_PRESET,25  CONF_ROOM_OFF,26  CONF_ROOM_ON,27  CONF_STOP,28  CONF_TILT,29  CONF_TILT_ENABLED,30  EVENT_CONFIG_CHANGED,31  ROUTE_AREAS,32  TEMPLATE_COVER,33  TEMPLATE_ROOM,34} from "./const";35import {36  Dynalite,37  dynaliteCopy,38  DynaliteDefaultTemplates,39  DynalitePresetData,40  dynaliteRoute,41  DynaliteTemplateData,42  enumeratedTemplates,43  panelTabs,44} from "./common";45import type { DynaliteInput } from "./dynalite-input";46import {47  DynaliteBooleanInput,48  DynaliteDurationInput,49  DynaliteFadeInput,50  DynaliteIdInput,51  DynaliteSelectInput,52  DynaliteTextInput,53} from "./dynalite-input-settings";54import { DynaliteInputElement } from "./dynalite-input-element";55import { showDynaliteSelectGatewayDialog } from "./show-dialog-select-gateway";56import "@material/mwc-button/mwc-button";57import "../homeassistant-frontend/src/layouts/hass-tabs-subpage";58import "../homeassistant-frontend/src/components/ha-card";59import "./dynalite-preset-table";60interface DynaliteGlobalSettingsInput {61  name: string;62  autodiscover: boolean;63  fade: string;64  active: string;65  overridePresets: boolean;66  overrideTemplates: boolean;67  room_on: string;68  room_off: string;69  open: string;70  close: string;71  stop: string;72  channel_cover: string;73  class: string;74  duration: string;75  tiltEnabled: boolean;76  tilt: string;77}78@customElement("dynalite-global-settings")79export class DynaliteGlobalSettings extends DynaliteInputElement<DynaliteGlobalSettingsInput> {80  @property({ attribute: false }) public hass!: HomeAssistant;81  @property({ attribute: false }) public dynalite!: Dynalite;82  @property({ attribute: false }) public route!: Route;83  @property({ attribute: false }) public narrow = false;84  @state() private _hasInitialized = false;85  @state() private _presets: { [key: string]: DynalitePresetData } = {};86  @queryAll("dynalite-input") _inputElements?: DynaliteInput[];87  protected willUpdate(_changedProperties: Map<string | number | symbol, unknown>): void {88    super.willUpdate(_changedProperties);89    if (!this.dynalite) return;90    if (!this._hasInitialized) {91      this.settings.class.selection(this.dynalite.classSelection);92      this.result = {93        name: this.dynalite.config.name || "",94        autodiscover: this.dynalite.config.autodiscover!,95        fade: this.dynalite.config.default!.fade!,96        active: this.dynalite.config.active!,97        overridePresets: CONF_PRESET in this.dynalite.config,98        overrideTemplates: false,99        room_on: "",100        room_off: "",101        open: "",102        close: "",103        stop: "",104        channel_cover: "",105        class: "",106        duration: "",107        tiltEnabled: false,108        tilt: DynaliteDefaultTemplates.time_cover!.tilt!,109      };110      this.helpers = {111        name: "Default: " + this.dynalite.default.DEFAULT_NAME,112        fade: "0 For No fade",113      };114      this._presets = dynaliteCopy(this.dynalite.config.preset || {});115      enumeratedTemplates.forEach(([template, param]) => {116        if (param in this.dynalite.config.template![template])117          this.result[param] = this.dynalite.config.template![template][param];118        this.helpers![param] = "Default: " + DynaliteDefaultTemplates[template][param];119      });120      if (parseFloat(this.result.tilt) === 0) {121        this.result.tiltEnabled = false;122        this.result.tilt = DynaliteDefaultTemplates.time_cover!.tilt!;123      } else {124        this.result.tiltEnabled = true;125        this.result.tilt = this.dynalite.config.template!.time_cover!.tilt!;126      }127      this._hasInitialized = true;128    }129  }130  protected render(): TemplateResult | void {131    if (!this.hass || !this.dynalite) {132      return html``;133    }134    const canSave =135      this.hasElementChanged &&136      this._inputElements?.length &&137      Array.from(this._inputElements).every(138        (elem) =>139          elem.isValid() || (elem.settings.nameVal === CONF_TILT && !this.result.tiltEnabled)140      );141    const showAdvanced = this.hass.userData?.showAdvanced;142    return html`143      <hass-tabs-subpage144        .hass=${this.hass}145        .narrow=${this.narrow}146        .tabs=${panelTabs}147        .route=${this.route}148        clickable149      >150        <div class="content">151          <ha-card outlined>152            <div class="card-content">153              <h1>Configure Global Dynalite Settings</h1>154              <p>Host: ${this.dynalite.config.host} Port: ${this.dynalite.config.port}</p>155              ${Object.keys(this.dynalite.completeConfig).length > 1156                ? html`<a @click=${this._handleChangeHost} href="#select-gateway">Change</a>`157                : html``}158              <h2>Global Settings</h2>159              ${this.genInputElement(CONF_NAME)} ${this.genInputElement(CONF_AUTODISCOVER)}160              ${this.genInputElement(CONF_FADE)} ${this.genInputElement(CONF_ACTIVE)}161              <h2>Settings for Blinds and Covers</h2>162              ${this.genInputElement(CONF_CLASS)} ${this.genInputElement(CONF_DURATION)}163              ${this.genInputElement(CONF_TILT_ENABLED)}164              ${this.result.tiltEnabled ? this.genInputElement(CONF_TILT) : html``}165              ${showAdvanced166                ? html`167                  <h1>Advanced Settings</h1>168                  ${this.result.overridePresets ? html` <h2>Default Presets</h2>` : html``}169                  ${this.genInputElement(CONF_OVERRIDE_PRESETS)}170                  ${171                    this.result.overridePresets172                      ? html`<dynalite-preset-table173                          .hass=${this.hass}174                          .narrow=${this.narrow}175                          .route=${this.route}176                          .presets=${this._presets || {}}177                          defaultFade=${ifDefined(this.dynalite.config.default?.fade)}178                          @dynalite-table=${this._onDynaliteTableEvent}179                        ></dynalite-preset-table>`180                      : html``181                  }182                  </dynalite-preset-table>183                  ${184                    this.result.overrideTemplates185                      ? html` <h2>Area Behavior Default Settings</h2>186                          <p>Advanced only - recommended to leave empty</p>`187                      : html``188                  }189                  ${this.genInputElement(CONF_OVERRIDE_TEMPLATES)}190                  ${191                    this.result.overrideTemplates192                      ? html`193                          <b>${TEMPLATE_ROOM}</b>194                          ${this.genInputElement(CONF_ROOM_ON)}195                          ${this.genInputElement(CONF_ROOM_OFF)}196                          <b>${TEMPLATE_COVER}</b>197                          ${this.genInputElement(CONF_OPEN)} ${this.genInputElement(CONF_CLOSE)}198                          ${this.genInputElement(CONF_STOP)}199                          ${this.genInputElement(CONF_CHANNEL_COVER)}200                        `201                      : html``202                  }`203                : html``}204            </div>205            <div class="card-actions">206              <mwc-button @click=${this._save} ?disabled=${!canSave}> Save </mwc-button>207            </div>208          </ha-card>209        </div>210      </hass-tabs-subpage>211    `;212  }213  private _onDynaliteTableEvent(_ev: CustomEvent) {214    this.hasElementChanged = true;215    this.requestUpdate();216  }217  private _save() {218    // fill complete and send update signal219    if (this.result.name) this.dynalite.config.name = this.result.name;220    else delete this.dynalite.config.name;221    this.dynalite.config.autodiscover = this.result.autodiscover;222    this.dynalite.config.default!.fade = this.result.fade;223    this.dynalite.config.active = this.result.active;224    if (this.result.overridePresets)225      this.dynalite.config.preset = JSON.parse(JSON.stringify(this._presets));226    else delete this.dynalite.config.preset;227    const templates: DynaliteTemplateData = { room: {}, time_cover: {} };228    enumeratedTemplates.forEach(([template, param]) => {229      if (this.result[param] !== "") templates[template][param] = this.result[param];230    });231    if (!this.result.tiltEnabled) templates.time_cover!.tilt = "0";232    this.dynalite.config.template = templates;233    this.hasElementChanged = false;234    fireEvent(this, EVENT_CONFIG_CHANGED, { value: true });235    this.requestUpdate();236  }237  private _handleChangeHost(ev) {238    ev.preventDefault();239    showDynaliteSelectGatewayDialog(this, {240      hass: this.hass,241      dynalite: this.dynalite,242      onSave: this._hostChanged.bind(this),243    });244  }245  private _hostChanged(entry_id: string): void {246    this.dynalite.entry_id = entry_id;247    fireEvent(this, EVENT_CONFIG_CHANGED, { value: false });248    navigate(dynaliteRoute(ROUTE_AREAS));249  }250  protected result = {251    name: "",252    autodiscover: false,253    fade: "",254    active: "off",255    overridePresets: false,256    overrideTemplates: false,257    room_on: "",258    room_off: "",259    open: "",260    close: "",261    stop: "",262    channel_cover: "",263    class: "",264    duration: "",265    tiltEnabled: false,266    tilt: "",267  };268  protected settings = {269    name: DynaliteTextInput(CONF_NAME)270      .heading("System Name")271      .desc("User-defined name for this Dynalite system"),272    autodiscover: DynaliteBooleanInput(CONF_AUTODISCOVER)273      .heading("Auto Discover")274      .desc("Discover devices dynamically (useful for initial setup)"),275    fade: DynaliteFadeInput(CONF_FADE)276      .heading("Fade Time")277      .desc("Default fade for device actions (seconds)"),278    active: DynaliteSelectInput(CONF_ACTIVE)279      .heading("Active Mode")280      .desc("Actively poll system - may increase load")281      .selection([282        [CONF_ACTIVE_OFF, "Not Active (default)"],283        [CONF_ACTIVE_INIT, "Initial Init"],284        [CONF_ACTIVE_ON, "Always Active"],285      ]),286    class: DynaliteSelectInput(CONF_CLASS).heading("Type").desc("Default type for new blinds"),287    duration: DynaliteDurationInput(CONF_DURATION)288      .heading("Default Open/Close Duration")289      .desc("Time in seconds to open a blind")290      .required(),291    tiltEnabled: DynaliteBooleanInput(CONF_TILT_ENABLED)292      .heading("Enable Tilt")293      .desc("Enable tilt by default in blinds"),294    tilt: DynaliteDurationInput(CONF_TILT)295      .heading("Default Tilt Duration")296      .desc("Time in seconds to open the tilt")297      .required(),298    overridePresets: DynaliteBooleanInput(CONF_OVERRIDE_PRESETS)299      .heading("Override Default Presets")300      .desc("Not recommended"),301    overrideTemplates: DynaliteBooleanInput(CONF_OVERRIDE_TEMPLATES)302      .heading("Configure Behaviors")303      .desc("Not recommended"),304    room_on: DynaliteIdInput(CONF_ROOM_ON, CONF_PRESET)305      .heading("Turn On")306      .desc("Preset that turns an area on"),307    room_off: DynaliteIdInput(CONF_ROOM_OFF, CONF_PRESET)308      .heading("Turn Off")309      .desc("Preset that turns an area off"),310    open: DynaliteIdInput(CONF_OPEN, CONF_PRESET).heading("Open").desc("Preset to open a blind"),311    close: DynaliteIdInput(CONF_CLOSE, CONF_PRESET)312      .heading("Close")313      .desc("Preset to close a blind"),314    stop: DynaliteIdInput(CONF_STOP, CONF_PRESET).heading("Open").desc("Preset to open a blind"),315    channel_cover: DynaliteIdInput(CONF_CHANNEL_COVER, CONF_CHANNEL)316      .heading("Controlling channel")317      .desc("Channel number to control a blind"),318  };319  static get styles(): CSSResultGroup {320    return [321      haStyle,322      css`323        p {324          margin-top: 0;325          margin-bottom: 0;326        }327        .content {328          padding: 28px 20px 0;329          display: block;330          max-width: 600px;331          margin: 0 auto;332        }333      `,334    ];335  }336}337declare global {338  interface HTMLElementTagNameMap {339    "dynalite-global-settings": DynaliteGlobalSettings;340  }...

config.js

Source:config.js

1import loadPresets from './presets';2import loadCustomPresets from './common/custom-presets';3async function getPreviewWebpackConfig(options, presets) {4  const babelOptions = await presets.apply('babel', {}, options);5  const entries = await presets.apply('entries', [], options);6  const stories = await presets.apply('stories', [], options);7  return presets.apply('webpack', {}, { ...options, babelOptions, entries, stories });8}9export default async options => {10  const { corePresets = [], frameworkPresets = [], overridePresets = [], ...restOptions } = options;11  const presetsConfig = [12    ...corePresets,13    require.resolve('./common/babel-cache-preset.js'),14    ...frameworkPresets,15    ...loadCustomPresets(options),16    ...overridePresets,17  ];18  const presets = loadPresets(presetsConfig, restOptions);19  return getPreviewWebpackConfig({ ...restOptions, presets }, presets);...

manager-config.js

Source:manager-config.js

1import loadPresets from '../presets';2import loadCustomPresets from '../common/custom-presets';3async function getManagerWebpackConfig(options, presets) {4  const entries = await presets.apply('managerEntries', [], options);5  return presets.apply('managerWebpack', {}, { ...options, entries });6}7export default async options => {8  const { corePresets = [], overridePresets = [], ...restOptions } = options;9  const presetsConfig = [10    ...corePresets,11    require.resolve('../common/babel-cache-preset.js'),12    ...loadCustomPresets(options),13    ...overridePresets,14  ];15  const presets = loadPresets(presetsConfig);16  return getManagerWebpackConfig({ ...restOptions, presets }, presets);...

Using AI Code Generation

1import { overridePresets } from 'storybook-root';2  {3    options: {4    },5  },6];7overridePresets(presets);8module.exports = presets;9module.exports = {10};11import { addParameters } from '@storybook/react';12import { DocsPage, DocsContainer } from '@storybook/addon-docs/blocks';13addParameters({14  docs: {15  },16});

Using AI Code Generation

1import { overridePresets } from '@storybook/addon-devkit';2overridePresets([3 {4 options: {5 },6 },7]);

Using AI Code Generation

1import { overridePresets } from 'storybook-root-config';2overridePresets([3  {4    options: {5    },6  },7]);8export const parameters = {9  actions: { argTypesRegex: '^on[A-Z].*' },10};11  (Story) => (12];13module.exports = {14  stories: ['../src/**/*.stories.@(js|jsx|ts|tsx)'],15};16const path = require('path');17module.exports = async ({ config, mode }) => {18  config.module.rules.push({19    include: path.resolve(__dirname, '../'),20  });21  return config;22};23import React from 'react';24import { addDecorator } from '@storybook/react';25import GlobalStyle from '../src/styles/global';26addDecorator((story) => (27    {story()}28));29export const parameters = {30  actions: { argTypesRegex: '^on[A-Z].*' },31};32  (Story) => (33];34import { withThemesProvider } from 'storybook-addon-styled-component-theme';35import { ThemeProvider } from 'styled-components';36import { themes } from '../src/styles/theme';37  withThemesProvider(themes),38  (Story) => (39    <ThemeProvider theme={themes.dark}>40];41import { withThemesProvider } from 'storybook-addon-styled-component-theme';42import { ThemeProvider } from 'styled-components';

Using AI Code Generation

1import { overridePresets } from '@storybook/addon-docs/blocks';2import { theme } from './theme';3export const parameters = {4  docs: {5    theme: overridePresets({6    }),7  },8};9import { create } from '@storybook/theming/create';10export const theme = create({11});12import { create } from '@storybook/theming/create';13export const theme = create({14});15import { addParameters } from '@storybook/react';16import { theme } from './theme';17addParameters({18  docs: {19  },20});21import { create } from '@storybook/theming/create';22export const theme = create({23});

Using AI Code Generation

1const rootConfig = require('@nrwl/react/plugins/storybook');2module.exports = rootConfig.overridePresets({3      require.resolve('@nrwl/react/plugins/storybook'),4      {5        config: {6        },7      },8});

Using AI Code Generation

1import { overridePresets } from 'storybook-root-config';2import { createPresets } from '@storybook/addon-docs/preset';3const newPresets = overridePresets(createPresets);4module.exports = {5};6const overridePresets = (createPresets, options) => {7  const newPresets = createPresets(options);8  const docsPreset = newPresets.find(preset => preset.name === '@storybook/addon-docs/preset');9  docsPreset.options.configureJSX = true;10  return newPresets;11};12module.exports = {13};

Automation Testing Tutorials

Learn to execute automation testing from scratch with LambdaTest Learning Hub. Right from setting up the prerequisites to run your first automation test, to following best practices and diving deeper into advanced test scenarios. LambdaTest Learning Hubs compile a list of step-by-step guides to help you be proficient with different test automation frameworks i.e. Selenium, Cypress, TestNG etc.