@saltcorn/markup 0.6.1-beta.2 → 0.6.2-beta.1

package/helpers.js

@@ -17,16 +17,16 @@ const {
 
 /**
  * checks if x is defined
- * @param {*} x 
+ * @param {*} x
  * @returns {boolean}
  */
 const isdef = (x) => typeof x !== "undefined";
 
 /**
- * @param {object|string} v 
- * @param {object} hdr 
- * @param {boolean} force_required 
- * @param {string} neutral_label 
+ * @param {object|string} v
+ * @param {object} hdr
+ * @param {boolean} force_required
+ * @param {string} neutral_label
  * @returns {string}
  */
 const select_options = (v, hdr, force_required, neutral_label = "") => {
@@ -56,7 +56,7 @@ const select_options = (v, hdr, force_required, neutral_label = "") => {
 };
 
 /**
- * 
+ *
  * @param {object} opts
  * @param {string} opts.name
  * @param {object} [opts.options]
@@ -66,7 +66,15 @@ const select_options = (v, hdr, force_required, neutral_label = "") => {
  * @param {...*} opts.rest
  * @returns {string}
  */
-const radio_group = ({ name, options, value, inline, form_name, ...rest }) =>
+const radio_group = ({
+  name,
+  options,
+  value,
+  inline,
+  form_name,
+  onChange,
+  ...rest
+}) =>
   div(
     (options || [])
       .filter((o) => (typeof o === "string" ? o : o.value))
@@ -79,6 +87,7 @@ const radio_group = ({ name, options, value, inline, form_name, ...rest }) =>
             class: ["form-check-input", rest.class],
             type: "radio",
             name,
+            onChange,
             "data-fieldname": form_name,
             id,
             value: text_attr(myvalue),
@@ -93,6 +102,44 @@ const radio_group = ({ name, options, value, inline, form_name, ...rest }) =>
       .join("")
   );
 
+const checkbox_group = ({
+  name,
+  options,
+  value,
+  inline,
+  form_name,
+  onChange,
+  ...rest
+}) =>
+  div(
+    (options || [])
+      .filter((o) => (typeof o === "string" ? o : o.value))
+      .map((o, ix) => {
+        const myvalue = typeof o === "string" ? o : o.value;
+        const id = `input${text_attr(name)}${ix}`;
+        return div(
+          { class: ["form-check", inline && "form-check-inline"] },
+          input({
+            class: ["form-check-input", rest.class],
+            type: "checkbox",
+            name,
+            onChange: `check_state_field(this)`,
+            "data-fieldname": form_name,
+            id,
+            value: text_attr(myvalue),
+            checked: Array.isArray(value)
+              ? value.includes(myvalue)
+              : myvalue === value,
+          }),
+          label(
+            { class: "form-check-label", for: id },
+            typeof o === "string" ? o : o.label
+          )
+        );
+      })
+      .join("")
+  );
+
 /**
  * @param {object} opts
  * @param {number} opts.current_page
@@ -143,9 +190,9 @@ const pagination = ({
 };
 
 /**
- * @param {string} name 
- * @param {object} v 
- * @param {object} param2 
+ * @param {string} name
+ * @param {object} v
+ * @param {object} param2
  * @returns {string}
  */
 const search_bar = (
@@ -217,4 +264,5 @@ module.exports = {
   search_bar,
   pagination,
   radio_group,
+  checkbox_group,
 };

package/index.js

@@ -2,6 +2,22 @@
  * @category saltcorn-markup
  * @module saltcorn-markup/index
  */
+
+/**
+ * All files in the saltcorn-markup package.
+ * @namespace saltcorn-markup_overview
+ * @property {module:builder} builder
+ * @property {module:emergency_layout} emergency_layout
+ * @property {module:form} from
+ * @property {module:helpers} helpers
+ * @property {module:layout_utils} layout_utils
+ * @property {module:layout} layout
+ * @property {module:mktag} mktag
+ * @property {module:table} table
+ * @property {module:tabs} tabs
+ * @category saltcorn-markup
+ */
+
 const renderForm = require("./form");
 const renderBuilder = require("./builder");
 const mkTable = require("./table");

package/layout.js

@@ -34,7 +34,7 @@ const { search_bar_form, search_bar } = require("./helpers");
 const couldHaveAlerts = (alerts) => alerts || Array.isArray(alerts);
 
 /**
- * @param {string|object} body 
+ * @param {string|object} body
  * @param {object[]} [alerts]
  * @returns {object}
  */
@@ -62,9 +62,9 @@ const makeSegments = (body, alerts) => {
 };
 
 /**
- * 
- * @param {object} segment 
- * @param {string} inner 
+ *
+ * @param {object} segment
+ * @param {string} inner
  * @returns {div|span|string}
  */
 const applyTextStyle = (segment, inner) => {
@@ -97,10 +97,13 @@ const applyTextStyle = (segment, inner) => {
  * @param {string[]} opts.titles
  * @param {string} opts.tabsStyle
  * @param {*} opts.ntabs
- * @param {function} go 
+ * @param {function} go
  * @returns {ul_div}
  */
-const renderTabs = ({ contents, titles, tabsStyle, ntabs }, go) => {
+const renderTabs = (
+  { contents, titles, tabsStyle, ntabs, independent },
+  go
+) => {
   const rndid = `tab${Math.floor(Math.random() * 16777215).toString(16)}`;
   if (tabsStyle === "Accordion")
     return div(
@@ -130,7 +133,7 @@ const renderTabs = ({ contents, titles, tabsStyle, ntabs }, go) => {
               class: ["collapse", ix === 0 && "show"],
               id: `${rndid}tab${ix}`,
               "aria-labelledby": `${rndid}head${ix}`,
-              "data-parent": `#${rndid}top`,
+              "data-parent": independent ? undefined : `#${rndid}top`,
             },
             div({ class: "card-body" }, go(t, false, ix))
           )

package/package.json

@@ -1,11 +1,13 @@
 {
   "name": "@saltcorn/markup",
-  "version": "0.6.1-beta.2",
+  "version": "0.6.2-beta.1",
   "description": "Markup for Saltcorn, open-source no-code platform",
   "homepage": "https://saltcorn.com",
   "main": "index.js",
   "scripts": {
-    "test": "jest"
+    "test": "jest",
+    "tsc": "echo \"Error: no TypeScript support yet\"",
+    "clean": "echo \"Error: no TypeScript support yet\""
   },
   "author": "Tom Nielsen",
   "license": "MIT",