cronapp-framework-mobile-js 1.0.4

package/components/crn-option-button.components.json

@@ -0,0 +1,83 @@
+{
+  "name": "crn-option-button",
+  "text": "Option Button",
+  "pallete": false,
+  "class": "adjust-icon mdi mdi-stop",
+  "template": "<ion-option-button class=\"button-default button\"><i class=\"icon ion-home\">home</i></ion-option-button>",
+  "groupedChildren": [
+    {
+      "text_pt_BR": "Ícone",
+      "text_en_US": "Icon",
+      "selector": "i"
+    }
+  ],
+  "attributesForPreview": [
+    {
+      "name": "xattr-theme",
+      "type": "options",
+      "target": "class",
+      "values": [
+        {
+          "key": "default",
+          "value_pt_BR": "Padrão do tema",
+          "value_en_US": "Default theme",
+          "color": "--btnDefault"
+        },
+        {
+          "key": "button-positive",
+          "value_pt_BR": "Secundário",
+          "value_en_US": "Secondary",
+          "color": "--btnPrimary"
+        },
+        {
+          "key": "button-balanced",
+          "value_pt_BR": "Sucesso",
+          "value_en_US": "Success",
+          "color": "--btnSuccess"
+        },
+        {
+          "key": "button-calm",
+          "value_pt_BR": "Informação",
+          "value_en_US": "Info",
+          "color": "--btnCalm"
+        },
+        {
+          "key": "button-energized",
+          "value_pt_BR": "Aviso",
+          "value_en_US": "Warning",
+          "color": "--btnWarning"
+        },
+        {
+          "key": "button-assertive",
+          "value_pt_BR": "Perigo",
+          "value_en_US": "Danger",
+          "color": "--btnDanger"
+        },
+        {
+          "key": "button-light",
+          "value_pt_BR": "Claro",
+          "value_en_US": "Light",
+          "color": "--btnLight"
+        },
+        {
+          "key": "button-stable",
+          "value_pt_BR": "Estável",
+          "value_en_US": "Stable",
+          "color": "--btnStable"
+        },
+        {
+          "key": "button-royal",
+          "value_pt_BR": "Real",
+          "value_en_US": "Royal",
+          "color": "--btnRoyal"
+        },
+        {
+          "key": "button-dark",
+          "value_pt_BR": "Escuro",
+          "value_en_US": "Dark",
+          "color": "--btnDark"
+        }
+      ]
+    }
+  ]
+}

package/components/crn-paragraph.components.json

@@ -0,0 +1,120 @@
+{
+  "name": "crn-paragraph",
+  "text_pt_BR": "Parágrafo",
+  "text_en_US": "Paragraph",
+  "image": "/node_modules/cronapp-framework-mobile-js/img/cron-icon/crn-paragraph.svg",
+  "description": "Estrutura para inserir texto longo",
+  "description_en_US": "Structure for inserting long text",
+  "category": [
+    "TEXTS", "LAYOUTS"
+  ],
+  "wrapper": false,
+  "template": "<p xattr-position=\"text-center\" style=\"font-size: var(--textNormalSize, 14px);\" class=\"text-center\" xattr-type=\"font-size: var(--textNormalSize, 14px);\">Some friendly Paragraph</p>",
+  "properties": {
+    "id": {
+      "order": 1
+    },
+    "class": {
+      "order": 9999
+    },
+    "xattr-type": {
+      "displayName_pt_BR": "Tamanho da letra",
+      "displayName_en_US": "Font size",
+      "order": 3
+    },
+    "xattr-position": {
+      "displayName_pt_BR": "Posição do texto",
+      "displayName_en_US": "Text position"
+    },
+    "ng-click": {
+      "removable": true,
+      "type": "event"
+    },
+    "on-hold": {
+      "removable": true,
+      "type": "event"
+    },
+    "on-double-tap": {
+      "removable": true,
+      "type": "event"
+    },
+    "on-tap": {
+      "removable": true,
+      "type": "event"
+    },
+    "on-swipe": {
+      "removable": true,
+      "type": "event"
+    },
+    "on-drag": {
+      "removable": true,
+      "type": "event"
+    }
+  },
+  "attributesForPreview": [
+    {
+      "name": "xattr-position",
+      "type": "btngroup",
+      "target": "class",
+      "values": [
+        {
+          "key": "text-left",
+          "value_pt_BR": "Esquerda",
+          "value_en_US": "Left",
+          "icon": "mdi mdi-ray-start"
+        },
+        {
+          "key": "text-center",
+          "value_pt_BR": "Centro",
+          "value_en_US": "Center",
+          "icon": "mdi mdi-ray-vertex"
+        },
+        {
+          "key": "text-right",
+          "value_pt_BR": "Direita",
+          "value_en_US": "Right",
+          "icon": "mdi mdi-ray-end"
+        }
+      ]
+    },
+    {
+      "name": "xattr-type",
+      "type": "options",
+      "target": "style",
+      "values": [
+        {
+          "key": "font-size: var(--textSmallSize, 12px);",
+          "value_pt_BR": "Pequena",
+          "value_en_US": "Small"
+        },
+        {
+          "key": "font-size: var(--textNormalSize, 14px);",
+          "value_pt_BR": "Padrão",
+          "value_en_US": "Default"
+        },
+        {
+          "key": "font-size: var(--textMediumSize, 16px);",
+          "value_pt_BR": "Média",
+          "value_en_US": "Medium"
+        },
+        {
+          "key": "font-size: var(--textBigSize, 18px);",
+          "value_pt_BR": "Grande",
+          "value_en_US": "Big"
+        },
+        {
+          "key": "font-size: var(--textExtraBigSize, 23px);",
+          "value_pt_BR": "Extra grande",
+          "value_en_US": "Extra big"
+        }
+      ]
+    }
+  ],
+  "childrenProperties": [
+    {
+      "name": "ng-mouseover",
+      "selector": "p",
+      "type": "event"
+    }
+  ]
+}

