{"id":13769585,"url":"https://github.com/EmersonMatias/title-editorjs","last_synced_at":"2025-05-11T02:32:58.456Z","repository":{"id":207986610,"uuid":"720550902","full_name":"EmersonMatias/title-editorjs","owner":"EmersonMatias","description":null,"archived":false,"fork":false,"pushed_at":"2023-11-18T22:27:34.000Z","size":16,"stargazers_count":4,"open_issues_count":0,"forks_count":1,"subscribers_count":1,"default_branch":"main","last_synced_at":"2024-07-11T19:36:38.909Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/EmersonMatias.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null}},"created_at":"2023-11-18T20:33:22.000Z","updated_at":"2024-05-27T19:08:10.000Z","dependencies_parsed_at":"2023-11-18T22:46:57.825Z","dependency_job_id":"34e3b034-e1e9-4901-a755-ee4144d8634a","html_url":"https://github.com/EmersonMatias/title-editorjs","commit_stats":null,"previous_names":["emersonmatias/title-editorjs"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/EmersonMatias%2Ftitle-editorjs","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/EmersonMatias%2Ftitle-editorjs/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/EmersonMatias%2Ftitle-editorjs/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/EmersonMatias%2Ftitle-editorjs/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/EmersonMatias","download_url":"https://codeload.github.com/EmersonMatias/title-editorjs/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":213832237,"owners_count":15644963,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-08-03T17:00:28.939Z","updated_at":"2024-08-03T17:02:19.672Z","avatar_url":"https://github.com/EmersonMatias.png","language":"TypeScript","funding_links":[],"categories":["Tools"],"sub_categories":["Block Tools"],"readme":"# Title Tool - Editor.js (React-TS)\n\nProvides Title (headings) Blocks for the [Editor.js](https://github.com/codex-team/editor.js). It is compatible with react and typescript, without causing typing errors.\n\n## Installation\nGet the package\n\n```shell\nnpm i title-editorjs\n```\n\n## Usage\nInclude module at your application\n\n```javascript\nimport Title from \"title-editorjs\";\n```\n\nAdd a new Tool to the `tools` property of the Editor.js initial config.\n\n```javascript\nconst editor = EditorJS({\n  ...\n\n  tools: {\n    ...\n    title: Title\n  },\n\n  ...\n});\n```\n\n## Tool's settings\n| Setting | Description                             \n|------|-----------------------------------------\n|H1   | Transform the title into an h1 header   \n|H2   | Transform the title into an h2 header    \n|H3   | Transform the title into an h3 header   \n|H4   | Transform the title into an h4 header    \n|H5   | Transform the title into an h5 header    \n|H6| Transform the title into an h6 header   \n|\u003cimg src=\"data:image/svg+xml,%3Csvg width='10' height='10' viewBox='0 0 50 50' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='25' cy='25' r='20' fill='blue' /%3E%3C/svg%3E\" alt=\"Ícone SVG\" /\u003e  Blue  | Change the title color to blue   \n|\u003cimg src=\"data:image/svg+xml,%3Csvg width='10' height='10' viewBox='0 0 50 50' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='25' cy='25' r='20' fill='pink' /%3E%3C/svg%3E\" alt=\"Ícone SVG\" /\u003e Pink  | Change the title color to pink    \n|\u003cimg src=\"data:image/svg+xml,%3Csvg width='10' height='10' viewBox='0 0 50 50' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='25' cy='25' r='20' fill='green' /%3E%3C/svg%3E\" alt=\"Ícone SVG\" /\u003e Green| Change the title color to green   \n|\u003cimg src=\"data:image/svg+xml,%3Csvg width='10' height='10' viewBox='0 0 50 50' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='25' cy='25' r='20' fill='purple' /%3E%3C/svg%3E\" alt=\"Ícone SVG\" /\u003e Purple  | Change the title color to purple    \n|\u003cimg src=\"data:image/svg+xml,%3Csvg width='10' height='10' viewBox='0 0 50 50' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='25' cy='25' r='20' fill='orange' /%3E%3C/svg%3E\" alt=\"Ícone SVG\" /\u003e Orange  | Change the title color to orange   \n|\u003cimg src=\"data:image/svg+xml,%3Csvg width='10' height='10' viewBox='0 0 50 50' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='25' cy='25' r='20' fill='black' /%3E%3C/svg%3E\" alt=\"Ícone SVG\" /\u003e Black   |Change the title color to black   \n|\u003cimg src=\"data:image/svg+xml,%3Csvg width='10' height='10' viewBox='0 0 50 50' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='25' cy='25' r='20' fill='yellow' /%3E%3C/svg%3E\" alt=\"Ícone SVG\" /\u003e  Yellow | Change the title color to yellow \n|\u003cimg src=\"data:image/svg+xml,%3Csvg width='10' height='10' viewBox='0 0 50 50' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='25' cy='25' r='20' fill='red' /%3E%3C/svg%3E\" alt=\"Ícone SVG\" /\u003e Red  | Change the title color to red \n|Text-Align-Center   |Change text alignment to center \n|Text-Align-Right   |Change text alignment to right \n|Text-Align-Left   |Change text alignment to left \n\n## Config Params\nFor now the package doesn´t have any configuration parameters 😔. But it's coming...😌\n\n ## Output data\n\n | Field | Type     | Description                                      |\n| ----- | -------- | ------------------------------------------------ |\n| text  | `string` | titles's text                                    |\n| titleType | `string` | type of title: H1, H2 ... H6 |\n| color | `string or undefined` | color of the title |\n| alignText | `string or undefined` | align of the title |\n\n ```json\n{\n    \"id\": \"9V7e_m3ao4\",\n    \"type\": \"title\",\n    \"data\": {\n        \"text\": \"H1\",\n        \"color\": \"Red\",\n        \"alignText\": \"Text-Align-Center\",\n        \"titleType\": \"H1\"\n    }\n}\n```\n\n\n### And...\n🌠🌠🌠 If the package was useful to you give it a star. 🌠🌠🌠 \n\n💁💁🏾💁🏼 Feel free to propose improvements. 💁🏾💁🏼💁🏿\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FEmersonMatias%2Ftitle-editorjs","html_url":"https://awesome.ecosyste.ms/projects/github.com%2FEmersonMatias%2Ftitle-editorjs","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FEmersonMatias%2Ftitle-editorjs/lists"}