{"id":24511731,"url":"https://github.com/devnax/state-range","last_synced_at":"2025-03-15T09:44:24.749Z","repository":{"id":112973927,"uuid":"459565091","full_name":"devnax/state-range","owner":"devnax","description":null,"archived":false,"fork":false,"pushed_at":"2023-12-04T18:54:32.000Z","size":1276,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-01-22T00:41:22.657Z","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":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/devnax.png","metadata":{"files":{"readme":"README.md","changelog":null,"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-02-15T12:16:10.000Z","updated_at":"2023-07-17T15:24:26.000Z","dependencies_parsed_at":"2023-11-07T01:58:16.297Z","dependency_job_id":"5cde92be-b9bc-4776-a0b3-e6a8a968788c","html_url":"https://github.com/devnax/state-range","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/devnax%2Fstate-range","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/devnax%2Fstate-range/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/devnax%2Fstate-range/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/devnax%2Fstate-range/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/devnax","download_url":"https://codeload.github.com/devnax/state-range/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":243713387,"owners_count":20335566,"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":"2025-01-22T00:41:06.398Z","updated_at":"2025-03-15T09:44:24.723Z","avatar_url":"https://github.com/devnax.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"### State Range\n`state-range` is a very powerfull react state management system library. you can use it with your big application.\n\n\n### How to use\n`usersHandler.js`\n```js\nimport {Store} from 'state-range'\nclass Users extends Store{\n    ...\n}\n\nexport default new Users\n```\n\n\n`UserList.jsx`\n```jsx\nimport {withStore} from 'state-range'\nimport Users from 'usersHandler'\n\nconst UserList = () =\u003e {\n    const items = Users.getAll()\n    return (\n        \u003cul\u003e\n            {\n                items.map(item =\u003e ...)\n            }\n        \u003c/ul\u003e\n    )\n}\nexport default withStore(UserList)\n```\n\n```jsx\nimport {Store, withStore} from 'state-range'\nimport UserList from 'UserList'\nimport User from 'usersHandler'\n\nconst App = () =\u003e {\n    return(\n        \u003cdiv\u003e\n            \u003cUserList /\u003e\n            \u003cbutton onClick={() =\u003e {\n                User.insert({\n                    name: \"\",\n                    email: \"\"\n                })\n            }}\u003eAdd Item\u003c/button\u003e\n        \u003c/div\u003e\n    )\n}\n\n```\n\n## Methods\n\n```js\nimport User from 'usersHandler'\nconst users = User.find({name: \"nax\"})\n\n// with query method\nconst users = User.find({email: \"$startWith(nax@)\"})\n\n// search\nconst users = User.find({email: \"$search(nax)\"})\n```\n\n\n### Query Methods\n\n| Name      | Description                        | Use                         |\n| --------- | ---------------------------------- | --------------------------- |\n| equal     | `$equal()`- this is default method | `{name: \"$equal(abc)\"}`     |\n| notEqual  | `$notEqual()`                      | `{name: \"$notEqual(abc)\"}`  |\n| startWith | `$startWith()`                     | `{name: \"$startWith(abc)\"}` |\n| endWith   | `$endWith()`                       | `{name: \"$endWith(abc)\"}`   |\n| hasValue  | `$hasValue()`                      | `{name: \"$hasValue()\"}`     |\n| search    | `$search()`                        | `{name: \"$search(abc)\"}`    |\n\n\n\n## withStore\nyou can pass two args in this function. first is your component and the second is callback. in that callback you need to return an array\n\n```js\n\nimport {withStore} from 'state-range'\n\nwithStore(Comp, () =\u003e {\n    return [...]\n})\n```\n\n## withMemo\nyou can memoize your component. you can pass two args in this function. first is your component and the second is callback. in that callback you need to return an array\n\n```js\n\nimport {withMemo} from 'state-range'\n\nwithMemo(Comp, () =\u003e {\n    return [...]\n})\n```\n\n\n\n\n\n\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdevnax%2Fstate-range","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdevnax%2Fstate-range","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdevnax%2Fstate-range/lists"}