@lowdefy/docs 4.0.0-alpha.7 → 4.0.0-alpha.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (275) hide show
  1. package/dist/operators/client/filter_default_value.js +55 -0
  2. package/{public/modules/connectDocsearch.js → dist/operatorsClient.js} +1 -19
  3. package/{templates/blocks/schemaTransformer.js → dist/types.js} +5 -10
  4. package/package.json +19 -3
  5. package/404.yaml +0 -26
  6. package/CHANGELOG.md +0 -697
  7. package/actions/CallMethod.yaml +0 -57
  8. package/actions/JsAction.yaml +0 -281
  9. package/actions/Link.yaml +0 -120
  10. package/actions/Login.yaml +0 -123
  11. package/actions/Logout.yaml +0 -44
  12. package/actions/Message.yaml +0 -68
  13. package/actions/Notification.yaml +0 -84
  14. package/actions/Request.yaml +0 -70
  15. package/actions/Reset.yaml +0 -42
  16. package/actions/ResetValidation.yaml +0 -102
  17. package/actions/ScrollTo.yaml +0 -100
  18. package/actions/SetGlobal.yaml +0 -78
  19. package/actions/SetState.yaml +0 -85
  20. package/actions/Throw.yaml +0 -89
  21. package/actions/Validate.yaml +0 -104
  22. package/actions/Wait.yaml +0 -40
  23. package/blocks/all_icons.yaml +0 -803
  24. package/blocks/container/Affix.yaml +0 -26
  25. package/blocks/container/Alert.yaml +0 -27
  26. package/blocks/container/Badge.yaml +0 -27
  27. package/blocks/container/Box.yaml +0 -27
  28. package/blocks/container/Card.yaml +0 -29
  29. package/blocks/container/Collapse.yaml +0 -38
  30. package/blocks/container/Comment.yaml +0 -43
  31. package/blocks/container/ConfirmModal.yaml +0 -36
  32. package/blocks/container/Descriptions.yaml +0 -51
  33. package/blocks/container/Drawer.yaml +0 -46
  34. package/blocks/container/Label.yaml +0 -28
  35. package/blocks/container/Modal.yaml +0 -46
  36. package/blocks/container/PageHCF.yaml +0 -28
  37. package/blocks/container/PageHCSF.yaml +0 -29
  38. package/blocks/container/PageHSCF.yaml +0 -29
  39. package/blocks/container/PageHeaderMenu.yaml +0 -52
  40. package/blocks/container/PageSHCF.yaml +0 -29
  41. package/blocks/container/PageSiderMenu.yaml +0 -53
  42. package/blocks/container/Result.yaml +0 -34
  43. package/blocks/container/Span.yaml +0 -27
  44. package/blocks/container/Spin.yaml +0 -27
  45. package/blocks/container/Tabs.yaml +0 -41
  46. package/blocks/container/Tooltip.yaml +0 -38
  47. package/blocks/display/Anchor.yaml +0 -25
  48. package/blocks/display/Avatar.yaml +0 -23
  49. package/blocks/display/Breadcrumb.yaml +0 -28
  50. package/blocks/display/Button.yaml +0 -43
  51. package/blocks/display/DangerousHtml.yaml +0 -62
  52. package/blocks/display/DangerousMarkdown.yaml +0 -46
  53. package/blocks/display/Divider.yaml +0 -23
  54. package/blocks/display/EChart.yaml +0 -53
  55. package/blocks/display/Html.yaml +0 -50
  56. package/blocks/display/Icon.yaml +0 -23
  57. package/blocks/display/Img.yaml +0 -40
  58. package/blocks/display/Markdown.yaml +0 -31
  59. package/blocks/display/MarkdownWithCode.yaml +0 -46
  60. package/blocks/display/Menu.yaml +0 -48
  61. package/blocks/display/Message.yaml +0 -34
  62. package/blocks/display/MobileMenu.yaml +0 -47
  63. package/blocks/display/Notification.yaml +0 -34
  64. package/blocks/display/Paragraph.yaml +0 -30
  65. package/blocks/display/Progress.yaml +0 -52
  66. package/blocks/display/Skeleton.yaml +0 -27
  67. package/blocks/display/Statistic.yaml +0 -35
  68. package/blocks/display/Title.yaml +0 -32
  69. package/blocks/input/AutoComplete.yaml +0 -30
  70. package/blocks/input/ButtonSelector.yaml +0 -36
  71. package/blocks/input/CheckboxSelector.yaml +0 -36
  72. package/blocks/input/CheckboxSwitch.yaml +0 -56
  73. package/blocks/input/ChromeColorSelector.yaml +0 -24
  74. package/blocks/input/CircleColorSelector.yaml +0 -24
  75. package/blocks/input/ColorSelector.yaml +0 -24
  76. package/blocks/input/CompactColorSelector.yaml +0 -24
  77. package/blocks/input/DateRangeSelector.yaml +0 -26
  78. package/blocks/input/DateSelector.yaml +0 -26
  79. package/blocks/input/DateTimeSelector.yaml +0 -28
  80. package/blocks/input/GithubColorSelector.yaml +0 -24
  81. package/blocks/input/MonthSelector.yaml +0 -26
  82. package/blocks/input/MultipleSelector.yaml +0 -117
  83. package/blocks/input/NumberInput.yaml +0 -24
  84. package/blocks/input/Pagination.yaml +0 -33
  85. package/blocks/input/ParagraphInput.yaml +0 -32
  86. package/blocks/input/PasswordInput.yaml +0 -48
  87. package/blocks/input/RadioSelector.yaml +0 -36
  88. package/blocks/input/RatingSlider.yaml +0 -24
  89. package/blocks/input/S3UploadButton.yaml +0 -28
  90. package/blocks/input/Selector.yaml +0 -98
  91. package/blocks/input/SliderColorSelector.yaml +0 -24
  92. package/blocks/input/SwatchesColorSelector.yaml +0 -24
  93. package/blocks/input/Switch.yaml +0 -24
  94. package/blocks/input/TextArea.yaml +0 -27
  95. package/blocks/input/TextInput.yaml +0 -59
  96. package/blocks/input/TitleInput.yaml +0 -32
  97. package/blocks/input/TwitterColorSelector.yaml +0 -24
  98. package/blocks/input/WeekSelector.yaml +0 -26
  99. package/blocks/list/ControlledList.yaml +0 -191
  100. package/blocks/list/List.yaml +0 -157
  101. package/blocks/list/TimelineList.yaml +0 -136
  102. package/body.html +0 -1
  103. package/concepts/blocks.yaml +0 -249
  104. package/concepts/cli.yaml +0 -173
  105. package/concepts/connections-and-requests.yaml +0 -114
  106. package/concepts/context-and-state.yaml +0 -82
  107. package/concepts/custom-blocks.yaml +0 -190
  108. package/concepts/custom-code.yaml +0 -197
  109. package/concepts/events-and-actions.yaml +0 -224
  110. package/concepts/hosting-files.yaml +0 -50
  111. package/concepts/layout.yaml +0 -1464
  112. package/concepts/lists.yaml +0 -162
  113. package/concepts/lowdefy-schema.yaml +0 -245
  114. package/concepts/operators.yaml +0 -66
  115. package/concepts/overview.yaml +0 -48
  116. package/concepts/secrets.yaml +0 -56
  117. package/connections/AWSS3.yaml +0 -228
  118. package/connections/AmazonRedshift.yaml +0 -75
  119. package/connections/AxiosHttp.yaml +0 -194
  120. package/connections/Elasticsearch.yaml +0 -378
  121. package/connections/GoogleSheet.yaml +0 -332
  122. package/connections/Knex.yaml +0 -181
  123. package/connections/KnexRequests.md +0 -121
  124. package/connections/MSSQL.yaml +0 -90
  125. package/connections/MariaDB.yaml +0 -77
  126. package/connections/MongoDB.yaml +0 -581
  127. package/connections/MySQL.yaml +0 -92
  128. package/connections/OracleDB.yaml +0 -73
  129. package/connections/PostgreSQL.yaml +0 -99
  130. package/connections/Redis.yaml +0 -147
  131. package/connections/SQLite.yaml +0 -94
  132. package/connections/SendGridMail.yaml +0 -113
  133. package/connections/Stripe.yaml +0 -139
  134. package/deployment/aws-lambda.yaml +0 -128
  135. package/deployment/docker.yaml +0 -118
  136. package/deployment/netlify.yaml +0 -69
  137. package/deployment/node-server.yaml +0 -111
  138. package/head.html +0 -7
  139. package/howto/generate-csv.yaml.njk +0 -252
  140. package/howto/generate-pdf.yaml.njk +0 -651
  141. package/howto/generateCsv/lowdefy.yaml +0 -64
  142. package/howto/generateCsv/public/csvMake.js +0 -27
  143. package/howto/generatePdf/inv_template.yaml +0 -200
  144. package/howto/generatePdf/lowdefy.yaml +0 -117
  145. package/howto/generatePdf/my_header.html +0 -1
  146. package/howto/generatePdf/public/logo_example.png +0 -0
  147. package/howto/generatePdf/public/modules/importUmd.js +0 -7
  148. package/howto/generatePdf/public/modules/pdfMake.js +0 -7
  149. package/howto/generatePdf/public/modules/vfs_fonts.js +0 -12
  150. package/howto/use-refrences.md +0 -5
  151. package/introduction.yaml +0 -100
  152. package/lowdefy.yaml +0 -66
  153. package/menus.yaml +0 -832
  154. package/operators/_actions.yaml +0 -123
  155. package/operators/_and.yaml +0 -90
  156. package/operators/_args.yaml +0 -79
  157. package/operators/_array.yaml +0 -326
  158. package/operators/_base64.yaml +0 -56
  159. package/operators/_change_case.yaml +0 -347
  160. package/operators/_date.yaml +0 -71
  161. package/operators/_diff.yaml +0 -75
  162. package/operators/_divide.yaml +0 -46
  163. package/operators/_eq.yaml +0 -67
  164. package/operators/_event.yaml +0 -103
  165. package/operators/_format.yaml +0 -209
  166. package/operators/_function.yaml +0 -66
  167. package/operators/_get.yaml +0 -108
  168. package/operators/_global.yaml +0 -107
  169. package/operators/_gt.yaml +0 -65
  170. package/operators/_gte.yaml +0 -65
  171. package/operators/_hash.yaml +0 -109
  172. package/operators/_if.yaml +0 -44
  173. package/operators/_if_none.yaml +0 -61
  174. package/operators/_index.yaml +0 -65
  175. package/operators/_input.yaml +0 -114
  176. package/operators/_js.yaml +0 -189
  177. package/operators/_json.yaml +0 -128
  178. package/operators/_list_contexts.yaml +0 -37
  179. package/operators/_location.yaml +0 -59
  180. package/operators/_log.yaml +0 -36
  181. package/operators/_lt.yaml +0 -65
  182. package/operators/_lte.yaml +0 -65
  183. package/operators/_math.yaml +0 -374
  184. package/operators/_media.yaml +0 -86
  185. package/operators/_menu.yaml +0 -81
  186. package/operators/_mql.yaml +0 -101
  187. package/operators/_ne.yaml +0 -77
  188. package/operators/_not.yaml +0 -47
  189. package/operators/_number.yaml +0 -157
  190. package/operators/_nunjucks.yaml +0 -73
  191. package/operators/_object.yaml +0 -193
  192. package/operators/_operator.yaml +0 -47
  193. package/operators/_or.yaml +0 -81
  194. package/operators/_product.yaml +0 -59
  195. package/operators/_random.yaml +0 -104
  196. package/operators/_ref.yaml +0 -266
  197. package/operators/_regex.yaml +0 -83
  198. package/operators/_request.yaml +0 -50
  199. package/operators/_secret.yaml +0 -74
  200. package/operators/_state.yaml +0 -114
  201. package/operators/_string.yaml +0 -283
  202. package/operators/_subtract.yaml +0 -38
  203. package/operators/_sum.yaml +0 -59
  204. package/operators/_switch.yaml +0 -51
  205. package/operators/_type.yaml +0 -92
  206. package/operators/_uri.yaml +0 -56
  207. package/operators/_url_query.yaml +0 -120
  208. package/operators/_user.yaml +0 -107
  209. package/operators/_uuid.yaml +0 -114
  210. package/operators/_var.yaml +0 -105
  211. package/operators/_yaml.yaml +0 -107
  212. package/pages.yaml +0 -227
  213. package/public/images/authors/gervwyk.jpeg +0 -0
  214. package/public/images/authors/sandile.jpeg +0 -0
  215. package/public/images/howto/header_generate_csv.jpg +0 -0
  216. package/public/images/howto/header_generate_pdf.jpg +0 -0
  217. package/public/logo_example.png +0 -0
  218. package/public/lowdefy_app_schema.png +0 -0
  219. package/public/modules/csvMake.js +0 -27
  220. package/public/modules/filterDefaultValue.js +0 -48
  221. package/public/modules/importUmd.js +0 -7
  222. package/public/modules/index.js +0 -5
  223. package/public/modules/pdfMake.js +0 -7
  224. package/public/modules/test/filterDefaultValue.test.js +0 -91
  225. package/public/modules/vfs_fonts.js +0 -12
  226. package/public/sitemap.xml +0 -1024
  227. package/templates/actions.yaml.njk +0 -68
  228. package/templates/blocks/defaultValueTransformer.js +0 -53
  229. package/templates/blocks/exampleTransformer.js +0 -81
  230. package/templates/blocks/layout.yaml +0 -114
  231. package/templates/blocks/propertiesFormTransformer.js +0 -419
  232. package/templates/blocks/propertiesGetterTransformer.js +0 -132
  233. package/templates/blocks/schema.yaml.njk +0 -42
  234. package/templates/blocks/style.yaml +0 -26
  235. package/templates/blocks/template.yaml.njk +0 -495
  236. package/templates/blog.yaml.njk +0 -221
  237. package/templates/cli_command.yaml.njk +0 -37
  238. package/templates/footer.yaml.njk +0 -604
  239. package/templates/general.yaml.njk +0 -124
  240. package/templates/generateSitemap.js +0 -41
  241. package/templates/header.yaml +0 -138
  242. package/templates/navigation_buttons.yaml +0 -68
  243. package/templates/operators.yaml.njk +0 -82
  244. package/templates/operatorsMethodTransformer.js +0 -119
  245. package/templates/test/array.test.js +0 -1335
  246. package/templates/test/boolean.test.js +0 -98
  247. package/templates/test/button.test.js +0 -166
  248. package/templates/test/color.test.js +0 -126
  249. package/templates/test/enum.test.js +0 -105
  250. package/templates/test/icon.test.js +0 -109
  251. package/templates/test/integer.test.js +0 -99
  252. package/templates/test/manual.test.js +0 -238
  253. package/templates/test/number.test.js +0 -99
  254. package/templates/test/object.test.js +0 -434
  255. package/templates/test/oneOf.test.js +0 -794
  256. package/templates/test/string.test.js +0 -98
  257. package/templates/test/yaml.test.js +0 -605
  258. package/tutorial/next-steps.yaml +0 -83
  259. package/tutorial/tutorial-actions-operators-config.yaml +0 -142
  260. package/tutorial/tutorial-actions-operators.yaml +0 -436
  261. package/tutorial/tutorial-add-blocks-config.yaml +0 -109
  262. package/tutorial/tutorial-add-blocks.yaml +0 -195
  263. package/tutorial/tutorial-create-page-config.yaml +0 -77
  264. package/tutorial/tutorial-create-page.yaml +0 -196
  265. package/tutorial/tutorial-deploy.yaml +0 -146
  266. package/tutorial/tutorial-requests-config.yaml +0 -186
  267. package/tutorial/tutorial-requests.yaml +0 -338
  268. package/tutorial/tutorial-start.yaml +0 -282
  269. package/users/login-and-logout.yaml +0 -164
  270. package/users/openid-connect.yaml +0 -84
  271. package/users/protected-pages.yaml +0 -67
  272. package/users/roles.yaml +0 -70
  273. package/users/user-object.yaml +0 -73
  274. package/users/users-introduction.yaml +0 -80
  275. package/version.yaml +0 -1
