feat(popover): add adaptivePosition option

.travis.yml

@@ -17,7 +17,7 @@ env:
     - BROWSER_PROVIDER_READY_FILE=/tmp/sauce-connect-ready
     - LOGS_DIR=/tmp/logs
     - CYPRESS_RECORD_KEY=4aa7a1c0-3a4f-444e-b324-6fc305a543a8
-    - NPM_AUTH_TOKEN_CI_PR=810c9089-b5e8-4348-8c89-61a1c2461d68
+    - NPM_AUTH_TOKEN_CI_PR=d05d9a8c-02db-413b-a412-aa27ab527213
 
 #     test cypress smoke
 testSmokeCy: &testSmokeCy

demo/src/app/components/+popover/demos/adaptive-position/adaptive-position.html

@@ -0,0 +1,15 @@
+<button type="button" class="btn btn-default btn-secondary"
+        popover="Vivamus sagittis lacus vel augue laoreet rutrum faucibus."
+        popoverTitle="Popover on top"
+        [adaptivePosition]="false"
+        placement="top">
+  Popover on top
+</button>
+
+<button type="button" class="btn btn-default btn-secondary"
+        popover="Vivamus sagittis lacus vel augue laoreet rutrum faucibus."
+        popoverTitle="Popover on right"
+        [adaptivePosition]="false"
+        placement="right">
+  Popover on right
+</button>

demo/src/app/components/+popover/demos/adaptive-position/adaptive-position.ts

@@ -0,0 +1,7 @@
+import { Component } from '@angular/core';
+
+@Component({
+  selector: 'demo-popover-adaptive-position',
+  templateUrl: './adaptive-position.html'
+})
+export class DemoPopoverAdaptivePositionComponent {}

demo/src/app/components/+popover/demos/index.ts

@@ -1,37 +1,39 @@
+import { DemoPopoverAdaptivePositionComponent } from './adaptive-position/adaptive-position';
 import { DemoPopoverBasicComponent } from './basic/basic';
-import { DemoPopoverPlacementComponent } from './placement/placement';
+import { DemoPopoverByIsOpenPropComponent } from './trigger-by-isopen-property/trigger-by-isopen-property';
+import { DemoPopoverClassComponent } from './class/class';
+import { DemoPopoverConfigComponent } from './config/config';
+import { DemoPopoverContainerComponent } from './container/container';
+import { DemoPopoverContextComponent } from './popover-context/popover-context';
+import { DemoPopoverCustomContentComponent } from './custom-content/custom-content';
 import { DemoPopoverDismissComponent } from './dismiss/dismiss';
 import { DemoPopoverDynamicComponent } from './dynamic/dynamic';
-import { DemoPopoverCustomContentComponent } from './custom-content/custom-content';
 import { DemoPopoverDynamicHtmlComponent } from './dynamic-html/dynamic-html';
-import { DemoPopoverContainerComponent } from './container/container';
-import { DemoPopoverConfigComponent } from './config/config';
+import { DemoPopoverEventsComponent } from './events/events';
+import { DemoPopoverOutsideClickComponent } from './outside-click/outside-click';
+import { DemoPopoverPlacementComponent } from './placement/placement';
 import { DemoPopoverStylingGlobalComponent } from './styling-global/styling-global';
 import { DemoPopoverStylingLocalComponent } from './styling-local/styling-local';
 import { DemoPopoverTriggersCustomComponent } from './triggers-custom/triggers-custom';
 import { DemoPopoverTriggersManualComponent } from './triggers-manual/triggers-manual';
-import { DemoPopoverByIsOpenPropComponent } from './trigger-by-isopen-property/trigger-by-isopen-property';
-import { DemoPopoverClassComponent } from './class/class';
-import { DemoPopoverOutsideClickComponent } from './outside-click/outside-click';
-import { DemoPopoverEventsComponent } from './events/events';
-import { DemoPopoverContextComponent } from './popover-context/popover-context';
 
 export const DEMO_COMPONENTS = [
+  DemoPopoverAdaptivePositionComponent,
   DemoPopoverBasicComponent,
-  DemoPopoverPlacementComponent,
+  DemoPopoverByIsOpenPropComponent,
+  DemoPopoverClassComponent,
+  DemoPopoverConfigComponent,
+  DemoPopoverContainerComponent,
+  DemoPopoverContextComponent,
+  DemoPopoverCustomContentComponent,
   DemoPopoverDismissComponent,
   DemoPopoverDynamicComponent,
-  DemoPopoverCustomContentComponent,
   DemoPopoverDynamicHtmlComponent,
-  DemoPopoverContainerComponent,
-  DemoPopoverConfigComponent,
+  DemoPopoverEventsComponent,
+  DemoPopoverOutsideClickComponent,
+  DemoPopoverPlacementComponent,
   DemoPopoverStylingGlobalComponent,
   DemoPopoverStylingLocalComponent,
   DemoPopoverTriggersCustomComponent,
-  DemoPopoverTriggersManualComponent,
-  DemoPopoverByIsOpenPropComponent,
-  DemoPopoverClassComponent,
-  DemoPopoverOutsideClickComponent,
-  DemoPopoverEventsComponent,
-  DemoPopoverContextComponent
+  DemoPopoverTriggersManualComponent
 ];

