ember-attacher 3.3.0 → 4.0.0-beta.1

package/addon/styles/ember-attacher.scss

@@ -1,137 +0,0 @@
-.ember-attacher {
-  width: max-content;
-  position: absolute;
-  top: 0;
-  left: 0;
-  display: none;
-  perspective: 800px;
-  transition-timing-function: cubic-bezier(.165, .84, .44, 1);
-  z-index: 9999;
-
-  @each $position in $positions {
-    &[x-placement^=#{$position}] {
-      div[x-arrow] {
-        @include arrow($position, 10px);
-      }
-
-      div[x-circle] {
-        @include circle-transform-hide($position);
-        opacity: 0;
-        transform-origin: nth($circle-origins, index($positions, $position));
-      }
-
-      > .ember-attacher-fill {
-        @include ember-attacher-hide-transform($position, 'shift');
-        opacity: 0;
-      }
-
-      > .ember-attacher-none {
-        @include ember-attacher-hide-transform($position, 'none');
-        opacity: 1;
-
-      }
-
-      > .ember-attacher-fade {
-        @include ember-attacher-show-transform($position, 'fade');
-        opacity: 0;
-      }
-
-      > .ember-attacher-shift {
-        @include ember-attacher-hide-transform($position, 'shift');
-        opacity: 0;
-      }
-
-      > .ember-attacher-scale {
-        @include ember-attacher-hide-transform($position, 'scale');
-        opacity: 0;
-      }
-
-      > .ember-attacher-perspective {
-        @include ember-attacher-hide-transform($position, 'perspective');
-        opacity: 0;
-        transform-origin: nth($origins, index($positions, $position));
-      }
-
-      > .ember-attacher-show {
-        > div[x-circle] {
-          opacity: 1;
-          transform: scale(1.2) translate(-50%, -50%);
-        }
-
-        &.ember-attacher-fade,
-        &.ember-attacher-fill,
-        &.ember-attacher-none,
-        &.ember-attacher-shift {
-          @include ember-attacher-show-transform($position, 'fade');
-          opacity: 1;
-        }
-
-        &.ember-attacher-scale {
-          @include ember-attacher-show-transform($position, 'scale');
-          opacity: 1;
-        }
-
-        &.ember-attacher-perspective {
-          @include ember-attacher-show-transform($position, 'perspective');
-          opacity: 1;
-        }
-      }
-    }
-  }
-}
-
-.ember-attacher-tooltip {
-  background-color: #333;
-  border-radius: 4px;
-  color: #fff;
-  -moz-osx-font-smoothing: grayscale;
-  -webkit-font-smoothing: antialiased;
-  max-width: 400px;
-  padding: .5rem 1rem;
-  position: relative;
-  text-align: center;
-  will-change: transform;
-
-  &.ember-attacher-fill {
-    background-color: transparent;
-    overflow: hidden;
-  }
-
-  > div[x-arrow] {
-    background-color: #333;
-    border: 1px solid;
-    border-color: transparent transparent #333 #333;
-    height: 10px;
-    position: absolute;
-    width: 10px;
-    z-index: -1;
-  }
-
-  > div[x-circle] {
-    background-color: #333;
-    border-radius: 50%;
-    left: 50%;
-    opacity: 0;
-    overflow: hidden;
-    position: absolute;
-    transition: all ease-out;
-    width: 120%;
-    width: calc(100% + 2rem);
-    will-change: transform;
-    z-index: -1;
-
-    &::before {
-      content: '';
-      padding-top: 100%;
-      padding-top: calc(75% + 2rem);
-      float: left;
-    }
-  }
-}
-
-@media (max-width: 450px) {
-  .ember-attacher-tooltip {
-    max-width: 96%;
-    max-width: calc(100% - 42px);
-  }
-}

package/addon/styles/themes.scss

@@ -1,16 +0,0 @@
-.ember-attacher-light-theme {
-  background-color: #f3f6f9;
-  border: 1px solid #ced2e2;
-  box-shadow: 0 0 16px -4px rgba(0, 20, 40, 0.2), 0 0 80px -10px rgba(0, 20, 40, 0.3);
-  color: #203d5d;
-
-
-  > div[x-arrow] {
-    background-color: #f3f6f9;
-    border-color: transparent transparent #ced2e2 #ced2e2;
-  }
-
-  > div[x-circle] {
-    background-color: #f3f6f9;
-  }
-}