@@ -1,249 +0,0 @@
1
- # Copyright 2020-2021 Lowdefy, Inc
2
-
3
- # Licensed under the Apache License, Version 2.0 (the "License");
4
- # you may not use this file except in compliance with the License.
5
- # You may obtain a copy of the License at
6
-
7
- # http://www.apache.org/licenses/LICENSE-2.0
8
-
9
- # Unless required by applicable law or agreed to in writing, software
10
- # distributed under the License is distributed on an "AS IS" BASIS,
11
- # WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
12
- # See the License for the specific language governing permissions and
13
- # limitations under the License.
14
-
15
- _ref:
16
- path: templates/general.yaml.njk
17
- vars:
18
- pageId: blocks
19
- pageTitle: Blocks
20
- section: Concepts
21
- filePath: concepts/blocks.yaml
22
- content:
23
- - id: md1
24
- type: MarkdownWithCode
25
- properties:
26
- content: |
27
- #### TLDR
28
- - All user interfaces in Lowdefy are assembled out of blocks.
29
- ##### Block types
30
- - There a five block categories: `display`, `input`, `context`, `container` and `list`.
31
- - Operators re-evaluate on every [`state`](/context-and-state) update or as request calls complete. This allows blocks to _live update_.
32
- - Lowdefy has built in default block types, however this can be overwritten or extended with custom blocks by defining `types` on the Lowdefy config root.
33
- - `input` blocks maintain a value in `state` matching the block `id` key. _Dot notation_ applies to specify nested fields.
34
- ##### Block validation
35
- - Field level input validation can be achieved by marking a `input` block as `required` or by specifying a list of `validate` tests.
36
- - Validation is invoked using the [`Validate`](/Validate) action.
37
- ##### Block events
38
- - All blocks have`onMount` and `onMountAsync` events.
39
- - Each block implements it's own additional events such as `onClick` etc.
40
- ##### Block loading
41
- - By default all blocks render a loading skeleton when the block's source code is fetched or while the block is waiting on data from a request.
42
- - A block's default loading can be overwritten by defining custom `loading` settings on a block.
43
-
44
- -------
45
- A Lowdefy page is compiled out of an arrangement of blocks. Every HTML element of this page is render as a result of a block placed and configured on the page. Blocks make it simple for Lowdefy developers to create apps since they only have to decide what block type to use, where in the layout the block should render, and what the block should do by defining the block's `properties`. How a block implements these `properties` is up to the specific block type selected.
46
-
47
- Lowdefy offers a list of over 30 block types to cater for a wide range of use cases. All blocks are categorized according to their primary function:
48
- - `display` - Display page elements.
49
- - `input` - Modify a value in [`state`](/context-and-state).
50
- - `context` - Create a new [`context`](/context-and-state).
51
- - `container` - Render other blocks into [`content areas`](/layout).
52
- - `list` - Render `content areas` and blocks for each element in the data array.
53
-
54
- When `state` updates or a requests call completes, the Lowdefy engine reevaluates all operators and rerenders blocks for which the operator evaluation is different from the previous render result. The result is _live updates_ to all blocks on a page. Operators can be used to build _live update_ logic into all block fields, except for the `id`, `type`, `areas`, `blocks` and `loading` fields.
55
-
56
- # Block Schema
57
-
58
- The schema for a Lowdefy block is:
59
-
60
- - `id: string`: __Required__ - A unique identifier for a block. For `Input` blocks the block `id` sets the field key which the block will modify in `state`. Field _dot-notation_ can be used to express fields which are nested in objects or arrays.
61
- - `type: string`: __Required__ - The is the block type identifier and defines what block to used. The block type used must either be a default block type or must defined in your app's `types` configuration.
62
- - `properties: object`: All the settings passed to a block component. __Operators are evaluated__.
63
- - `areas: object`: Used to set the content areas and content layout settings for `container`, `context` and `list` blocks. See [layout](/layout) for more details on how to use `areas`.
64
- - `blocks: array`: A array of blocks to render to the default `content` area for `container`, `context` and `list` blocks. See [layout](/layout) for more details on how to use the `blocks` array.
65
- - `events: object`: Used to defined [`actions`](/events-and-actions) that run when the block triggers an [`event`](/events-and-actions).
66
- - `layout: object`: Used to define the [layout](/layout) properties for a block. __Operators are evaluated__.
67
- - `loading: object`: Used to overwrite a block's default loading behavior.
68
- - `required: boolean | string`: For `input` blocks, whether or not a value value is required in `state` when the [`Validate`](/Validate) action is called. Can be either a boolean or a string that is used as the validation error message . __Operators are evaluated__.
69
- - `style: css object`: Used to apply css style settings to the block's top level `div` element. __Operators are evaluated__.
70
- - `validate: array`: A list of validation tests to pass when the [`Validate`](/Validate) action is called. __Operators are evaluated__.
71
- - `visible: boolean`: Controls whether or not to render a block. Operators are generally used here, and must evaluate to `false` to make the block invisible. Blocks with `visible: false` are excluded from `state`. __Operators are evaluated__.
72
-
73
- # Block types
74
-
75
- Lowdefy has list of default block types as defined in the Lowdefy docs. The default Lowdefy blocks aim to cover a very generic implementation of the [Ant Design](https://ant.design/components/overview/) react component library. To use all the default block types, you can simply use the block `type` key, like [`Button`](/Button), [`TextInput`](/TextInput), or [`Box`](/Box).
76
-
77
- ###### Default block type config example:
78
- ```yaml
79
- lowdefy: LOWDEFY_VERSION
80
- pages:
81
- - id: example_dashboard
82
- type: PageHeaderMenu
83
- blocks:
84
- - id: basic_chart
85
- type: Button
86
- properties:
87
- # ... Button details
88
- ```
89
-
90
- However, the default types can overwritten or additional types can be define as required. For example, to set a `type` for a custom implementation of [AmCharts](https://www.amcharts.com/), we can do the following. We have created a custom [Lowdefy block for AmCharts v4](https://www.npmjs.com/package/@lowdefy/blocks-amcharts) that we can use.
91
-
92
- ###### Custom block type config example:
93
- ```yaml
94
- lowdefy: LOWDEFY_VERSION
95
- types:
96
- AmChartsXY:
97
- url: https://blocks-cdn.lowdefy.com/v3.10.1/blocks-amcharts/meta/AmChartsXY.json
98
- pages:
99
- - id: example_dashboard
100
- type: Context
101
- blocks:
102
- - id: basic_chart
103
- type: AmChartsXY
104
- properties:
105
- # ... AmCharts details
106
- ```
107
-
108
- More details on custom blocks can be found [here](/custom-blocks).
109
-
110
-
111
- # Input block validation
112
-
113
- All `input` block types maintain a value in [`state`](/context-and-state). This value is set to the field name matching the block `id`. Nested fields can be created by using _dot notation_ in the `id` to specify the field path.
114
-
115
- Client side field validation can be applied setting the `required` and / or `validate` block fields. The following schema applies to `required` and `validate`.
116
-
117
- Field validation is first evaluated when the [`Validate`](/Validate) action is invoked on a page.
118
-
119
- ##### `required` schema:
120
- `required` can be a `boolean` or `string` type. When `required: true` the field label will indicate this with a red dot for user feedback, and a value will have to be supplied in to the field in order to pass validation. If `required` is set to a `string`, this string will be used as the feedback message when the validation fails.
121
-
122
- ```yaml
123
- - id: name
124
- type: TextInput
125
- required: Please provide your name.
126
- properties:
127
- title: Name
128
- ```
129
-
130
- ##### `validate` schema:
131
- The `validate` field takes a `array` of test `objects` to evaluate before passing the field validation. This list of tests are evaluated sequentially, so the test that fails first will be used as the feedback message to the user.
132
-
133
- The schema for the validation test `objects`:
134
- - `pass: boolean`: __Required__ - The test that validates if this item passes or not. This is usually written as operators which evaluates to a `true` or `false`. __Operators are evaluated__.
135
- - `message: string`: __Required__ - The feedback message to the user if this validation tests fails. __Operators are evaluated__.
136
- - `status: enum`: The feedback type to present to the user. Option are `error` and `warning`. Default is `error`. __Operators are evaluated__.
137
-
138
- The following `validate` example first verifies that something was entered into the `email` field, then checks that the field passes a email regex validation using the [`_regex`](/_regex) operator:
139
- ```yaml
140
- - id: email
141
- type: TextInput
142
- validate:
143
- - message: Please enter a email address.
144
- status: error
145
- pass:
146
- _not:
147
- _not:
148
- _state: email
149
- - message: Please provide a valid email address.
150
- status: error
151
- pass:
152
- _regex: '^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$'
153
- properties:
154
- title: Email
155
- ```
156
-
157
- # Block events
158
-
159
- By default all blocks implements `onMount` and `onMountAsync` events. Both the `onMount` and `onMountAsync` events are triggered when the block is mounted. For the `onMount` event, the block only mounts when the event action chain is completed, however, for the `onMountAsync` event, the block will mount as soon as possible while the event actions completes execution.
160
-
161
- Apart from the `onMount` and `onMountAsync` events, most blocks also implements their own block specific events such as `onOpen` for [Modal](/Modal) or `onClick` for [Button](/Button). See the events tab on each block's documentation for more details.
162
-
163
- See [the events and actions page](/events-and-actions) for more details.
164
-
165
- # Block loading
166
-
167
- Block loading renders a placeholder block while the block component is being fetched, or a block is waiting on a request to return before to rendering the block. This allows for a smoother user experience and reduces 'bounce' in the user interface as more blocks takes up their full width and height on the page while in a loading state.
168
-
169
- By default, Lowdefy tries to give a reasonable definition for how much space a block should take up in while loading, however this can vary depending on how the block is used. The `loading` property on blocks allows the Lowdefy developer to set a custom loading configuration for a block.
170
-
171
- ##### Custom block `loading` example:
172
-
173
- ```yaml
174
- pages:
175
- - id: page_one
176
- type: Context
177
- blocks:
178
- # ...
179
- - id: paragraph_one
180
- type: Title
181
- loading:
182
- type: SkeletonParagraph
183
- properties:
184
- lines: 1
185
- properties:
186
- content: Lorem ipsum dolor sit amet.
187
- # ...
188
- ```
189
-
190
- ## Loading placeholder types
191
-
192
- The following loading placeholder types are available:
193
-
194
- ##### Spinner
195
- A Lowdefy logo loading spinner placed at the center of the block. Often used as the full page loading spinner logo. The following `properties` apply to `Spinner`:
196
-
197
- - `barColor: string`: Color of the bars in the Lowdefy spinner logo.
198
- - `color: string`: Color of spinner logo. Default is `#f1f1f1`.
199
- - `height: number | string`: Height of the spinner block including background. Default is `100%`.
200
- - `shaded: boolean`: Masks the spinner block including background.
201
- - `size: number | string`: Size of the spinner icon. Default is `50px`.
202
-
203
- ##### IconSpinner
204
- A spinning loading icon. The following `properties` apply to `IconSpinner`:
205
-
206
- - `size: number | enum`: Size of the spinner icon. Options are `small`, `medium` and `large`. Default is `20px`.
207
-
208
- ##### Skeleton
209
- A rectangular loading skeleton to fill the full size of the block. The following `properties` apply to `Skeleton`:
210
-
211
- - `height: number | string`: Height of the skeleton block. Default is `100%`.
212
- - `width: number | string`: Width of the skeleton block. Default is `100%`.
213
-
214
- ##### SkeletonAvatar
215
- A avatar loading skeleton. The following `properties` apply to `SkeletonAvatar`:
216
-
217
- - `size: number | enum`: Size of the avatar skeleton. Options are `small`, `medium` and `large`. Default is `32px`.
218
- - `shape: enum`: Shape of the avatar skeleton. Options are `square` and `round`. Default is `round`.
219
-
220
- ##### SkeletonButton
221
- A button loading skeleton, matches the size of [`Button`](/Button) blocks. The following `properties` apply to `SkeletonButton`:
222
-
223
- - `size: enum`: Size of the button skeleton. Options are `small`, `medium` and `large`. Default is `medium`.
224
- - `shape: enum`: Shape of the button skeleton corners. Options are `square` and `round`. Default is `round`.
225
- - `height: number | string`: Height of the button skeleton. Overwrites the size setting.
226
- - `width: number | string`: Width of the button skeleton. Default is `100%`.
227
-
228
- ##### SkeletonInput
229
- A input loading skeleton, used as a placeholder for input blocks with labels. The following `properties` apply to `SkeletonInput`:
230
-
231
- - `size: enum`: Size of the input skeleton. Options are `small`, `medium` and `large`. Default is `medium`.
232
- - `labelHeight: number | string`: Height of the label part of the input skeleton.
233
- - `inputHeight: number | string`: Height of the input part of the input skeleton. Overwrites the size setting.
234
- - `labelWidth: number | string`: Width of the label part of the input skeleton. Default is `100%`.
235
- - `width: number | string`: Width of the input part of input skeleton. Default is `100%`.
236
-
237
- ##### SkeletonParagraph
238
- A paragraph loading skeleton, used as a placeholder for text intensive section. The following `properties` apply to `SkeletonParagraph`:
239
-
240
- - `lines: number`: The number of paragraph lines to render. Default is `4`.
241
- - `width: number | string`: Width of the paragraph skeleton. Default is `100%`.
242
-
243
- - _ref:
244
- path: templates/navigation_buttons.yaml
245
- vars:
246
- previous_page_title: Context and State
247
- previous_page_id: context-and-state
248
- next_page_title: Layout
249
- next_page_id: layout
package/concepts/cli.yaml DELETED
@@ -1,173 +0,0 @@
1
- # Copyright 2020-2021 Lowdefy, Inc
2
-
3
- # Licensed under the Apache License, Version 2.0 (the "License");
4
- # you may not use this file except in compliance with the License.
5
- # You may obtain a copy of the License at
6
-
7
- # http://www.apache.org/licenses/LICENSE-2.0
8
-
9
- # Unless required by applicable law or agreed to in writing, software
10
- # distributed under the License is distributed on an "AS IS" BASIS,
11
- # WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
12
- # See the License for the specific language governing permissions and
13
- # limitations under the License.
14
-
15
- _ref:
16
- path: templates/general.yaml.njk
17
- vars:
18
- pageId: cli
19
- pageTitle: The CLI
20
- section: Concepts
21
- filePath: concepts/cli.yaml
22
- content:
23
- - id: md1
24
- type: MarkdownWithCode
25
- properties:
26
- content: |
27
- The Lowdefy CLI is used to develop a Lowdefy app locally, and to build Lowdefy apps for deployment.
28
-
29
- We recommend running the CLI using `npx`, to always use the latest version:
30
-
31
- ```
32
- npx lowdefy@latest <command>
33
- ```
34
-
35
- or, to use a specific version:
36
-
37
- ```
38
- npx lowdefy@version <command>
39
- ```
40
-
41
- Alternative, you can install the CLI globally or to a npm project (with a `package.json` file) via npm or yarn.
42
-
43
- To install the CLI globally run:
44
-
45
- ```
46
- npm install lowdefy -g
47
- ```
48
-
49
- The CLI can then be run using `lowdefy` as the executable name:
50
-
51
- ```
52
- lowdefy <command>
53
- ```
54
-
55
- # CLI commands
56
-
57
- ## build
58
-
59
- The `build` command runs a Lowdefy build. The options are:
60
-
61
- - `--config-directory <config-directory>`: Change config directory. The default is the current working directory.
62
- - `--blocks-server-url <blocks-server-url>`: The URL from where Lowdefy blocks will be served. See below for more information.
63
- - `--disable-telemetry`: Disable telemetry.
64
- - `--output-directory <output-directory>`: Change the directory to which build artifacts are saved. The default is `<config-directory>/.lowdefy/build`.
65
- - `--ref-resolver <ref-resolver-function-path>`: Path to a JavaScript file containing a `_ref` resolver function to be used as the app default `_ref` resolver.
66
-
67
- ## build-netlify
68
- The `build-netlify` command creates a production build for the [Netlify](https://www.netlify.com) web hosting service. It is designed to run as the Netlify build command.
69
-
70
- We recommend setting the build command to `npx lowdefy@latest build-netlify`. The Netlify publish directory should be set to `.lowdefy/publish`, and the functions directory set to `.lowdefy/functions`.
71
-
72
- - `--config-directory <config-directory>`: Change config directory. The default is the current working directory (The config directory should rather be configured in the Netlify build settings).
73
- - `--blocks-server-url <blocks-server-url>`: The URL from where Lowdefy blocks will be served. See below for more information.
74
- - `--disable-telemetry`: Disable telemetry.
75
- - `--ref-resolver <ref-resolver-function-path>`: Path to a JavaScript file containing a `_ref` resolver function to be used as the app default `_ref` resolver.
76
-
77
- ## clean-cache
78
-
79
- The Lowdefy CLI caches block metadata, and build and server scripts in the `.lowdefy/cache` directory. These cached files can be removed using the `clean-cache` command.
80
-
81
- - `--config-directory <config-directory>`: Change config directory. The default is the current working directory.
82
- - `--disable-telemetry`: Disable telemetry.
83
-
84
- ## dev
85
-
86
- The `dev` command starts a Lowdefy development server, running locally. It can be accessed in a browser at [http://localhost:3000](http://localhost:3000). The CLI watches the file system, and rebuilds the app and reloads served pages every time a change is made to any of the files in the project directory.
87
-
88
- - `--config-directory <config-directory>`: Change config directory. The default is the current working directory.
89
- - `--blocks-server-url <blocks-server-url>`: The URL from where Lowdefy blocks will be served. See below for more information.
90
- - `--disable-telemetry`: Disable telemetry.
91
- - `--port <port>`: Change the port the server is hosted at. The default is `3000`.
92
- - `--ref-resolver <ref-resolver-function-path>`: Path to a JavaScript file containing a `_ref` resolver function to be used as the app default `_ref` resolver.
93
- - `--watch <paths...>`: A list of paths to files or directories that should be watched for changes.
94
- - `--watch-ignore <patterns...>`: A list of paths to files or directories that should be ignored by the file watcher. Globs are supported.
95
-
96
- #### Examples
97
-
98
-
99
- Run the dev server, watching a relative directory for file changes:
100
- ```txt
101
- npx lowdefy@latest dev --watch ../other-project
102
- ```
103
-
104
- Run the dev server, ignoring the public directory:
105
- ```txt
106
- npx lowdefy@latest dev --watch-ignore public/**
107
- ```
108
-
109
- # Configuration
110
-
111
- All the CLI options can either be set as command line options, or the `cli` config object in your `lowdefy.yaml` file. Options set as command line options take precedence over options set in the `lowdefy.yaml` file. The config in the `lowdefy.yaml` cannot be referenced using the `_ref` operator, but need to be set in the file itself.
112
-
113
- Options set in the `lowdefy.yaml` should be defined in camelCase. The options that can be set are:
114
- - `blocksServerUrl: string`: The URL from where Lowdefy blocks will be served. See below for more information.
115
- - `disableTelemetry: boolean`: Disable telemetry.
116
- - `outputDirectory: string`: Change the directory to which build artifacts are saved. The default is `<config-directory>/.lowdefy/build`.
117
- - `refResolver: string`: Path to a JavaScript file containing a `_ref` resolver function to be used as the app default `_ref` resolver.
118
- - `port: number`: Change the port the server is hosted at. The default is `3000`.
119
- - `watch: string[]`: A list of paths to files or directories that should be watched for changes.
120
- - `watchIgnore: string[]`: A list of paths to files or directories that should be ignored by the file watcher. Globs are supported.
121
-
122
- The `--config-directory` option cannot be set from the `lowdefy.yaml` file.
123
-
124
-
125
- # Telemetry
126
-
127
- The CLI collects usage and error information to help us fix bugs, prioritize features, and understand how Lowdefy is being used.
128
-
129
- All telemetry can be disabled by setting the `disableTelemetry` flag in `cli` config object in your `lowdefy.yaml` file (this cannot be a reference to another file), or by using the `--disable-telemetry` command line flag.:
130
-
131
- ###### `lowdefy.yaml`
132
- ```yaml
133
- lowdefy: LOWDEFY_VERSION
134
-
135
- cli:
136
- disableTelemetry: true
137
- ```
138
-
139
- We collect the following information:
140
-
141
- - The CLI version.
142
- - The Lowdefy version of your app.
143
- - A random local app id (stored locally in your project folder at `.lowdefy/cli.json`).
144
- - The CLI command used.
145
- - If the CLI is being used in the Netlify CI environment (when using the `build-netlify` command).
146
- - Your IP address.
147
- - Error messages and stack traces for any errors.
148
-
149
- # Blocks Server
150
-
151
- The Lowdefy default blocks are not included in the Lowdefy build output, but are served from a CDN, and imported into the app using webpack module federation. All the default Lowdefy blocks are hosted at:
152
-
153
- ```yaml
154
- https://blocks-cdn.lowdefy.com/v{LOWDEFY_VERSION}/
155
- ```
156
-
157
- If you wish to host your own blocks instead, this url can be configured using the `--blocks-server-url` CLI option. This URL should serve the build artifacts of the Lowdefy default block packages (located in the `dist` directory). Each blocks package should be served under a path that corresponds to the package name. For example, `@lowdefy/blocks-basic` should be served under `{BLOCK_SERVER_URL}/blocks-basic/`. The required blocks packages and server paths are:
158
-
159
- - `@lowdefy/blocks-basic` to be hosted at `{BLOCK_SERVER_URL}/blocks-basic/`.
160
- - `@lowdefy/blocks-antd` to be hosted at `{BLOCK_SERVER_URL}/blocks-antd/`.
161
- - `@lowdefy/blocks-color-selectors` to be hosted at `{BLOCK_SERVER_URL}/blocks-color-selectors/`.
162
- - `@lowdefy/blocks-markdown` to be hosted at `{BLOCK_SERVER_URL}/blocks-markdown/`.
163
- - `@lowdefy/blocks-echarts` to be hosted at `{BLOCK_SERVER_URL}/blocks-echarts/`.
164
-
165
- If you wish to run the CLI dev server, the `@lowdefy/renderer` package build artifacts (located in the `dist` directory) should also be served from `{BLOCK_SERVER_URL}/renderer/`.
166
-
167
- - _ref:
168
- path: templates/navigation_buttons.yaml
169
- vars:
170
- previous_page_title: Overview
171
- previous_page_id: overview
172
- next_page_title: Lowdefy App Schema
173
- next_page_id: lowdefy-schema
@@ -1,114 +0,0 @@
1
- # Copyright 2020-2021 Lowdefy, Inc
2
-
3
- # Licensed under the Apache License, Version 2.0 (the "License");
4
- # you may not use this file except in compliance with the License.
5
- # You may obtain a copy of the License at
6
-
7
- # http://www.apache.org/licenses/LICENSE-2.0
8
-
9
- # Unless required by applicable law or agreed to in writing, software
10
- # distributed under the License is distributed on an "AS IS" BASIS,
11
- # WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
12
- # See the License for the specific language governing permissions and
13
- # limitations under the License.
14
-
15
- _ref:
16
- path: templates/general.yaml.njk
17
- vars:
18
- pageId: connections-and-requests
19
- pageTitle: Connections and Requests
20
- section: Concepts
21
- filePath: concepts/connections-and-requests.yaml
22
- content:
23
- - id: md1
24
- type: Markdown
25
- properties:
26
- content: |
27
- ### TLDR
28
- - `connections` define links to other services, like connecting to a database. They are defined at the root of the lowdefy configuration.
29
- - `requests` use connections to make a call to the connected external services.
30
- - Use the [`_secret`](/_secret) operator to reference API keys or other secrets as required - do not code secrets into your config or commit secrets to your config source control.
31
-
32
- -----------
33
- In a Lowdefy app you can integrate with other services like API's or databases using `connections` and `requests`. Connections configure the connection settings to the service, and often contain parameters like connection strings, urls and secrets like passwords or API keys. Requests are used to interact with the connection, like inserting a data record, executing a query or calling a API end-point.
34
-
35
- - id: alert2
36
- type: Alert
37
- properties:
38
- type: warning
39
- showIcon: false
40
- message: Sensitive information like passwords or API keys are often required to use external services. The _secret operator should be used to reference these secrets, they should never be coded directly in your app, or committed to source control.
41
-
42
- - id: md2
43
- type: Markdown
44
- properties:
45
- content: |
46
- # Connections
47
-
48
- Connections are defined at the root of your Lowdefy configuration, in the `connections` array. Each connection must have an `id`, a `type`, and `properties` defining the connection. Operators in connection properties are evaluated every time a request is called.
49
-
50
- # Connection Schema
51
-
52
- The schema for a Lowdefy connection is:
53
-
54
- - `id: string`: __Required__ - A unique identifier for the connection. This is used by requests to specify which connection to use.
55
- - `type: string`: __Required__ - The connection type to be used.
56
- - `properties: object`: The settings passed to the connection. __Operators are evaluated__.
57
-
58
- ###### Connections definition example:
59
- ```yaml
60
- lowdefy: LOWDEFY_VERSION
61
- connections:
62
- - id: connection1
63
- type: ConnectionType1
64
- properties:
65
- # ...
66
- - id: connection2
67
- type: ConnectionType2
68
- properties:
69
- # ...
70
- pages:
71
- # ...
72
- ```
73
-
74
- Our goal is to make connections for everything. As the Lowdefy community grows, we will continue to develop the most requested connections. If the connection you require is not supported yet, please head over to our [new connections voting board](https://github.com/lowdefy/lowdefy/discussions/309) to request and vote for new connections.
75
-
76
- # Requests
77
-
78
- Requests can be defined on any block, and the results of the request are available to any block in the same context. Requests must have an `id`, `type`, `connectionId` field specifying the connection to use, and `properties` defining the request settings. Requests can be called using the [`Request`](/Request) action. Operators in request properties are evaluated every time a request is called.
79
-
80
- # Request Schema
81
-
82
- The schema for a Lowdefy request is:
83
-
84
- - `id: string`: __Required__ - A identifier for the request. It must be unique within the context the request is defined in.
85
- - `type: string`: __Required__ - The request type to be used. It must be a type supported by the connection type.
86
- - `connectionId: string`: __Required__ - The `id` of the connection that should be used.
87
- - `properties: object`: The settings passed to the request. __Operators are evaluated__.
88
-
89
- ###### Requests definition example:
90
- ```yaml
91
- id: block_with_requests
92
- type: BlockType
93
- requests:
94
- - id: request1
95
- type: RequestType1
96
- connectionId: connectionId1
97
- properties:
98
- # ...
99
- - id: request2
100
- type: RequestType2
101
- connectionId: connectionId2
102
- properties:
103
- # ...
104
- properties:
105
- # ...
106
- ```
107
-
108
- - _ref:
109
- path: templates/navigation_buttons.yaml
110
- vars:
111
- previous_page_title: Layout
112
- previous_page_id: layout
113
- next_page_title: Events and Actions
114
- next_page_id: events-and-actions
@@ -1,82 +0,0 @@
1
- # Copyright 2020-2021 Lowdefy, Inc
2
-
3
- # Licensed under the Apache License, Version 2.0 (the "License");
4
- # you may not use this file except in compliance with the License.
5
- # You may obtain a copy of the License at
6
-
7
- # http://www.apache.org/licenses/LICENSE-2.0
8
-
9
- # Unless required by applicable law or agreed to in writing, software
10
- # distributed under the License is distributed on an "AS IS" BASIS,
11
- # WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
12
- # See the License for the specific language governing permissions and
13
- # limitations under the License.
14
-
15
- _ref:
16
- path: templates/general.yaml.njk
17
- vars:
18
- pageId: context-and-state
19
- pageTitle: Context and State
20
- section: Concepts
21
- filePath: concepts/context-and-state.yaml
22
- content:
23
- - id: md1
24
- type: Markdown
25
- properties:
26
- content: |
27
- #### TLDR
28
- - The first block on a page must be a `context` category block.
29
- - A page can have multiple `context` blocks.
30
- - Every `context` has a single `state` object.
31
- - All input blocks write their value to `state`, with the their `id` as the key in the `state` object.
32
- - Input blocks which are not visible are removed from `state`.
33
- - The `SetState` action can also modify the `state` object.
34
-
35
- -------
36
-
37
- A Lowdefy block with category `context` provides the environment for a part of a Lowdefy app to run in. More than one context can be placed on a page, but generally only one is needed. The first block on a page must be a `context` category block.
38
-
39
- The standard page blocks like [`PageHeaderMenu`](/PageHeaderMenu) or [`PageSiderMenu`](/PageSiderMenu) are all `context` category blocks, and the [`Context`](/Context) block is a simple container that also provides a context.
40
-
41
- Each context provides encapsulation to the blocks inside it. It has it's own `state` object as well as requests.
42
-
43
- Every `input` category block inside the context will have a value in the `state` object, with the their `id` as the key in the `state` object, unless the block is not visible, in which case the input value is removed the state object.
44
-
45
- The only other way to modify the `state` object is to use a `SetState` action. See [`SetState`](/SetState) and [`events-and-actions`](/events-and-actions) for more details.
46
-
47
- Contexts remain even as users navigate to new pages, so if a user returns to a page, the state as they left it will remain.
48
-
49
- # Url queries
50
-
51
- A new context is created for each distinct URL query parameters seen by the app. This means that if a page is open with two different URL queries, two different contexts, with separate `state` objects will be created.
52
-
53
- # Context IDs
54
-
55
- Each context created has a identifier with the following structure:
56
- ```
57
- {pageId}:{blockId}:{JSON stringified urlQuery object}
58
- ```
59
-
60
- # Context data objects
61
-
62
- A Lowdefy `context` makes some additional data object accessible via operators. These include:
63
-
64
- - [`_global`](/_global): The `global` object is a single app level data object defined in the Lowdefy [config root](/lowdefy-schema). This object is the same for every `context`, it is also passed between the client and server. If the [`SetGlobal`](/SetGlobal) action is called, it is not consistent between clients, like different users, or a single user with multiple tabs open.
65
-
66
- - [`_state`](/_state): A `state` object is unique to a `context` and every [`input` block](/blocks) maintains a value in it's parent `state` object. This `state` object is passed to the server when requests are called. The [`SetState`](/SetState) action can be used to modify the value of a `state` object in the same `context` from which `SetState` is called.
67
-
68
- - [`_url_query`](/_url_query): The `urlQuery` object is used to access variables set in the url. Url query parameters can be set using the `urlQuery` field in the [`Link`](/Link) action. It can be useful to create sharable links containing some additional information other than the page route. For example setting a document id in the url so that the document can be retrieved when the link is opened during the page [`onEnter`](/events-and-actions) event. __Note that any variables set to `urlQuery` will be publicly visible__.
69
-
70
- - [`_input`](/_input): The `input` object is unique to a page, and works similar to the `urlQuery` object. The `input` object is used to pass information between page transitions. This variable set to the `input` object are not written to the url, so they are not visible publicly but also cannot be used to share the data in a link since a `input` object is only consistent between one `context` and the next to which it links. A `input` object is set to the `input` field of the [`Link`](/Link) action when linking from one page `context` to the next.
71
-
72
- - [`_media`](/_media): The `media` object contains some information about the client screen size etc. This is useful in order to add additional responsive logic to a page.
73
-
74
- - [`_user`](/user-object): The `user` object contains the data in the user idToken if OpenID Connect authentication is configured and a user is logged in.
75
-
76
- - _ref:
77
- path: templates/navigation_buttons.yaml
78
- vars:
79
- previous_page_title: Lowdefy Schema
80
- previous_page_id: lowdefy-schema
81
- next_page_title: Blocks
82
- next_page_id: blocks