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

Yandex UI components

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.Playground = void 0;
var tslib_1 = require("tslib");
var react_1 = tslib_1.__importStar(require("react"));
var addon_knobs_1 = require("@storybook/addon-knobs");
var Theme_1 = require("@yandex-lego/components/Theme");
var presets_1 = require("@yandex-lego/components/Theme/presets");
var bundle_1 = require("@yandex-lego/components/Select/desktop/bundle");
var examples_config_1 = require("../examples-config");
exports.default = {
    title: examples_config_1.EXAMPLE_DESKTOP_TOKEN,
    decorators: tslib_1.__spread([addon_knobs_1.withKnobs], examples_config_1.createDecorators()),
    parameters: examples_config_1.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' },
];
var Playground = function () {
    var _a = tslib_1.__read(react_1.useState('с'), 2), value = _a[0], setValue = _a[1];
    var preset = addon_knobs_1.select('theme-preset', presets_1.presetsKeys, 'default');
    var size = addon_knobs_1.select('size', ['m', 's'], 'm');
    var view = addon_knobs_1.select('view', ['default', ''], 'default');
    var theme = view === '' ? addon_knobs_1.select('theme', ['normal'], 'normal') : null;
    var disabled = addon_knobs_1.boolean('disabled', false);
    var renderControl = addon_knobs_1.boolean('renderControl', false);
    var options = addon_knobs_1.object('options', rawOptions);
    return (react_1.default.createElement("div", { className: Theme_1.cnTheme(presets_1.presets[preset]) },
        react_1.default.createElement(bundle_1.Select, { disabled: disabled, theme: theme, size: size, view: view, value: value, renderControl: renderControl, onChange: function (event) { return setValue(event.target.value); }, options: options })));
};
exports.Playground = Playground;
exports.Playground.story = {
    name: 'playground',
};