{"id":15251141,"url":"https://github.com/donejs/done-inspect","last_synced_at":"2025-04-10T20:11:10.918Z","repository":{"id":57215077,"uuid":"90172503","full_name":"donejs/done-inspect","owner":"donejs","description":"An modular inspection tool for your DoneJS application","archived":false,"fork":false,"pushed_at":"2019-06-20T16:53:47.000Z","size":85,"stargazers_count":4,"open_issues_count":4,"forks_count":0,"subscribers_count":4,"default_branch":"master","last_synced_at":"2025-03-24T17:52:48.487Z","etag":null,"topics":["canjs","devtools","donejs","inspection","inspector","javascript","state-management","web-component"],"latest_commit_sha":null,"homepage":"https://www.npmjs.com/package/done-inspect","language":"JavaScript","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/donejs.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2017-05-03T16:54:50.000Z","updated_at":"2019-09-27T19:38:56.000Z","dependencies_parsed_at":"2022-08-26T13:41:26.169Z","dependency_job_id":null,"html_url":"https://github.com/donejs/done-inspect","commit_stats":null,"previous_names":[],"tags_count":8,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/donejs%2Fdone-inspect","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/donejs%2Fdone-inspect/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/donejs%2Fdone-inspect/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/donejs%2Fdone-inspect/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/donejs","download_url":"https://codeload.github.com/donejs/done-inspect/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248288357,"owners_count":21078903,"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":["canjs","devtools","donejs","inspection","inspector","javascript","state-management","web-component"],"created_at":"2024-09-29T17:07:04.436Z","updated_at":"2025-04-10T20:11:10.891Z","avatar_url":"https://github.com/donejs.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# done-inspect\n\n\u003c!-- [![Build Status](https://travis-ci.org/donejs/done-inspect.png?branch=master)](https://travis-ci.org/donejs/done-inspect) --\u003e\n\nAn modular inspection tool for your DoneJS application\n\n## Installation\n\n```bash\nnpm install --save-dev done-inspect\n```\n\nor\n\n```bash\nyarn add done-inspect --dev\n```\n\n## Usage\n\n### ES6 and CommonJS use\n\nUse ES6 `import` or CommonJS `require` to load `done-inspect`. After which,\nit can be used in your template.\n\n```js\n// ES6\nimport plugin from 'done-inspect';\n\n// CommonJS\nvar plugin = require('done-inspect');\n```\n\nOr import it directly into your `can-stache` template with `can-import` and `stealjs`:\n\n```mustache\n\u003ccan-import from=\"done-inspect\" /\u003e\n\u003cdone-inspect /\u003e\n\n{{!-- With configuration options and an application title --}}\n\u003cdone-inspect {options}=\"anObject\" {title}=\"aString\" /\u003e\n```\n\n### Options\n\nThe `options` parameter is expected to be an object and accepts only two properties:\n`expanded` and `modules`.\n\n* `expanded` is a boolean and expects `true` or `false` as values\n* `modules` is expected to be an `Array` of `Object` where each object matches the interface\nof a module.\n\n### Title\n\nThe `title` parameter take a string and will be displayed at the top of the inspector. The idea\nfor this was to display the package.json's `name + version` at the top of the inspector but\nany string is accepted.\n\n## Modules\n\n### Builtin Modules\n\nTwo modules come with the current version of `done-inspect`:\n* __Select Wand__ - Allows the User to hover over the application's custom components and outline\nthem. In future versions, this selection will also include the ability to inspect and change\nthe components internal state.\n* __Show Names__ - Turning the module on will place labels by all of the application's custom\ncomponents, showing their tag names.\n\n### Writing Custom Modules\n\nWriting a `done-inspect` module requires an exported object with three properties and one function.\n\n```js\nimport './module-name.less';\n\nexport default {\n  group: '\u003cstring :: The group the module belongs to\u003e',\n  title: '\u003cstring :: The short title shown to the User\u003e',\n  description: '\u003cstring :: What function the module performs\u003e',\n  onChange() {\n  /**\n   * Currently done-inspect's interface only supports checkboxes.\n   *\n   * This function will be called each time the User clicks the\n   * module's checkbox. Therefore, it needs to account for being\n   * checked and unchecked.\n   */\n  },\n};\n```\n\n### Style Naming Conventions\n\nIn order to reduce the change of style conflict, I use the following class\nname convention:\n\n```css\n.done-inspect-module-name-class-name {\n  // ALL THE STYLES\n}\n```","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdonejs%2Fdone-inspect","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdonejs%2Fdone-inspect","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdonejs%2Fdone-inspect/lists"}