A Mix Task for generating a JSON file from a directory of components

This Mix Task helps you generate a JSON file from the files in a directory, enabling you to use it with mix mishka.ui.add or share it in the community version.

Keep in mind that for each component, you must have both .eex and .exs files according to the documentation of the Mishka Chelekom library. Otherwise, you will need to create the necessary files manually. It’s recommended to review the Core components and follow their structure as a guide.

If you prefer to perform the process manually, simply add the relevant option to your command to generate a template file. You can then customize it based on your specific requirements.

Note:

Use --base64 option to convert the file content to Base64 if you're using special Erlang characters that do not retain their original form when converted back to the original file.

Note:

It is important to note that to place each file in its designated section and specify its type, you must use the following naming convention:

For example, if your file is a component, you need to have two files:

• component_something.exs
• component_something.eex

Similarly, for other file types like preset and template, you should follow the same naming pattern as above. For instance:

• template_something.exs
• template_something.eex

All files within the directory do not need to have the same name. However, they must start with the section name where they are intended to be placed, such as component, preset, or template. Additionally, each file must have both the exs and eex formats.

Note: Since JavaScript files do not require configuration, you only need to place the file in the directory. For example: something.js

What Should the Configuration of Each Component Look Like?

If you take a look at the example configuration below, you'll notice that the component file name matches the key name in the list, which also matches the configuration name. This ensures consistency and makes it easier to work with the component configuration.

File name: component_accordion.eex and component_accordion.exs

[
  component_accordion: [
    name: "component_accordion",
    args: [...]
    ...
  ]
]

Note: you can name this like preset_accordion or template_accordion too.

Example

mix mishka.ui.export --example arg

Options

• --base64 or -b - Converts component content to Base64
• --name or -n - Defines a name for JSON file, if it is not set default is template.json
• --org or -o - It is only for structuring the file and has no effect on your export.
• --template or -t - Creates a default JSON file for manual processing steps.