@gravity-ui/dynamic-forms 1.7.0 → 1.8.0

package/CHANGELOG.md

@@ -1,5 +1,19 @@
 # Changelog
 
+## [1.8.0](https://github.com/gravity-ui/dynamic-forms/compare/v1.7.1...v1.8.0) (2023-05-25)
+
+
+### Features
+
+* **Switch:** added new input switch ([#48](https://github.com/gravity-ui/dynamic-forms/issues/48)) ([47e2f51](https://github.com/gravity-ui/dynamic-forms/commit/47e2f51dcda0579b00f6fadc3008d2e78a2f47e7))
+
+## [1.7.1](https://github.com/gravity-ui/dynamic-forms/compare/v1.7.0...v1.7.1) (2023-05-22)
+
+
+### Bug Fixes
+
+* **OneOf:** fixed styles in inputs and view ([#46](https://github.com/gravity-ui/dynamic-forms/issues/46)) ([e7a824d](https://github.com/gravity-ui/dynamic-forms/commit/e7a824d4fec537ebef10f96049279bfc7a759f3b))
+
 ## [1.7.0](https://github.com/gravity-ui/dynamic-forms/compare/v1.6.2...v1.7.0) (2023-05-22)
 
 

package/build/cjs/lib/kit/components/Inputs/OneOf/OneOf.css

@@ -5,10 +5,10 @@
 .df-oneof:last-child > .df-group-indent {
   margin-bottom: 0;
 }
-.df-oneof_base .df-group-indent {
+.df-oneof_base > .df-group-indent {
   all: unset;
 }
-.df-oneof_base .df-group-indent > .df-use-search {
+.df-oneof_base > .df-group-indent > .df-use-search {
   padding-top: 11px;
   padding-left: 20px;
   margin-top: 4px;
@@ -16,13 +16,13 @@
   margin-left: 5px;
   border-left: 1px solid var(--yc-color-line-generic-accent);
 }
-.df-oneof_base .df-group-indent > .df-use-search:empty {
+.df-oneof_base > .df-group-indent > .df-use-search:empty {
   display: none;
 }
-.df-oneof_base .df-group-indent > .df-use-search:last-child {
+.df-oneof_base > .df-group-indent > .df-use-search:last-child {
   margin-bottom: 0;
 }
-.df-oneof_base .df-group-indent > .df-use-search > .df-simple-vertical-accordeon_view {
+.df-oneof_base > .df-group-indent > .df-use-search > .df-simple-vertical-accordeon_view {
   margin-top: -10px;
 }
 .df-oneof_flat > .df-group-indent {

package/build/cjs/lib/kit/components/Inputs/Switch/Switch.css

@@ -0,0 +1,5 @@
+.df-switch {
+  height: 28px;
+  display: flex;
+  align-items: center;
+}

package/build/cjs/lib/kit/components/Inputs/Switch/Switch.js

@@ -0,0 +1,14 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Switch = void 0;
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importDefault(require("react"));
+const uikit_1 = require("@gravity-ui/uikit");
+const utils_1 = require("../../../utils");
+const b = (0, utils_1.block)('switch');
+const Switch = ({ name, input, spec }) => {
+    const { value, onBlur, onChange, onFocus } = input;
+    const handleChange = react_1.default.useCallback((e) => onChange(e.target.checked), [onChange]);
+    return (react_1.default.createElement(uikit_1.Switch, { checked: value, onChange: handleChange, onBlur: onBlur, onFocus: onFocus, disabled: spec.viewSpec.disabled, className: b(), qa: name }));
+};
+exports.Switch = Switch;

package/build/cjs/lib/kit/components/Inputs/Switch/index.js

@@ -0,0 +1,4 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./Switch"), exports);

package/build/cjs/lib/kit/components/Inputs/index.js

@@ -12,6 +12,7 @@ tslib_1.__exportStar(require("./OneOf"), exports);
 tslib_1.__exportStar(require("./OneOfCard"), exports);
 tslib_1.__exportStar(require("./Secret"), exports);
 tslib_1.__exportStar(require("./Select"), exports);
+tslib_1.__exportStar(require("./Switch"), exports);
 tslib_1.__exportStar(require("./TableArrayInput"), exports);
 tslib_1.__exportStar(require("./Text"), exports);
 tslib_1.__exportStar(require("./TextArea"), exports);

package/build/cjs/lib/kit/components/Views/OneOfView/OneOfView.css

@@ -1,4 +1,4 @@
-.df-oneof-view .df-group-indent {
+.df-oneof-view > .df-group-indent {
   margin-bottom: 20px;
 }
 .df-oneof-view_flat > .df-group-indent {

package/build/cjs/lib/kit/constants/config.js

@@ -30,6 +30,7 @@ exports.dynamicConfig = {
     boolean: {
         inputs: {
             base: { Component: components_1.Checkbox },
+            switch: { Component: components_1.Switch },
         },
         layouts: {
             row: components_1.Row,
@@ -132,6 +133,7 @@ exports.dynamicCardConfig = {
     boolean: {
         inputs: {
             base: { Component: components_1.Checkbox },
+            switch: { Component: components_1.Switch },
         },
         layouts: {
             row: components_1.Row2,
@@ -224,6 +226,7 @@ exports.dynamicViewConfig = {
     boolean: {
         views: {
             base: { Component: components_1.BaseView },
+            switch: { Component: components_1.BaseView },
         },
         layouts: {
             row: components_1.ViewRow,
@@ -306,6 +309,7 @@ exports.dynamicViewCardConfig = {
     boolean: {
         views: {
             base: { Component: components_1.BaseView },
+            switch: { Component: components_1.BaseView },
         },
         layouts: {
             row: components_1.ViewRow2,

package/build/esm/lib/kit/components/Inputs/OneOf/OneOf.css

@@ -5,10 +5,10 @@
 .df-oneof:last-child > .df-group-indent {
   margin-bottom: 0;
 }
-.df-oneof_base .df-group-indent {
+.df-oneof_base > .df-group-indent {
   all: unset;
 }
-.df-oneof_base .df-group-indent > .df-use-search {
+.df-oneof_base > .df-group-indent > .df-use-search {
   padding-top: 11px;
   padding-left: 20px;
   margin-top: 4px;
@@ -16,13 +16,13 @@
   margin-left: 5px;
   border-left: 1px solid var(--yc-color-line-generic-accent);
 }
-.df-oneof_base .df-group-indent > .df-use-search:empty {
+.df-oneof_base > .df-group-indent > .df-use-search:empty {
   display: none;
 }
-.df-oneof_base .df-group-indent > .df-use-search:last-child {
+.df-oneof_base > .df-group-indent > .df-use-search:last-child {
   margin-bottom: 0;
 }
-.df-oneof_base .df-group-indent > .df-use-search > .df-simple-vertical-accordeon_view {
+.df-oneof_base > .df-group-indent > .df-use-search > .df-simple-vertical-accordeon_view {
   margin-top: -10px;
 }
 .df-oneof_flat > .df-group-indent {

package/build/esm/lib/kit/components/Inputs/Switch/Switch.css

@@ -0,0 +1,5 @@
+.df-switch {
+  height: 28px;
+  display: flex;
+  align-items: center;
+}

package/build/esm/lib/kit/components/Inputs/Switch/Switch.d.ts

@@ -0,0 +1,3 @@
+import { BooleanInput } from '../../../../core';
+import './Switch.css';
+export declare const Switch: BooleanInput;

package/build/esm/lib/kit/components/Inputs/Switch/Switch.js

@@ -0,0 +1,10 @@
+import React from 'react';
+import { Switch as SwitchBase } from '@gravity-ui/uikit';
+import { block } from '../../../utils';
+import './Switch.css';
+const b = block('switch');
+export const Switch = ({ name, input, spec }) => {
+    const { value, onBlur, onChange, onFocus } = input;
+    const handleChange = React.useCallback((e) => onChange(e.target.checked), [onChange]);
+    return (React.createElement(SwitchBase, { checked: value, onChange: handleChange, onBlur: onBlur, onFocus: onFocus, disabled: spec.viewSpec.disabled, className: b(), qa: name }));
+};

package/build/esm/lib/kit/components/Inputs/Switch/index.d.ts

@@ -0,0 +1 @@
+export * from './Switch';

package/build/esm/lib/kit/components/Inputs/Switch/index.js

@@ -0,0 +1 @@
+export * from './Switch';

package/build/esm/lib/kit/components/Inputs/index.d.ts

@@ -9,6 +9,7 @@ export * from './OneOf';
 export * from './OneOfCard';
 export * from './Secret';
 export * from './Select';
+export * from './Switch';
 export * from './TableArrayInput';
 export * from './Text';
 export * from './TextArea';

package/build/esm/lib/kit/components/Inputs/index.js

@@ -9,6 +9,7 @@ export * from './OneOf';
 export * from './OneOfCard';
 export * from './Secret';
 export * from './Select';
+export * from './Switch';
 export * from './TableArrayInput';
 export * from './Text';
 export * from './TextArea';

package/build/esm/lib/kit/components/Views/OneOfView/OneOfView.css

@@ -1,4 +1,4 @@
-.df-oneof-view .df-group-indent {
+.df-oneof-view > .df-group-indent {
   margin-bottom: 20px;
 }
 .df-oneof-view_flat > .df-group-indent {

package/build/esm/lib/kit/constants/config.js

@@ -1,4 +1,4 @@
-import { Accordeon, AccordeonCardLayout, ArrayBase, ArrayBaseView, BaseView, CardAccordeon, CardOneOf, CardOneOfView, CardSection, Checkbox, FileInput, FileInputView, Group, Group2, MonacoInput, MonacoInputCard, MonacoView, MonacoViewCard, MultiSelect, MultiSelectView, NumberWithScale, NumberWithScaleView, ObjectBase, ObjectBaseView, ObjectValueInput, ObjectValueInputView, OneOf, OneOfCard, OneOfCardView, OneOfFlat, OneOfFlatView, OneOfView, Row, Row2, RowVerbose, Secret, Section, Section2, SectionCard, SectionCard2, SectionWithSubtitle, SectionWithSubtitle2, Select, TableArrayInput, TableArrayView, TableCell, Text, TextArea, TextAreaView, TextContent, TextLink, TextLinkView, Transparent, ViewAccordeon, ViewAccordeonCard, ViewCardAccordeon, ViewCardSection, ViewGroup, ViewGroup2, ViewRow, ViewRow2, ViewSection, ViewSection2, ViewSectionCard, ViewSectionCard2, ViewTableCell, ViewTransparent, } from '../components';
+import { Accordeon, AccordeonCardLayout, ArrayBase, ArrayBaseView, BaseView, CardAccordeon, CardOneOf, CardOneOfView, CardSection, Checkbox, FileInput, FileInputView, Group, Group2, MonacoInput, MonacoInputCard, MonacoView, MonacoViewCard, MultiSelect, MultiSelectView, NumberWithScale, NumberWithScaleView, ObjectBase, ObjectBaseView, ObjectValueInput, ObjectValueInputView, OneOf, OneOfCard, OneOfCardView, OneOfFlat, OneOfFlatView, OneOfView, Row, Row2, RowVerbose, Secret, Section, Section2, SectionCard, SectionCard2, SectionWithSubtitle, SectionWithSubtitle2, Select, Switch, TableArrayInput, TableArrayView, TableCell, Text, TextArea, TextAreaView, TextContent, TextLink, TextLinkView, Transparent, ViewAccordeon, ViewAccordeonCard, ViewCardAccordeon, ViewCardSection, ViewGroup, ViewGroup2, ViewRow, ViewRow2, ViewSection, ViewSection2, ViewSectionCard, ViewSectionCard2, ViewTableCell, ViewTransparent, } from '../components';
 import { getArrayValidator, getBooleanValidator, getNumberValidator, getObjectValidator, getStringValidator, } from '../validators';
 export const dynamicConfig = {
     array: {
@@ -27,6 +27,7 @@ export const dynamicConfig = {
     boolean: {
         inputs: {
             base: { Component: Checkbox },
+            switch: { Component: Switch },
         },
         layouts: {
             row: Row,
@@ -129,6 +130,7 @@ export const dynamicCardConfig = {
     boolean: {
         inputs: {
             base: { Component: Checkbox },
+            switch: { Component: Switch },
         },
         layouts: {
             row: Row2,
@@ -221,6 +223,7 @@ export const dynamicViewConfig = {
     boolean: {
         views: {
             base: { Component: BaseView },
+            switch: { Component: BaseView },
         },
         layouts: {
             row: ViewRow,
@@ -303,6 +306,7 @@ export const dynamicViewCardConfig = {
     boolean: {
         views: {
             base: { Component: BaseView },
+            switch: { Component: BaseView },
         },
         layouts: {
             row: ViewRow2,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gravity-ui/dynamic-forms",
-  "version": "1.7.0",
+  "version": "1.8.0",
   "description": "",
   "license": "MIT",
   "main": "build/cjs/index.js",