package/components/crn-radio.components.json

@@ -0,0 +1,90 @@
+{
+  "name": "crn-radio",
+  "text_pt_BR": "Lista de Opção",
+  "text_en_US": "Radio Group",
+  "image": "/node_modules/cronapp-framework-mobile-js/img/cron-icon/crn-radio.svg",
+  "description": "Caixa de seleção redonda com texto",
+  "description_en_US": "Round selection box with text",
+  "category": [
+    "LISTS"
+  ],
+  "wrapper": false,
+  "templateURL": "src/main/mobileapp/www/node_modules/cronapp-framework-mobile-js/dist/components/templates/radiogroup.template.html",
+  "properties": {
+    "id": {
+      "order": 2
+    },
+    "class": {
+      "order": 9999
+    },
+    "ng-model": {
+      "onSave": "javascript:function() { var result = arguments[0]; if (result.indexOf('.') == -1 && result.trim().length > 0 ) { result = 'vars.'+result;  }  return result; }",
+      "onDisplay": "javascript:function() { return arguments[0].replace('vars.',''); }",
+      "order": 1,
+      "mandatory": true
+    }
+  },
+  "handleRules": {
+    "canIncrement": true,
+    "rules": [
+      {
+        "sourceHTML": "<div data-component=\"crn-radioOption\"><label class=\"item item-radio\" crn-value=\"\" value=\"${RANDOM}\"><input aria-label\"Aria Label Text\" type=\"radio\" name=\"group\"><div class=\"radio-content\"><div class=\"item-content\"> Choose Other </div><i class=\"radio-icon ion-checkmark\"></i></div></label></div>",
+        "targetSelector": ":self"
+      }
+    ]
+  },
+  "styles": [
+    {
+      "selector": "div#{id} .item-divider",
+      "text_pt_BR": "Título",
+      "text_en_US": "Title"
+    },
+    {
+      "selector": "div#{id} .item-content",
+      "text_pt_BR": "Opção",
+      "text_en_US": "Option"
+    },
+    {
+      "selector": "div#{id} .item-radio input:checked + .radio-content .item-content",
+      "text_pt_BR": "Item selecionado",
+      "text_en_US": "Selected item"
+    },
+    {
+      "selector": "div#{id} .ion-checkmark",
+      "text_pt_BR": "Marcador",
+      "text_en_US": "Checkmark"
+    }
+  ],
+  "childrenProperties": [
+    {
+      "name": "ng-click",
+      "selector": "label",
+      "type": "event"
+    },
+    {
+      "name": "on-tap",
+      "selector": "label",
+      "type": "event"
+    },
+    {
+      "name": "on-double-tap",
+      "selector": "label",
+      "type": "event"
+    },
+    {
+      "name": "on-hold",
+      "selector": "label",
+      "type": "event"
+    },
+    {
+      "name": "on-drag",
+      "selector": "label",
+      "type": "event"
+    },
+    {
+      "name": "on-swipe",
+      "selector": "label",
+      "type": "event"
+    }
+  ]
+}

package/components/crn-radioOption.components.json

