@yandex/ui/esm/Select/Select.examples/desktop/playground.examples.js

Yandex UI components

import { __read, __spread } from "tslib";
import React, { useState } from 'react';
import { withKnobs, select, boolean, object } from '@storybook/addon-knobs';
import { cnTheme } from '@yandex-lego/components/Theme';
import { presets, presetsKeys } from '@yandex-lego/components/Theme/presets';
import { Select } from '@yandex-lego/components/Select/desktop/bundle';
import { EXAMPLE_DESKTOP_TOKEN, createDecorators, parameters } from '../examples-config';
export default {
    title: EXAMPLE_DESKTOP_TOKEN,
    decorators: __spread([withKnobs], createDecorators()),
    parameters: parameters,
};
var rawOptions = [
    { value: 1, content: 1 },
    { value: 2, content: 2 },
    { value: 'c', content: 'hello' },
    { value: 'd', content: 'darkness' },
    { value: 'e', content: 'my', disabled: true },
    { value: 'f', content: 'old' },
    { value: 'g', content: 'friend' },
];
export var Playground = function () {
    var _a = __read(useState('с'), 2), value = _a[0], setValue = _a[1];
    var preset = select('theme-preset', presetsKeys, 'default');
    var size = select('size', ['m', 's'], 'm');
    var view = select('view', ['default', ''], 'default');
    var theme = view === '' ? select('theme', ['normal'], 'normal') : null;
    var disabled = boolean('disabled', false);
    var renderControl = boolean('renderControl', false);
    var options = object('options', rawOptions);
    return (React.createElement("div", { className: cnTheme(presets[preset]) },
        React.createElement(Select, { disabled: disabled, theme: theme, size: size, view: view, value: value, renderControl: renderControl, onChange: function (event) { return setValue(event.target.value); }, options: options })));
};
Playground.story = {
    name: 'playground',
};