From b05cf143fe687f51938019d235710bbbcd750359 Mon Sep 17 00:00:00 2001 From: Gervwyk Date: Wed, 27 Jan 2021 16:02:36 +0200 Subject: [PATCH] feat(docs): Add NumberInput docs. --- .../DateTimeSelector/DateTimeSelector.json | 6 +- .../src/blocks/NumberInput/NumberInput.json | 2 - packages/docs/blocks/input/NumberInput.yaml | 44 +++++++++++ packages/docs/lowdefy.yaml | 4 + .../blocks/defaultValueTransformer.js | 2 +- .../blocks/propertiesFormTransformer.js | 17 ++++ .../templates/blocks/propertiesTransformer.js | 78 ------------------- 7 files changed, 69 insertions(+), 84 deletions(-) create mode 100644 packages/docs/blocks/input/NumberInput.yaml delete mode 100644 packages/docs/templates/blocks/propertiesTransformer.js diff --git a/packages/blocks/blocksAntd/src/blocks/DateTimeSelector/DateTimeSelector.json b/packages/blocks/blocksAntd/src/blocks/DateTimeSelector/DateTimeSelector.json index c4fc41163..ab0099551 100644 --- a/packages/blocks/blocksAntd/src/blocks/DateTimeSelector/DateTimeSelector.json +++ b/packages/blocks/blocksAntd/src/blocks/DateTimeSelector/DateTimeSelector.json @@ -59,7 +59,7 @@ "description": "Format in which to parse the date value, eg. \"DD MMMM YYYY\" will parse a date value of 1999-12-31 as \"31 December 1999\". The format has to conform to moment.js formats." }, "hourStep": { - "type": "number", + "type": "integer", "default": 1, "minimum": 1, "description": "Hour intervals to show in the time selector." @@ -127,7 +127,7 @@ } }, "minuteStep": { - "type": "number", + "type": "integer", "default": 5, "minimum": 1, "description": "Minute intervals to show in the time selector." @@ -138,7 +138,7 @@ "description": "Placeholder text inside the block before user types input." }, "secondStep": { - "type": "number", + "type": "integer", "default": 5, "minimum": 1, "description": "Minute intervals to show in the time selector." diff --git a/packages/blocks/blocksAntd/src/blocks/NumberInput/NumberInput.json b/packages/blocks/blocksAntd/src/blocks/NumberInput/NumberInput.json index 1026b042b..0fe00788a 100644 --- a/packages/blocks/blocksAntd/src/blocks/NumberInput/NumberInput.json +++ b/packages/blocks/blocksAntd/src/blocks/NumberInput/NumberInput.json @@ -87,12 +87,10 @@ }, "min": { "type": "number", - "default": "-Infinity", "description": "Minimum value allowed by the block." }, "max": { "type": "number", - "default": "Infinity", "description": "Maximum value allowed by the block." }, "placeholder": { diff --git a/packages/docs/blocks/input/NumberInput.yaml b/packages/docs/blocks/input/NumberInput.yaml new file mode 100644 index 000000000..294962e8c --- /dev/null +++ b/packages/docs/blocks/input/NumberInput.yaml @@ -0,0 +1,44 @@ +# Copyright 2020-2021 Lowdefy, Inc + +# Licensed under the Apache License, Version 2.0 (the "License"); +# you may not use this file except in compliance with the License. +# You may obtain a copy of the License at + +# http://www.apache.org/licenses/LICENSE-2.0 + +# Unless required by applicable law or agreed to in writing, software +# distributed under the License is distributed on an "AS IS" BASIS, +# WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +# See the License for the specific language governing permissions and +# limitations under the License. + +_ref: + path: templates/blocks/template.yaml.njk + vars: + block_type: NumberInput + value_type: number + category: input + description_content: | + The `NumberInput` allows a user to input a number. + default_properties: + _ref: + path: ../blocks/blocksAntd/src/blocks/NumberInput/NumberInput.json + transformer: templates/blocks/defaultValueTransformer.js + properties_getter: + _ref: + path: ../blocks/blocksAntd/src/blocks/NumberInput/NumberInput.json + transformer: templates/blocks/propertiesGetterTransformer.js + properties_form: + _ref: + path: ../blocks/blocksAntd/src/blocks/NumberInput/NumberInput.json + transformer: templates/blocks/propertiesFormTransformer.js + + available_actions_description: | + ###### onChange + Triggered when value is changed. + ###### onPressEnter + Triggered when enter is pressed while block is focused. + + examples: + - title: Number input + properties: '{"title": "Number input"}' diff --git a/packages/docs/lowdefy.yaml b/packages/docs/lowdefy.yaml index 583ab08e6..debe70b02 100644 --- a/packages/docs/lowdefy.yaml +++ b/packages/docs/lowdefy.yaml @@ -160,6 +160,9 @@ menus: - id: MultipleSelector type: MenuLink pageId: MultipleSelector + - id: NumberInput + type: MenuLink + pageId: NumberInput - id: RadioSelector type: MenuLink pageId: RadioSelector @@ -353,6 +356,7 @@ pages: - _ref: blocks/input/DateTimeSelector.yaml - _ref: blocks/input/MonthSelector.yaml - _ref: blocks/input/MultipleSelector.yaml + - _ref: blocks/input/NumberInput.yaml - _ref: blocks/input/RadioSelector.yaml - _ref: blocks/input/Selector.yaml - _ref: blocks/input/TextInput.yaml diff --git a/packages/docs/templates/blocks/defaultValueTransformer.js b/packages/docs/templates/blocks/defaultValueTransformer.js index 7a9b4d8e7..a3f530239 100644 --- a/packages/docs/templates/blocks/defaultValueTransformer.js +++ b/packages/docs/templates/blocks/defaultValueTransformer.js @@ -18,7 +18,7 @@ function transformer(obj) { const blockProperties = obj.schema.properties.properties; const defaultValues = {}; Object.keys(blockProperties).forEach((key) => { - if (blockProperties[key].default || blockProperties[key].default === false) { + if (blockProperties[key].default != null) { defaultValues[key] = blockProperties[key].default; } if (key === 'label') { diff --git a/packages/docs/templates/blocks/propertiesFormTransformer.js b/packages/docs/templates/blocks/propertiesFormTransformer.js index 837a9b13c..95a13be92 100644 --- a/packages/docs/templates/blocks/propertiesFormTransformer.js +++ b/packages/docs/templates/blocks/propertiesFormTransformer.js @@ -365,6 +365,23 @@ function makeBlockDefinition(propertyName, propertyDescription) { return block; case 'number': block.type = 'NumberInput'; + block.properties.step = propertyDescription.step ? propertyDescription.step : 0.1; + if (propertyDescription.maximum != null) { + block.properties.max = propertyDescription.maximum; + } + if (propertyDescription.minimum != null) { + block.properties.min = propertyDescription.minimum; + } + return block; + case 'integer': + block.type = 'NumberInput'; + block.properties.step = propertyDescription.step ? propertyDescription.step : 1; + if (propertyDescription.maximum != null) { + block.properties.max = propertyDescription.maximum; + } + if (propertyDescription.minimum != null) { + block.properties.min = propertyDescription.minimum; + } return block; default: return block; diff --git a/packages/docs/templates/blocks/propertiesTransformer.js b/packages/docs/templates/blocks/propertiesTransformer.js deleted file mode 100644 index 0e5854d3b..000000000 --- a/packages/docs/templates/blocks/propertiesTransformer.js +++ /dev/null @@ -1,78 +0,0 @@ -// const schema = require('./Button.json'); - -function makeBlockDefinition(propertyName, propertyDescription) { - const block = { - id: `block.properties.${propertyName}`, - layout: { _global: 'settings_input_layout' }, - properties: { - title: propertyName, - size: 'small', - label: { - _ref: { - path: 'templates/blocks/label_extra.yaml', - vars: { - extra: propertyDescription.description, - }, - }, - }, - }, - }; - - if (propertyDescription.docs && propertyDescription.docs.displayType) { - switch (propertyDescription.docs.displayType) { - case 'manual': - return propertyDescription.docs.manual; - case 'icon': - return { - _ref: { - path: 'templates/blocks/icon_template.yaml.njk', - vars: { - icon_field_name: propertyName, - icon_description: propertyDescription.description, - }, - }, - }; - case 'color': - block.type = 'TwitterColorSelector'; - return block; - case 'style': - // TODO: - block.type = 'TextInput'; - return block; - } - } - - // enums - if (propertyDescription.enum) { - block.type = 'ButtonSelector'; - block.options = propertyDescription.enum; - return block; - } - - // defaults for type - switch (propertyDescription.type) { - case 'boolean': - block.type = 'Switch'; - return block; - case 'string': - block.type = 'TextInput'; - return block; - case 'number': - block.type = 'NumberInput'; - return block; - default: - return block; - } -} - -function transformer(obj) { - const blockProperties = obj.schema.properties.properties; - const blocks = Object.keys(blockProperties).map((key) => { - return makeBlockDefinition(key, blockProperties[key]); - }); - return blocks; -} - -// transformer(schema); - -module.exports = transformer;