demo/src/app/components/+popover/popover-section.list.ts

@@ -1,20 +1,20 @@
+import { DemoPopoverAdaptivePositionComponent } from './demos/adaptive-position/adaptive-position';
 import { DemoPopoverBasicComponent } from './demos/basic/basic';
-import { DemoPopoverPlacementComponent } from './demos/placement/placement';
+import { DemoPopoverByIsOpenPropComponent } from './demos/trigger-by-isopen-property/trigger-by-isopen-property';
+import { DemoPopoverClassComponent } from './demos/class/class';
+import { DemoPopoverConfigComponent } from './demos/config/config';
+import { DemoPopoverContainerComponent } from './demos/container/container';
+import { DemoPopoverContextComponent } from './demos/popover-context/popover-context';
+import { DemoPopoverCustomContentComponent } from './demos/custom-content/custom-content';
 import { DemoPopoverDismissComponent } from './demos/dismiss/dismiss';
 import { DemoPopoverDynamicComponent } from './demos/dynamic/dynamic';
-import { DemoPopoverCustomContentComponent } from './demos/custom-content/custom-content';
 import { DemoPopoverDynamicHtmlComponent } from './demos/dynamic-html/dynamic-html';
-import { DemoPopoverContainerComponent } from './demos/container/container';
-import { DemoPopoverConfigComponent } from './demos/config/config';
+import { DemoPopoverEventsComponent } from './demos/events/events';
 import { DemoPopoverOutsideClickComponent } from './demos/outside-click/outside-click';
+import { DemoPopoverPlacementComponent } from './demos/placement/placement';
+import { DemoPopoverStylingLocalComponent } from './demos/styling-local/styling-local';
 import { DemoPopoverTriggersCustomComponent } from './demos/triggers-custom/triggers-custom';
 import { DemoPopoverTriggersManualComponent } from './demos/triggers-manual/triggers-manual';
-import { DemoPopoverByIsOpenPropComponent } from './demos/trigger-by-isopen-property/trigger-by-isopen-property';
-import { DemoPopoverStylingLocalComponent } from './demos/styling-local/styling-local';
-import { DemoPopoverClassComponent } from './demos/class/class';
-import { DemoPopoverContextComponent } from './demos/popover-context/popover-context';
-import { DemoPopoverStylingGlobalComponent } from './demos/styling-global/styling-global';
-import { DemoPopoverEventsComponent } from './demos/events/events';
 
 import { ContentSection } from '../../docs/models/content-section.model';
 import { DemoTopSectionComponent } from '../../docs/demo-section-components/demo-top-section/index';