package/addon/styles/variables.scss

@@ -1,3 +0,0 @@
-$positions:      'top', 'bottom', 'left', 'right';
-$origins:        bottom, top, right, left;
-$circle-origins: 0% 50%, 0% -50%, 50% 5%, -50% 5%;

package/addon/templates/components/attach-popover.hbs

@@ -1,29 +0,0 @@
-{{~#unless this.renderFloatingElement}}
-  <meta hidden {{did-insert this.onParentFinderInsert}} {{did-update this.onIsShownChange this.isShown}}/>
-{{~/unless~}}
-
-{{~#if this.renderFloatingElement~}}
-  <MaybeInElement @destinationElement={{this._floatingElementContainer}} @renderInPlace={{@renderInPlace}}>
-    <div
-      class="ember-attacher"
-      id={{this.id}}
-      role={{this.ariaRole}}
-      {{did-insert this.didInsertFloatingElement}}
-      {{did-update this.onIsShownChange this.isShown}}
-      {{did-update this.onTargetOrTriggerChange this.hideOn this.showOn @explicitTarget}}
-      {{did-update this.onOptionsChange this.autoUpdate this.animation this.arrow this.useCapture this.placement this._renderInPlace this._currentTarget this._middleware}}
-      {{will-destroy this.willDestroyFloatingElement}}
-      ...attributes
-    >
-      <div class={{this._class}} style={{this._style}}>
-        {{yield (hash hide=this.hide)}}
-        {{#if this.arrow}}
-          <div x-arrow {{did-insert this.didInsertArrow}}></div>
-        {{/if}}
-        {{#if this.isFillAnimation}}
-          <div x-circle style="{{this._circleTransitionDuration}}"></div>
-        {{/if}}
-      </div>
-    </div>
-  </MaybeInElement>
-{{~/if~}}

package/addon-test-support/index.js

@@ -1 +0,0 @@
-export { isVisible } from './is-visible';

package/app/components/attach-popover.js

@@ -1 +0,0 @@
-export { default } from 'ember-attacher/components/attach-popover';

package/app/components/attach-tooltip.js

@@ -1 +0,0 @@
-export { default } from 'ember-attacher/components/attach-tooltip';

package/app/templates/components/attach-popover.js

@@ -1 +0,0 @@
-export { default } from 'ember-attacher/templates/components/attach-popover';

package/config/flexi.js

@@ -1,37 +0,0 @@
-/* eslint-env node */
-'use strict';
-
-module.exports = {
-  // breakpoints, order does not matter, they will be sorted by `begin`
-  // `name` is used for layout names and booleans on the device/layout service
-  // `prefix` is used for column classes, column attributes, and container breakpoint classes
-  // `begin` is the pixel value at which this breakpoint becomes active
-  breakpoints: [
-    { name: 'mobile', prefix: 'xs', begin: 0 },
-    { name: 'largemobile', prefix: 'lm', begin: 512 },
-    { name: 'tablet', prefix: 'sm', begin: 768 },
-    { name: 'desktop', prefix: 'md', begin: 992 },
-    { name: 'huge', prefix: 'lg', begin: 1200 }
-  ],
-
-  // the number of columns for the grid
-  columns: 24,
-
-  // optional, used for column classes: '<colPrefix>-<breakpointPrefix>-<columnNumber>'
-  columnPrefix: 'col',
-
-  // if false, @media css is not included
-  includeMediaCSS: true,
-
-  // if false, default element styles are not included
-  includeElementCSS: true,
-
-  // if true, will convert layout attributes on non-layout elements to classes as well
-  transformAllElementLayoutAttributes: false,
-
-  // grid and layout element gutters
-  gutterPadding: '0',
-
-  // if false, no styles are included (trumps 'includeMediaCSS' and 'includeElementCSS')
-  includeCSS: true
-};

package/docs/upgrade-guide-2.0.md

@@ -1,43 +0,0 @@
-# ember-attacher 2.0
-
-## Quick Summary
-
-- ember-popper was replaced by the [Floating UI](https://github.com/floating-ui/floating-ui)
-- ember edition was changed to "octane"
-- ember-test-waiters are used now to wait until positioning inside `requestAnimationFrame` happen in tests
-- we dropped support for node < 12 and ember-source < 3.16
-
-## Details
-
-### API Changes
-
-- instead of popper [modifiers](https://popper.js.org/docs/v2/modifiers/) you should use Floating UI [middleware](https://floating-ui.com/docs/middleware).
-  You can import the default ones (like [offset](https://floating-ui.com/docs/offset) or [flip](https://floating-ui.com/docs/flip)) directly from `@floating-ui/dom`
-
-  For example
-  ```js
-  const modifiers = { offset: { offset: 10 } };
-  ```
-  will become
-  ```js
-  import { offset } from '@floating-ui/dom';
-  ...
-  const middleware = [offset(10)]
-  ```
-- `popperContainer` is `floatingElementContainer` now 
-- `popperOptions` is `floatingUiOptions` now. The object is passed to Floating UI [computePosition](https://floating-ui.com/docs/computePosition) function.
-- `popperTarget` is `explicitTarget` now.
-- Instead of `registerAPI` used to update your tooltip or popover manually, you should use `autoUpdate` [option](https://github.com/tylerturdenpants/ember-attacher#options).
-  It  adds listeners that will automatically call an update function when necessary (if the user scrolls or resizes the screen, etc.).
-- For more details see Floating UI [migration guide](https://floating-ui.com/docs/migration). Pay attention that `ember-attacher` v1 used Popper v1.
-
-### IDs and CSS classes changes
-
-- The prefix for the default floating element's `id` is now "-floating" instead of "-popper".
-- The default `ember-attacher-popper` class is now `ember-attacher-floating`
-
-### Compatibility
-
-For Ember.js below the v3.20 you may need to install [@ember/render-modifiers](https://github.com/emberjs/ember-render-modifiers) (`ember install @ember/render-modifiers`).
-
-The addon may work with the ember-source < 3.16, yet the support is not guaranteed.

package/index.js

@@ -1,81 +0,0 @@
-/* eslint-env node */
-'use strict';
-
-const FilterImports = require('babel-plugin-filter-imports');
-const Funnel = require('broccoli-funnel');
-
-module.exports = {
-  name: require('./package').name,
-
-  included(parent) {
-    this._super.included.apply(this, arguments);
-    let app = this.app;
-
-    while (!app && parent) {
-      if (parent.app) {
-        app = parent.app;
-      } else {
-        parent = parent.parent;
-      }
-    }
-
-    this._env = app.env;
-    this._setupBabelOptions(app.env);
-  },
-
-  _hasSetupBabelOptions: false,
-  _setupBabelOptions(env) {
-    if (this._hasSetupBabelOptions) {
-      return;
-    }
-
-    if (/production/.test(env)) {
-      // In some versions of Ember, this.options is undefined during tests
-      this.options = this.options || {};
-
-      // Make sure the babel options are accessible
-      const babelOptions = this.options.babel = this.options.babel || {};
-
-      babelOptions.plugins = babelOptions.plugins || [];
-      babelOptions.postTransformPlugins = babelOptions.postTransformPlugins || [];
-
-      const strippedImports = {
-        'imports': {
-          'ember-attacher/-debug/helpers': [
-            'assert',
-            'debug',
-            'debugOnError',
-            'stripInProduction'
-          ]
-        }
-      };
-      babelOptions.plugins.push([FilterImports, strippedImports]);
-    }
-
-    this._hasSetupBabelOptions = true;
-  },
-
-  treeForAddon(tree) {
-    if (/production/.test(this._env)) {
-      tree = new Funnel(tree, { exclude: [/-debug/] });
-    }
-
-    return this._super.treeForAddon.call(this, tree);
-  },
-
-  treeForAddonTestSupport(tree) {
-    // intentionally not calling _super here
-    // so that can have our `import`'s be
-    // import { click, fillIn } from 'ember-native-dom-helpers';
-
-    const namespacedTree = new Funnel(tree, {
-      srcDir: '/',
-      destDir: `/${this.moduleName()}`,
-      annotation: `Addon#treeForTestSupport (${this.name})`
-    });
-
-    return this.preprocessJs(namespacedTree, '/', this.name, {
-      registry: this.registry
-    });
-  }
-};