@@ -0,0 +1,23 @@
+{
+  "name": "crn-radioOption",
+  "text_pt_BR": "Item da lista de opções",
+  "text_en_US": "Options list item",
+  "pallete": false,
+  "childrenProperties": [
+    {
+      "name": "value",
+      "selector": "label[value]",
+      "displayName_pt_BR": "Valor do campo",
+      "displayName_en_US": "Field value",
+      "type": "text"
+    },
+    {
+      "name": "content",
+      "selector": "div.item-content",
+      "displayName_pt_BR": "Valor de exibição",
+      "displayName_en_US": "Text value",
+      "type": "text",
+      "onDisplay": "javascript:function() { return arguments[0].trim(); }"
+    }
+  ]
+}

package/components/crn-range.components.json

@@ -0,0 +1,310 @@
+{
+  "name": "crn-range",
+  "text_pt_BR": "Alcance",
+  "text_en_US": "Range",
+  "image": "/node_modules/cronapp-framework-mobile-js/img/cron-icon/crn-range.svg",
+  "description": "Campo para escolha de valores através de uma sequência pré-estabelecida",
+  "description_en_US": "Field for choosing values through a pre-established sequence",
+  "category": [
+    "INPUTS", "FORMS"
+  ],
+  "wrapper": false,
+  "templateURL": "src/main/mobileapp/www/node_modules/cronapp-framework-mobile-js/dist/components/templates/range.template.html",
+  "properties": {
+    "id": {
+      "order": 1
+    },
+    "class": {
+      "order": 9999
+    },
+    "icon-theme": {
+      "displayName_pt_BR": "Cor do ícone",
+      "displayName_en_US": "Icon color"
+    }
+  },
+  "attributesForPreview": [
+    {
+      "name": "icon-theme",
+      "type": "options",
+      "target": "class",
+      "values": [
+        {
+          "key": "color-default",
+          "value_pt_BR": "Padrão do tema",
+          "value_en_US": "Default theme",
+          "color" : "--colorDefault"
+        },
+        {
+          "key": "color-positive",
+          "value_pt_BR": "Secundário",
+          "value_en_US": "Secondary",
+          "color" : "--colorPrimary"
+        },
+        {
+          "key": "color-balanced",
+          "value_pt_BR": "Sucesso",
+          "value_en_US": "Success",
+          "color" : "--colorSuccess"
+        },
+        {
+          "key": "color-calm",
+          "value_pt_BR": "Informação",
+          "value_en_US": "Info",
+          "color" : "--colorCalm"
+        },
+        {
+          "key": "color-energized",
+          "value_pt_BR": "Aviso",
+          "value_en_US": "Warning",
+          "color" : "--colorWarning"
+        },
+        {
+          "key": "color-assertive",
+          "value_pt_BR": "Perigo",
+          "value_en_US": "Danger",
+          "color" : "--colorDanger"
+        },
+        {
+          "key": "color-light",
+          "value_pt_BR": "Claro",
+          "value_en_US": "Light",
+          "color" : "--colorLight"
+        },
+        {
+          "key": "color-stable",
+          "value_pt_BR": "Estável",
+          "value_en_US": "Stable",
+          "color" : "--colorStable"
+        },
+        {
+          "key": "color-royal",
+          "value_pt_BR": "Real",
+          "value_en_US": "Royal",
+          "color" : "--colorRoyal"
+        },
+        {
+          "key": "color-dark",
+          "value_pt_BR": "Escuro",
+          "value_en_US": "Dark",
+          "color" : "--colorDark"
+        },
+        {
+          "key": "color-white",
+          "value_pt_BR": "Branco",
+          "value_en_US": "White",
+          "color": "#fff"
+        },
+        {
+          "key": "color-gray",
+          "value_pt_BR": "Cinza",
+          "value_en_US": "Gray",
+          "color": "#333"
+        },
+        {
+          "key": "color-black",
+          "value_pt_BR": "Preto",
+          "value_en_US": "Black",
+          "color": "#000"
+        },
+        {
+          "key": "color-blue",
+          "value_pt_BR": "Azul",
+          "value_en_US": "Blue",
+          "color": "#0247FE"
+        },
+        {
+          "key": "color-light-blue",
+          "value_pt_BR": "Azul claro",
+          "value_en_US": "Light blue",
+          "color": "#85A5FF"
+        },
+        {
+          "key": "color-dark-blue",
+          "value_pt_BR": "Azul escuro",
+          "value_en_US": "Dark blue",
+          "color": "#00217A"
+        },
+        {
+          "key": "color-purple",
+          "value_pt_BR": "Roxo",
+          "value_en_US": "Purple",
+          "color": "#3D01A4"
+        },
+        {
+          "key": "color-light-purple",
+          "value_pt_BR": "Roxo claro",
+          "value_en_US": "Light purple",
+          "color": "#B285FF"
+        },
+        {
+          "key": "color-dark-purple",
+          "value_pt_BR": "Roxo escuro",
+          "value_en_US": "Dark purple",
+          "color": "#2D007A"
+        },
+        {
+          "key": "color-red",
+          "value_pt_BR": "Vermelho",
+          "value_en_US": "Red",
+          "color": "#FE2712"
+        },
+        {
+          "key": "color-light-red",
+          "value_pt_BR": "Vermelho claro",
+          "value_en_US": "Light red",
+          "color": "#FE8F84"
+        },
+        {
+          "key": "color-dark-red",
+          "value_pt_BR": "Vermelho escuro",
+          "value_en_US": "Dark red",
+          "color": "#7A0B00"
+        },
+        {
+          "key": "color-orange",
+          "value_pt_BR": "Laranja",
+          "value_en_US": "Orange",
+          "color": "#FB9B02"
+        },
+        {
+          "key": "color-light-orange",
+          "value_pt_BR": "Laranja claro",
+          "value_en_US": "Light orange",
+          "color": "#FFD085"
+        },
+        {
+          "key": "color-dark-orange",
+          "value_pt_BR": "Laranja escuro",
+          "value_en_US": "Dark orange",
+          "color": "#7A4B00"
+        },
+        {
+          "key": "color-yellow",
+          "value_pt_BR": "Amarelo",
+          "value_en_US": "Yellow",
+          "color": "#FFFF33"
+        },
+        {
+          "key": "color-light-yellow",
+          "value_pt_BR": "Amarelo claro",
+          "value_en_US": "Light yellow",
+          "color": "#FFFF85"
+        },
+        {
+          "key": "color-dark-yellow",
+          "value_pt_BR": "Amarelo escuro",
+          "value_en_US": "Dark yellow",
+          "color": "#FFFF33"
+        },
+        {
+          "key": "color-green",
+          "value_pt_BR": "Verde",
+          "value_en_US": "Green",
+          "color": "#66B032"
+        },
+        {
+          "key": "color-light-green",
+          "value_pt_BR": "Verde claro",
+          "value_en_US": "Light green",
+          "color": "#B7FF85"
+        },
+        {
+          "key": "color-dark-green",
+          "value_pt_BR": "Verde escuro",
+          "value_en_US": "Dark green",
+          "color": "#337A00"
+        }
+      ]
+    }
+  ],
+  "childrenProperties": [
+    {
+      "name": "class",
+      "selector": "i:first",
+      "type": "icon",
+      "displayName_pt_BR": "Ícone inicial/esquerda",
+      "displayName_en_US": "First/left icon",
+      "order": 1
+    },
+    {
+      "name": "class",
+      "selector": "i:last",
+      "type": "icon",
+      "displayName_pt_BR": "Ícone final/direita",
+      "displayName_en_US": "Last/right icon",
+      "order": 2
+    },
+    {
+      "name": "icon-theme",
+      "selector": "i",
+      "order": 2
+    },
+    {
+      "name": "ng-model",
+      "selector": "input",
+      "type": "text",
+      "mandatory": true
+    },
+    {
+      "name": "max",
+      "selector": "input",
+      "displayName_pt_BR": "Valor máximo",
+      "displayName_en_US": "Maximum value",
+      "type": "text"
+    },
+    {
+      "name": "min",
+      "selector": "input",
+      "displayName_pt_BR": "Valor minímo",
+      "displayName_en_US": "Minimum value",
+      "type": "text"
+    },
+    {
+      "name": "on-drag",
+      "selector": "input",
+      "type": "event"
+    },
+    {
+      "name": "on-hold",
+      "selector": "input",
+      "type": "event"
+    },
+    {
+      "name": "ng-click",
+      "selector": "input",
+      "type": "event"
+    },
+    {
+      "name": "on-double-tap",
+      "selector": "input",
+      "type": "event"
+    },
+    {
+      "name": "on-tap",
+      "selector": "input",
+      "type": "event"
+    },
+    {
+      "name": "ng-change",
+      "selector": "input",
+      "type": "event"
+    }
+  ],
+  "styles": [
+    {
+      "selector": "div#{id}",
+      "text_pt_BR": "Plano de fundo",
+      "text_en_US": "Background"
+    },
+    {
+      "selector": "div#{id} i.left-icon",
+      "text_pt_BR": "Ícone inicial/esquerda",
+      "text_en_US": "First/left icon"
+    },
+    {
+      "selector": "div#{id} i.right-icon",
+      "text_pt_BR": "Ícone final/direita",
+      "text_en_US": "Last/right icon"
+    }
+  ]
+}