{"id":18352395,"url":"https://github.com/cleveroad/cr_mentions","last_synced_at":"2025-04-10T00:38:21.676Z","repository":{"id":82112922,"uuid":"578078429","full_name":"Cleveroad/cr_mentions","owner":"Cleveroad","description":null,"archived":false,"fork":false,"pushed_at":"2023-03-29T10:54:40.000Z","size":1245,"stargazers_count":3,"open_issues_count":2,"forks_count":1,"subscribers_count":3,"default_branch":"main","last_synced_at":"2025-04-10T00:38:17.276Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"Dart","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Cleveroad.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2022-12-14T07:52:23.000Z","updated_at":"2025-01-06T08:36:15.000Z","dependencies_parsed_at":"2023-04-30T17:21:35.548Z","dependency_job_id":null,"html_url":"https://github.com/Cleveroad/cr_mentions","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Cleveroad%2Fcr_mentions","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Cleveroad%2Fcr_mentions/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Cleveroad%2Fcr_mentions/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Cleveroad%2Fcr_mentions/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Cleveroad","download_url":"https://codeload.github.com/Cleveroad/cr_mentions/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248138008,"owners_count":21053775,"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-11-05T21:35:49.879Z","updated_at":"2025-04-10T00:38:21.650Z","avatar_url":"https://github.com/Cleveroad.png","language":"Dart","funding_links":[],"categories":[],"sub_categories":[],"readme":"# cr_mentions\n\n\u003cimg src=\"https://raw.githubusercontent.com/Cleveroad/cr_mentions/master/screenshots/plugin_banner.png\" width=\"100%\"\u003e\n\n## Table of contents\n\n- [Screenshots](#screenshots)\n- [Getting started](#getting-started)\n- [Usage](#usage)\n- [Controllers](#controllers)\n- [Models](#models)\n- [Widgets](#widgets)\n\n\n## Screenshots\n\n\u003ctable\u003e\n  \u003ctr\u003e\n    \u003ctd\u003e\n      \u003cimg src=\"https://raw.githubusercontent.com/Cleveroad/cr_mentions/master/screenshots/screenshot_1.gif\" height=\"500\"\u003e\n    \u003c/td\u003e\n    \u003ctd\u003e\n      \u003cimg src=\"https://raw.githubusercontent.com/Cleveroad/cr_mentions/master/screenshots/screenshot_2.gif\" height=\"500\"\u003e\n    \u003c/td\u003e\n  \u003c/tr\u003e \n  \u003ctr\u003e\n    \u003ctd\u003e\n      \u003cimg src=\"https://raw.githubusercontent.com/Cleveroad/cr_mentions/master/screenshots/screenshot_1.png\" height=\"500\"\u003e\n    \u003c/td\u003e\n    \u003ctd\u003e\n      \u003cimg src=\"https://raw.githubusercontent.com/Cleveroad/cr_mentions/master/screenshots/screenshot_2.png\" height=\"500\"\u003e\n    \u003c/td\u003e\n  \u003c/tr\u003e\n\u003c/table\u003e\n\n\n## Getting started\n\nAdd package to the project:\n\n   ```yaml\n   dependencies:\n     cr_mentions: ^0.0.1\n   ```\n   \n      \n## Usage\n\nThis package is good if you need to mention someone in the text. \n\nTo track mentions, use `MentionTextController` as the controller for your text field.\n\nTo show mentions, use `MentionText` or `MentionWidget`\n\n\n### Controllers\n\n##### MentionTextController\n\n\u003e `tag` - the symbol by which mention will be made. By default it is `@`\n\u003e \n\u003e `mentions` -  the list of currently detected mentions in the text. Each time the text is changed, this list is generated a new\n\u003e \n\u003e `lastMention` - last editable mention\n\u003e \n\u003e `insertMention` - inserts the mention in the place of the current editable mention\n\u003e \n\u003e `makeQuerySuggestions` - returns a string that is used to search for suggestions. If the return value is '', then only the tag was entered, if the value is null, then there are no suggestions. Otherwise all matching suggestions will be returned\n\u003e \n\u003e `replaceLastMentionWithText` - makes the last mention a plain text\n\u003e \n\u003e `prepareForEditingMode` - in edit mode of text field with mentions, it is necessary to call this method during initialization, where to pass a list of previously set mentions\n\u003e \n\u003e `getMentionsListWithoutTag` - adds the id's, remove `tag` symbols and inserts the first mention. The first mention can be inserted if it is, for example, a reply to a comment(with position offset)\n\u003e \n\u003e `getTextWithFirstMention` -   if you add first mention to `getMentionsListWithoutTag`, you should return the correct string already with this mention\n\n\n``` dart\n    final replyModel = MentionModel(\n        mentionName: 'aty',\n        locationStart: 0,\n        locationEnd: 4,\n        tagType: _mentionCtr.tag,\n        );\n    \n    return  MessageModel(\n                text: _mentionCtr.getTextWithFirstMention(replyModel),\n                mentions: _mentionCtr.getMentionsListWithoutTag(\n                        isTextTrimmed: false,\n                        firstMention: replyModel,\n                    ) ?? [],\n            );\n```\n\n##### Using a controller\n\n\u003e `_mentionCtr` - `MentionTextController` that tracks the writing of mentions.\n\u003e\n\u003e `_lastMention` - `ValueNotifier` that holds a `MentionModel`.\n\u003e Use it to to keep track of the last mention while typing.\n\n```dart\nfinal _lastMention = ValueNotifier\u003cMentionModel?\u003e(null);\nlate final _mentionCtr = MentionTextController(lastMention: _lastMention);\n\n    ...\n    TextFormField(\n      controller: _mentionCtr,\n    ),\n    ...\n   ```\n\n### Models\n\n##### MentionData\n\n If you want any model to be dedicated to mentions, you have to wrap it in `MentionData\u003cT\u003e`.\n\n\u003e `mentionName` - the name by which the search will take place\n\u003e \n\u003e `data` - is \u003cT\u003e with the right model\n\n\n```dart\n    MentionData\u003cUserModel\u003e(\n        mentionName: 'xerown',\n        data: UserModel(\n            firstName: 'Mark',\n            lastName: 'Robinson',\n        ),\n        id: 0,\n    ),\n   ```\n\n ##### MentionModel\n\nIf you want mentions to be shown in the text, make a model that stores all the mentions.  \n\n\n ```dart\n    class MessageModel {\n        MessageModel({\n            required this.text,\n            required this.mentions,\n        });\n\n    final String text;\n    final List\u003cMentionModel\u003e mentions;\n}\n```  \n\n```dart\n   MessageModel(\n        text: _mentionCtr.text,\n        mentions:\n            _mentionCtr.getMentionsListWithoutTag(isTextTrimmed: true) ?? [],\n    )\n   ```\n\n\n### Widgets\n\n##### MentionText\n\nThis widget is made to highlight mentions in text.\n\n\n\u003e `text` - text with mentions\n\u003e \n\u003e `mentions` - a list of [MentionModel](#mentionmodels), to highlight them in the text\n\u003e \n\u003e `style` - style of a plain text\n\u003e \n\u003e `mentionStyle` - text style of mentions\n\u003e \n\u003e `overflow` -  how overflowing text should be handled. By default `TextOverflow.clip`\n\u003e \n\u003e `maxLines` - maximum number of lines in the text\n\u003e \n\u003e `onMentionTap` - returns the clicked mention model\n\n\n``` dart\n    MentionText(\n        message.text,\n        mentions: message.mentions,\n        style: const TextStyle(color: Colors.black),\n        mentionStyle: const TextStyle(color: Colors.deepOrange),\n        onMentionTap: onMentionModel,\n    )\n```\n\n##### MentionWidget\n\nUse this widget if you want the mention to look different than just the text, which is highlighted in a different color.\n\n\u003e `text` - text with mentions\n\u003e \n\u003e `textStyle` - style of plaint text\n\u003e \n\u003e `paddingText` - the distance you want to set between the text and the mention\n\u003e \n\u003e `mentions` - a list of [MentionModel](#mentionmodels), to highlight them in the text\n\u003e \n\u003e `mentionWidgetBuilder` - is a feature by which you can return the desired widget to highlight mentions\n\n\n``` dart\n    MentionWidget(\n        message.text,\n        mentions: message.mentions,\n        paddingText: const EdgeInsets.symmetric(vertical: 4),\n        mentionWidgetBuilder: _mentionBuilder,\n    ),\n```\n``` dart\n    Widget _mentionBuilder(MentionModel mention) {\n        return Container(\n            decoration: BoxDecoration(\n                borderRadius: BorderRadius.circular(4),\n                color: Colors.deepOrange.shade100,\n            ),\n            margin: const EdgeInsets.symmetric(horizontal: 2, vertical: 2),\n            padding: const EdgeInsets.all(4),\n            child: Text(\n                mention.fullMention,\n                style: const TextStyle(color: Colors.deepOrange),\n            ),\n        );\n    }\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcleveroad%2Fcr_mentions","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fcleveroad%2Fcr_mentions","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcleveroad%2Fcr_mentions/lists"}