{"id":14972458,"url":"https://github.com/cybertoothca/ember-cli-bootstrap3-popover","last_synced_at":"2025-10-26T19:31:24.361Z","repository":{"id":38307914,"uuid":"75518173","full_name":"cybertoothca/ember-cli-bootstrap3-popover","owner":"cybertoothca","description":"An EmberJs addon allowing you to quickly and conveniently create a Bootstrap3 Popover (http://getbootstrap.com/javascript/#popovers).","archived":false,"fork":false,"pushed_at":"2023-02-20T02:11:37.000Z","size":1822,"stargazers_count":1,"open_issues_count":11,"forks_count":1,"subscribers_count":3,"default_branch":"main","last_synced_at":"2025-01-31T22:51:15.162Z","etag":null,"topics":["bootstrap","ember","popover"],"latest_commit_sha":null,"homepage":"http://ember-cli-bootstrap3-popover.cybertooth.io/","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/cybertoothca.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}},"created_at":"2016-12-04T04:52:37.000Z","updated_at":"2022-03-30T17:45:23.000Z","dependencies_parsed_at":"2024-09-23T11:30:41.015Z","dependency_job_id":"b9247ff4-6c4d-438c-96b9-42c889d3705c","html_url":"https://github.com/cybertoothca/ember-cli-bootstrap3-popover","commit_stats":{"total_commits":109,"total_committers":7,"mean_commits":"15.571428571428571","dds":0.6880733944954128,"last_synced_commit":"86f735ce299867eaac55c8e8d08ba96c3de88af2"},"previous_names":[],"tags_count":14,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/cybertoothca%2Fember-cli-bootstrap3-popover","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/cybertoothca%2Fember-cli-bootstrap3-popover/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/cybertoothca%2Fember-cli-bootstrap3-popover/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/cybertoothca%2Fember-cli-bootstrap3-popover/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/cybertoothca","download_url":"https://codeload.github.com/cybertoothca/ember-cli-bootstrap3-popover/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":238394323,"owners_count":19464583,"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":["bootstrap","ember","popover"],"created_at":"2024-09-24T13:46:57.019Z","updated_at":"2025-10-26T19:31:23.943Z","avatar_url":"https://github.com/cybertoothca.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# ember-cli-bootstrap3-popover\n\n[![npm version](http://badge.fury.io/js/ember-cli-bootstrap3-popover.svg)](http://badge.fury.io/js/ember-cli-bootstrap3-popover) ![downloads](https://img.shields.io/npm/dy/ember-cli-bootstrap3-popover.svg) [![Code Climate](http://codeclimate.com/github/cybertoothca/ember-cli-bootstrap3-popover/badges/gpa.svg)](http://codeclimate.com/github/cybertoothca/ember-cli-bootstrap3-popover)\n\n[![ember-observer-badge](http://emberobserver.com/badges/ember-cli-bootstrap3-popover.svg)](http://emberobserver.com/addons/ember-cli-bootstrap3-popover)\n\nThis addon allows you to quickly and conveniently create a [Bootstrap3 Popover](https://getbootstrap.com/docs/3.3/javascript/#popovers).\n\n## Compatibility\n\n- Ember.js v2.18 or above\n- Ember CLI v2.13 or above\n- Node.js v8 or above\n- Bootstrap 3.3.x+\n\n## Installation\n\nThe following will install this addon:\n\n```\nember install ember-cli-bootstrap3-popover\n```\n\n## Demo\n\nThe demonstration web application can be found here:\n[http://ember-cli-bootstrap3-popover.cybertooth.io/](http://ember-cli-bootstrap3-popover.cybertooth.io/).\n\n## Usage\n\nAs mentioned above there are dozens of examples on the demonstration site:\n[http://ember-cli-bootstrap3-popover.cybertooth.io/](http://ember-cli-bootstrap3-popover.cybertooth.io/)\n\n### What Does This Addon Do?\n\nThis addon supplies the following _components_:\n\n- `twbs-popover` - a container-like element for the popover's markup, options, methods, and events.\n- `twbs-popover/content` - a component you nest inside a `twbs-popover` that will generate\n  the _content_ for the popover.\n- `twbs-popover/title` - a component you nest inside a `twbs-popover` that will generate\n  the _title_ for the popover.\n- `twbs-popover/trigger` - the component you nest inside a `twbs-popover` that acts as the bound element for the\n  popover and in normal trigger events will accept clicks, hovering, and focus events to toggle the popover.\n\nThe following _mixin_ also ships with this addon:\n\n- `Popover` - imported as `import Popover as 'ember-cli-bootstrap3-popover/mixins/popover'` and includes all of the\n  popover options as found in the [Bootstrap documentation](https://getbootstrap.com/docs/3.3/javascript/#popovers-options).\n\n### Components\n\n#### `{{twbs-popover}}`\n\nA component that contains all of the markup associated with the popover. You can nest `{{twbs-popover.content}}`,\n`{{twbs-popover.title}}`, and `{{twbs-popover.trigger}}` inside this components block.\n\nThe reason this addon requires **Ember-2.3.0+** is because this particular component uses the _hash_ helper.\n\n**Be aware that when you nest either the content or title it will be automatically treated as html.**\n\n##### Arguments\n\n- _All of the properties listed in the `Popover` mixin_.\n- `onShow` - the property that accepts an action closure hooked to the bootstrap `show.bs.popover` event.\n- `onShown` - the property that accepts an action closure hooked to the bootstrap `shown.bs.popover` event.\n- `onHide` - the property that accepts an action closure hooked to the bootstrap `hide.bs.popover` event.\n- `onHidden` - the property that accepts an action closure hooked to the bootstrap `hidden.bs.popover` event.\n- `onInserted` - the property that accepts an action closure hooked to the bootstrap `inserted.bs.popover` event.\n\n([Check out the demo...](http://ember-cli-bootstrap3-popover.cybertooth.io/))\n\n##### Actions\n\nThe following popover methods are exposed as actions:\n\n- `hide` - triggers the hiding of a popover.\n- `show` - triggers the showing of a popover.\n- `toggle` - toggles a popover.\n\n#### `{{twbs-popover/content}}`\n\nA component that nests inside of a `{{#twbs-popover}}` and generates the content for a popover via its block.\nThis component promotes the easy re-use of existing components inside the popover content and encourages readable html.\n\n##### Arguments\n\n- _None_.\n\n#### `{{twbs-popover/title}}`\n\nA component that nests inside of a `{{#twbs-popover}}` and generates the title for a popover via its block.\nThis component promotes the easy re-use of existing components inside the popover title and encourages readable html.\n\n##### Arguments\n\n- _None_.\n\n#### `{{twbs-popover/trigger}}`\n\nA component that nests inside of a `{{#twbs-popover}}` and generates the html element that the popover is bound to.\nWhen the popover is initialized, the markup inside this component becomes the popover.\n\nSeriously, check out the examples and all of this will make sense:\n[http://ember-cli-bootstrap3-popover.cybertooth.io/](http://ember-cli-bootstrap3-popover.cybertooth.io/)\n\n##### Arguments\n\n- _None_.\n\n### Mixins\n\n#### `Popover`\n\nA mixin that provides access to all of the Bootstrap popover options as found\nhere: [http://getbootstrap.com/javascript/#popovers-options](https://getbootstrap.com/docs/3.3/javascript/#popovers-options)\n\n##### Properties\n\n- `animation?` (aliased to `animation`)- **Default** `true`\n- `content` - **Default** `''`\n- `delay` - **Default** `0`\n- `delayHide` - **Default** `undefined`\n- `delayShow` - **Default** `undefined`\n- `html?` (aliased to `html`) - **Default** `false`\n- `placement` - **Default** `'right'`\n- `popoverContainer` - **Default** `false`\n- `popoverTemplate` - **Default** `'\u003cdiv class=\"popover\" role=\"tooltip\"\u003e\u003cdiv class=\"arrow\"\u003e\u003c/div\u003e\u003ch3 class=\"popover-title\"\u003e\u003c/h3\u003e\u003cdiv class=\"popover-content\"\u003e\u003c/div\u003e\u003c/div\u003e'`\n- `popoverTrigger` - **Default** `'click'`\n- `selector` - **Default** `false`\n- `title` - **Default** `''`\n\n##### Methods\n\n- `getOptions()` - returns a hash containing the options from this mixin\n  that are used to initialize the Bootstrap popover.\n\n### Troubleshooting And Tips\n\n1. Ember-2.3.0+ is required because this addon uses the _hash_ helper.\n1. Bootstrap3 CSS and the tooltip Javascript plugin must be installed.\n\n## Contributing\n\nSee the [Contributing](CONTRIBUTING.md) guide for details.\n\n## License\n\nThis project is licensed under the [MIT License](LICENSE.md).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcybertoothca%2Fember-cli-bootstrap3-popover","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fcybertoothca%2Fember-cli-bootstrap3-popover","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcybertoothca%2Fember-cli-bootstrap3-popover/lists"}