@@ -57,6 +57,16 @@ export const demoComponentContent: ContentSection[] = [
         Besides that, <code>auto</code> option may be used to detect a position that fits the component on screen.</p>`,
         outlet: DemoPopoverPlacementComponent
       },
+      {
+        title: 'Disable adaptive position',
+        anchor: 'adaptive-position',
+        description: `
+          <p>You can disable adaptive position via <code>adaptivePosition</code> input or config option</p>
+        `,
+        component: require('!!raw-loader?lang=typescript!./demos/adaptive-position/adaptive-position.ts'),
+        html: require('!!raw-loader?lang=markup!./demos/adaptive-position/adaptive-position.html'),
+        outlet: DemoPopoverAdaptivePositionComponent
+      },
       {
         title: 'Dismiss on next click',
         anchor: 'popover-dismiss',
@@ -167,14 +177,7 @@ export const demoComponentContent: ContentSection[] = [
         component: require('!!raw-loader?lang=typescript!./demos/popover-context/popover-context.ts'),
         html: require('!!raw-loader?lang=markup!./demos/popover-context/popover-context.html'),
         outlet: DemoPopoverContextComponent
-      }/*,
-      {
-        title: 'Global styling',
-        anchor: 'styling-global',
-        component: require('!!raw-loader?lang=typescript!./demos/styling-global/styling-global.ts'),
-        html: require('!!raw-loader?lang=markup!./demos/styling-global/styling-global.html'),
-        outlet: DemoPopoverStylingGlobalComponent
-      }*/
+      }
     ]
   },
   {

demo/src/app/components/+tooltip/demos/index.ts

@@ -1,31 +1,31 @@
 import { DemoTooltipBasicComponent } from './basic/basic';
-import { DemoTooltipPlacementComponent } from './placement/placement';
-import { DemoTooltipDismissComponent } from './dismiss/dismiss';
-import { DemoTooltipDynamicComponent } from './dynamic/dynamic';
+import { DemoTooltipClassComponent } from './class/class';
 import { DemoTooltipConfigComponent } from './config/config';
 import { DemoTooltipContainerComponent } from './container/container';
+import { DemoTooltipCustomContentComponent } from './custom-content/custom-content';
+import { DemoTooltipDelayComponent } from './delay/delay';
+import { DemoTooltipDismissComponent } from './dismiss/dismiss';
+import { DemoTooltipDynamicComponent } from './dynamic/dynamic';
+import { DemoTooltipDynamicHtmlComponent } from './dynamic-html/dynamic-html';
+import { DemoTooltipPlacementComponent } from './placement/placement';
 import { DemoTooltipStylingGlobalComponent } from './styling-global/styling-global';
 import { DemoTooltipStylingLocalComponent } from './styling-local/styling-local';
 import { DemoTooltipTriggersCustomComponent } from './triggers-custom/triggers-custom';
 import { DemoTooltipTriggersManualComponent } from './triggers-manual/triggers-manual';
-import { DemoTooltipDynamicHtmlComponent } from './dynamic-html/dynamic-html';
-import { DemoTooltipClassComponent } from './class/class';
-import { DemoTooltipDelayComponent } from './delay/delay';
-import { DemoTooltipCustomContentComponent } from './custom-content/custom-content';
 
 export const DEMO_COMPONENTS = [
   DemoTooltipBasicComponent,
-  DemoTooltipPlacementComponent,
-  DemoTooltipDismissComponent,
+  DemoTooltipClassComponent,
+  DemoTooltipConfigComponent,
+  DemoTooltipContainerComponent,
   DemoTooltipCustomContentComponent,
+  DemoTooltipDelayComponent,
+  DemoTooltipDismissComponent,
   DemoTooltipDynamicComponent,
   DemoTooltipDynamicHtmlComponent,
-  DemoTooltipContainerComponent,
-  DemoTooltipConfigComponent,
+  DemoTooltipPlacementComponent,
   DemoTooltipStylingGlobalComponent,
   DemoTooltipStylingLocalComponent,
   DemoTooltipTriggersCustomComponent,
-  DemoTooltipTriggersManualComponent,
-  DemoTooltipClassComponent,
-  DemoTooltipDelayComponent
+  DemoTooltipTriggersManualComponent
 ];

demo/src/app/components/+tooltip/tooltip-section.list.ts

@@ -1,15 +1,16 @@
 import { DemoTooltipBasicComponent } from './demos/basic/basic';
-import { DemoTooltipPlacementComponent } from './demos/placement/placement';
+import { DemoTooltipClassComponent } from './demos/class/class';
+import { DemoTooltipConfigComponent } from './demos/config/config';
+import { DemoTooltipContainerComponent } from './demos/container/container';
+import { DemoTooltipCustomContentComponent } from './demos/custom-content/custom-content';
+import { DemoTooltipDelayComponent } from './demos/delay/delay';
 import { DemoTooltipDismissComponent } from './demos/dismiss/dismiss';
 import { DemoTooltipDynamicComponent } from './demos/dynamic/dynamic';
 import { DemoTooltipDynamicHtmlComponent } from './demos/dynamic-html/dynamic-html';
-import { DemoTooltipContainerComponent } from './demos/container/container';
-import { DemoTooltipConfigComponent } from './demos/config/config';
+import { DemoTooltipPlacementComponent } from './demos/placement/placement';
+import { DemoTooltipStylingLocalComponent } from './demos/styling-local/styling-local';
 import { DemoTooltipTriggersCustomComponent } from './demos/triggers-custom/triggers-custom';
 import { DemoTooltipTriggersManualComponent } from './demos/triggers-manual/triggers-manual';
-import { DemoTooltipStylingLocalComponent } from './demos/styling-local/styling-local';
-import { DemoTooltipClassComponent } from './demos/class/class';
-import { DemoTooltipStylingGlobalComponent } from './demos/styling-global/styling-global';
 
 import { ContentSection } from '../../docs/models/content-section.model';
 import { DemoTopSectionComponent } from '../../docs/demo-section-components/demo-top-section/index';
@@ -20,8 +21,6 @@ import {
   NgApiDocComponent,
   NgApiDocConfigComponent
 } from '../../docs/api-docs';
-import { DemoTooltipDelayComponent } from './demos/delay/delay';
-import { DemoTooltipCustomContentComponent } from './demos/custom-content/custom-content';
 
 export const demoComponentContent: ContentSection[] = [
   {

demo/src/app/components/+typeahead/demos/adaptive-position/adaptive-position.html

@@ -1,5 +1,5 @@
 <pre class="card card-block card-header mb-3">Model: {{selected | json}}</pre>
 <input [(ngModel)]="selected"
        [typeahead]="states"
-       adaptivePosition="true"
+       [adaptivePosition]="true"
        class="form-control">