{"id":15280403,"url":"https://github.com/zefoy/ngx-fabric-wrapper","last_synced_at":"2026-02-20T15:01:40.962Z","repository":{"id":38240046,"uuid":"111279068","full_name":"zefoy/ngx-fabric-wrapper","owner":"zefoy","description":"Angular wrapper library for Fabric","archived":false,"fork":false,"pushed_at":"2026-01-16T21:21:10.000Z","size":8345,"stargazers_count":27,"open_issues_count":9,"forks_count":8,"subscribers_count":6,"default_branch":"master","last_synced_at":"2026-01-17T10:26:19.763Z","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/zefoy.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE.md","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,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2017-11-19T08:51:54.000Z","updated_at":"2025-12-29T09:12:02.000Z","dependencies_parsed_at":"2025-07-30T15:33:42.606Z","dependency_job_id":"e6500ed9-9d97-4d78-b3b4-fd35031676a9","html_url":"https://github.com/zefoy/ngx-fabric-wrapper","commit_stats":null,"previous_names":[],"tags_count":34,"template":false,"template_full_name":null,"purl":"pkg:github/zefoy/ngx-fabric-wrapper","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zefoy%2Fngx-fabric-wrapper","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zefoy%2Fngx-fabric-wrapper/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zefoy%2Fngx-fabric-wrapper/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zefoy%2Fngx-fabric-wrapper/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/zefoy","download_url":"https://codeload.github.com/zefoy/ngx-fabric-wrapper/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zefoy%2Fngx-fabric-wrapper/sbom","scorecard":{"id":1238569,"data":{"date":"2025-09-01","repo":{"name":"github.com/zefoy/ngx-fabric-wrapper","commit":"d76e576929934fcf1487d7412b63433b4177a473"},"scorecard":{"version":"v5.2.1-41-g40576783","commit":"40576783fda6698350fcbbeaea760ff827433034"},"score":2.7,"checks":[{"name":"Dangerous-Workflow","score":-1,"reason":"no workflows found","details":null,"documentation":{"short":"Determines if the project's GitHub Action workflows avoid dangerous patterns.","url":"https://github.com/ossf/scorecard/blob/40576783fda6698350fcbbeaea760ff827433034/docs/checks.md#dangerous-workflow"}},{"name":"Code-Review","score":0,"reason":"Found 1/29 approved changesets -- score normalized to 0","details":null,"documentation":{"short":"Determines if the project requires human code review before pull requests (aka merge requests) are merged.","url":"https://github.com/ossf/scorecard/blob/40576783fda6698350fcbbeaea760ff827433034/docs/checks.md#code-review"}},{"name":"Packaging","score":-1,"reason":"packaging workflow not detected","details":["Warn: no GitHub/GitLab publishing workflow detected."],"documentation":{"short":"Determines if the project is published as a package that others can easily download, install, easily update, and uninstall.","url":"https://github.com/ossf/scorecard/blob/40576783fda6698350fcbbeaea760ff827433034/docs/checks.md#packaging"}},{"name":"Token-Permissions","score":-1,"reason":"No tokens found","details":null,"documentation":{"short":"Determines if the project's workflows follow the principle of least privilege.","url":"https://github.com/ossf/scorecard/blob/40576783fda6698350fcbbeaea760ff827433034/docs/checks.md#token-permissions"}},{"name":"Maintained","score":3,"reason":"4 commit(s) and 0 issue activity found in the last 90 days -- score normalized to 3","details":null,"documentation":{"short":"Determines if the project is \"actively maintained\".","url":"https://github.com/ossf/scorecard/blob/40576783fda6698350fcbbeaea760ff827433034/docs/checks.md#maintained"}},{"name":"Pinned-Dependencies","score":-1,"reason":"no dependencies found","details":null,"documentation":{"short":"Determines if the project has declared and pinned the dependencies of its build process.","url":"https://github.com/ossf/scorecard/blob/40576783fda6698350fcbbeaea760ff827433034/docs/checks.md#pinned-dependencies"}},{"name":"Binary-Artifacts","score":10,"reason":"no binaries found in the repo","details":null,"documentation":{"short":"Determines if the project has generated executable (binary) artifacts in the source repository.","url":"https://github.com/ossf/scorecard/blob/40576783fda6698350fcbbeaea760ff827433034/docs/checks.md#binary-artifacts"}},{"name":"CII-Best-Practices","score":0,"reason":"no effort to earn an OpenSSF best practices badge detected","details":null,"documentation":{"short":"Determines if the project has an OpenSSF (formerly CII) Best Practices Badge.","url":"https://github.com/ossf/scorecard/blob/40576783fda6698350fcbbeaea760ff827433034/docs/checks.md#cii-best-practices"}},{"name":"Security-Policy","score":0,"reason":"security policy file not detected","details":["Warn: no security policy file detected","Warn: no security file to analyze","Warn: no security file to analyze","Warn: no security file to analyze"],"documentation":{"short":"Determines if the project has published a security policy.","url":"https://github.com/ossf/scorecard/blob/40576783fda6698350fcbbeaea760ff827433034/docs/checks.md#security-policy"}},{"name":"Fuzzing","score":0,"reason":"project is not fuzzed","details":["Warn: no fuzzer integrations found"],"documentation":{"short":"Determines if the project uses fuzzing.","url":"https://github.com/ossf/scorecard/blob/40576783fda6698350fcbbeaea760ff827433034/docs/checks.md#fuzzing"}},{"name":"License","score":10,"reason":"license file detected","details":["Info: project has a license file: LICENSE.md:0","Info: FSF or OSI recognized license: MIT License: LICENSE.md:0"],"documentation":{"short":"Determines if the project has defined a license.","url":"https://github.com/ossf/scorecard/blob/40576783fda6698350fcbbeaea760ff827433034/docs/checks.md#license"}},{"name":"Signed-Releases","score":-1,"reason":"no releases found","details":null,"documentation":{"short":"Determines if the project cryptographically signs release artifacts.","url":"https://github.com/ossf/scorecard/blob/40576783fda6698350fcbbeaea760ff827433034/docs/checks.md#signed-releases"}},{"name":"Branch-Protection","score":0,"reason":"branch protection not enabled on development/release branches","details":["Warn: branch protection not enabled for branch 'master'"],"documentation":{"short":"Determines if the default and release branches are protected with GitHub's branch protection settings.","url":"https://github.com/ossf/scorecard/blob/40576783fda6698350fcbbeaea760ff827433034/docs/checks.md#branch-protection"}},{"name":"SAST","score":0,"reason":"SAST tool is not run on all commits -- score normalized to 0","details":["Warn: 0 commits out of 2 are checked with a SAST tool"],"documentation":{"short":"Determines if the project uses static code analysis.","url":"https://github.com/ossf/scorecard/blob/40576783fda6698350fcbbeaea760ff827433034/docs/checks.md#sast"}},{"name":"Vulnerabilities","score":4,"reason":"6 existing vulnerabilities detected","details":["Warn: Project is vulnerable to: GHSA-cwfw-4gq5-mrqx","Warn: Project is vulnerable to: GHSA-g95f-p29q-9xw4","Warn: Project is vulnerable to: GHSA-grv7-fg5c-xmjg","Warn: Project is vulnerable to: GHSA-7wpw-2hjm-89gp","Warn: Project is vulnerable to: GHSA-952p-6rrq-rcjv","Warn: Project is vulnerable to: GHSA-52f5-9888-hmc6"],"documentation":{"short":"Determines if the project has open, known unfixed vulnerabilities.","url":"https://github.com/ossf/scorecard/blob/40576783fda6698350fcbbeaea760ff827433034/docs/checks.md#vulnerabilities"}}]},"last_synced_at":"2025-10-06T20:48:29.234Z","repository_id":38240046,"created_at":"2025-10-06T20:48:29.234Z","updated_at":"2025-10-06T20:48:29.234Z"},"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":29655026,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-02-20T09:27:29.698Z","status":"ssl_error","status_checked_at":"2026-02-20T09:26:12.373Z","response_time":59,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.6:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"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-09-30T12:01:37.673Z","updated_at":"2026-02-20T15:01:40.942Z","avatar_url":"https://github.com/zefoy.png","language":"TypeScript","funding_links":[],"categories":["Framework Interoperability"],"sub_categories":["Wrappers"],"readme":"# Angular Fabric Wrapper\n\n\u003ca href=\"https://badge.fury.io/js/ngx-fabric-wrapper\"\u003e\u003cimg src=\"https://badge.fury.io/js/ngx-fabric-wrapper.svg\" align=\"right\" alt=\"npm version\" height=\"18\"\u003e\u003c/a\u003e\n\nThis is an Angular wrapper library for the [Fabric](http://fabricjs.com/). To use this library you should get familiar with the Fabric documentation as well since this documentation only explains details specific to this wrapper.\n\nThis documentation is for the latest version which requires Angular version newer than 2 major versions prior to the current latest version. For older Angular versions you need to use an older version of this library.\n\n### Quick links\n\n[Example application](https://zefoy.github.io/ngx-fabric-wrapper/)\n |\n[StackBlitz example](https://stackblitz.com/github/zefoy/ngx-fabric-wrapper/tree/master)\n |\n[Fabric documentation](http://fabricjs.com/docs/)\n\n### Building the library\n\n```bash\nnpm install\nnpm run build\n```\n\n### Running the example\n\n```bash\nnpm install\nnpm run start\n```\n\n### Installing and usage\n\n```bash\nnpm install ngx-fabric-wrapper --save --no-optional\n```\n\n##### Provide the global configuration:\n\nGlobal configuration should be provided only once (this is usually done in the bootstrap phase).\n\n```javascript\nimport { FABRIC_CONFIG } from 'ngx-fabric-wrapper'\n\nconst DEFAULT_FABRIC_CONFIG: FabricConfigInterface = {\n};\n\nbootstrapApplication(AppComponent, {\n  ...\n  providers: [\n    ...\n    provideHttpClient(),\n    {\n      provide: FABRIC_CONFIG,\n      useValue: DEFAULT_FABRIC_CONFIG\n    }\n  ]\n})\n```\n\n##### Import the library into your component:\n\n\n```javascript\nimport { FabricComponent, FabricDirective } from 'ngx-fabric-wrapper';\n\n@Component({\n  ...\n  imports: [\n    ...\n    FabricComponent,\n    FabricDirective\n  ]\n})\n```\n\n##### Use it in your HTML template (with custom configuration):\n\nThis library provides two ways to create a Fabric canvas, component for simple use cases and directive for more custom use cases.\n\n**COMPONENT USAGE**\n\nSimply replace the canvas that would ordinarily be passed to `Fabric` with the fabric component.\n\n```html\n\u003cfabric [config]=\"config\" [data]=\"json\"\u003e\u003c/fabric\u003e\n```\n\n```javascript\n[config]                     // Custom config to override the global defaults.\n\n[data]                       // JSON data to be loaded on the Fabric canvas.\n\n[zoom]                       // Zoom level for the Fabric canvas (Default: 1).\n\n[width]                      // Width of the canvas (Default: parents width).\n[height]                     // Height of the canvas (Default: parents height).\n\n[disabled]                   // Disables all functionality (uses static canvas).\n\n[useFabricClass]             // Use fabric class (use provided default styles).\n\n(dataLoaded)                 // Event for when provided data is loaded to the canvas.\n\n(\u003cfabricEvent\u003e)              // All Fabric canvas events / callbacks work as bindings.\n                             // Event names are in camel case (not colon separated).\n                             // Example: object:added -\u003e objectAdded\n\n```\n\n**DIRECTIVE USAGE**\n\nFabric directive can be used in correctly structured canvas element with optional custom configuration:\n\n```html\n\u003ccanvas class=\"fabric\" [fabric]=\"config\"\u003e\u003c/canvas\u003e\n```\n\n```javascript\n[fabric]                     // Custom config to override the global defaults.\n\n[zoom]                       // Zoom level for the Fabric canvas (Default: 1).\n\n[width]                      // Width of the canvas (Default: parents width).\n[height]                     // Height of the canvas (Default: parents height).\n\n[disabled]                   // Disables all functionality (focus \u0026 editing).\n\n(\u003cfabricEvent\u003e)              // All Fabric canvas events / callbacks work as bindings.\n                             // Event names are in camel case (not colon separated).\n                             // Example: object:added -\u003e objectAdded\n```\n\n##### Available configuration options (custom / global configuration):\n\n```javascript\nselectionColor               // Color for the selection indicators.\n\nrenderOnAddRemove            // Render automatically on objects add / removal.\n```\n\nFor more detailed documentation with all the supported config options see the Fabric documentation.\n\n##### Available control / helper functions (provided by the directive):\n\n```javascript\nfabric()                          // Returns the Fabric canvas reference for full API access.\n\nclear()                           // Clears all contexts (background, main, top) of an instance.\n\nsetZoom(zoom)                     // Sets the zoom level of the canvas (less than 1 zooms out).\nsetWidth(width)                   // Sets canvas width (when null then parent width is used).\nsetHeight(height)                 // Sets canvas height (when null then parent height is used).\n\nloadFromJSON(json, cb?, opts?)    // Populates canvas from json (callback called when finished).\n```\n\nAbove functions can be accessed through the directive reference (available as directiveRef in the component).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fzefoy%2Fngx-fabric-wrapper","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fzefoy%2Fngx-fabric-wrapper","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fzefoy%2Fngx-fabric-wrapper/lists"}