Home - News ( United States | United Kingdom | Italy | Germany ) - Football scores

Showing content from https://github.com/telerik/kendo-react/discussions/2549 below:

Unstyled Mode · telerik/kendo-react · Discussion #2549 · GitHub

It can be activated quickly by wrapping the components you to "unstyle" with provider:

<UnstyledContext.Provider value={preset}>
    <Button > Unstyled Button</Button>
</UnstyledContext.Provider>

The preset here is a subset of JSON based object responsible for applying the needed classes for each component by providing options to add class for its different state and variations. Here is an example of the preset of the button:

const preset = {
    uButton: {
        wrapper: {
            main: `mainClass`,
            size: {
                small: `smallClass`,
                medium:  `mediumClasss`,
                large:  `largeClass`
            },
            fillMode: {
                solid: ``,
                outline: ``,
                flat: ``,
                link: ``,
                clear: ``
            },
            themeColor: {
                base: {
                    fillMode: {
                        solid: `solidClass`,
                        outline: ``,
                        ...
                    }
                },
                ...
            },
            rounded: {
                small: ``,
                medium: ``,
                large: ``,
                full: ``,
            },
            iconButton: `iconButtonClass`,
            disabled: `disabledClass`,
            selected: `selected`,
            isRtl: `rtlClass`
        },
        text: `textClass`,
        icon: `iconClass`
    }

For the initial Preview version we have released Unstyled Mode option for the following packages and components:

• Animation
• Buttons – Button, ButtonGroup, DropDownButton
• Common - SvgIcon
• Dropdowns – DropdownList, Combobox
• DateInputs – DateInput, DateTimePicker, TimePicker
• Inputs – Input, TextBox, MaskedTextBox, RadioButton, RadioGroup
• Popup
• Form
• Labels – Label, Floating Label, Hint, Error

You can check our official documentation here and run locally this example - https://github.com/telerik/kendo-react/tree/master/examples/kendo-unstyled-tailwind

What we need from you is to share any ideas or questions regarding the new Unstyled Mode option in KendoReact:

• Do you like it
• Do you have any recommendation how to improve it
• Which is the next component you want to see with Unstyled mode

Thank you in advance for participating in this discussion! :)

RetroSearch is an open source project built by @garambo | Open a GitHub Issue

Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo

HTML: 3.2 | Encoding: UTF-8 | Version: 0.7.4