├── .github
    ├── ISSUE_TEMPLATE
    │   └── bug_report.md
    └── workflows
    │   ├── gh-pages.yaml
    │   ├── main.yml
    │   └── npm-publish-github-packages.yml
├── .gitignore
├── .yarnrc.yml
├── LICENSE
├── README.md
├── angular.json
├── browserslist
├── changelog.md
├── gulpfile.js
├── package.json
├── projects
    ├── ngx-float-ui-repo
    │   ├── karma.conf.js
    │   ├── src
    │   │   ├── app
    │   │   │   ├── app.component.html
    │   │   │   ├── app.component.scss
    │   │   │   ├── app.component.ts
    │   │   │   ├── app.module.ts
    │   │   │   ├── components
    │   │   │   │   ├── demo
    │   │   │   │   │   ├── demo.component.html
    │   │   │   │   │   ├── demo.component.scss
    │   │   │   │   │   └── demo.component.ts
    │   │   │   │   └── test
    │   │   │   │   │   ├── test.component.html
    │   │   │   │   │   ├── test.component.scss
    │   │   │   │   │   └── test.component.ts
    │   │   │   └── shared
    │   │   │   │   ├── ngx-float-ui-article-types.model.ts
    │   │   │   │   └── ngx-float-ui-code-map.const.ts
    │   │   ├── assets
    │   │   │   ├── .gitkeep
    │   │   │   ├── favicon
    │   │   │   │   └── favicon.ico
    │   │   │   ├── fonts
    │   │   │   │   ├── luckiest-guy-latin-400.woff
    │   │   │   │   └── luckiest-guy-latin-400.woff2
    │   │   │   ├── images
    │   │   │   │   ├── ngx-popperjs-logo.svg
    │   │   │   │   ├── popcorn-box.svg
    │   │   │   │   ├── popper-icon.eps
    │   │   │   │   ├── popper-icon.svg
    │   │   │   │   ├── popper-logo-outlined.svg
    │   │   │   │   └── popper-logo.svg
    │   │   │   └── messages.json
    │   │   ├── environments
    │   │   │   ├── environment.prod.ts
    │   │   │   └── environment.ts
    │   │   ├── index.html
    │   │   ├── main.ts
    │   │   ├── polyfills.ts
    │   │   ├── scss
    │   │   │   ├── code-highlight.scss
    │   │   │   ├── popper-theme.scss
    │   │   │   ├── responsive.scss
    │   │   │   └── vars.scss
    │   │   ├── styles.scss
    │   │   ├── test.ts
    │   │   └── typewriter.d.ts
    │   ├── tsconfig.app.json
    │   ├── tsconfig.spec.json
    │   └── tslint.json
    └── ngx-float-ui
    │   ├── karma.conf.js
    │   ├── ng-package.json
    │   ├── package.json
    │   ├── src
    │       ├── lib
    │       │   ├── _index.scss
    │       │   ├── components
    │       │   │   └── ngx-float-ui-content
    │       │   │   │   ├── ngx-float-ui-content.component.html
    │       │   │   │   ├── ngx-float-ui-content.component.scss
    │       │   │   │   └── ngx-float-ui-content.component.ts
    │       │   ├── directives
    │       │   │   └── ngx-float-ui
    │       │   │   │   ├── ngx-float-ui-loose.directive.ts
    │       │   │   │   ├── ngx-float-ui.directive.spec.ts
    │       │   │   │   └── ngx-float-ui.directive.ts
    │       │   ├── models
    │       │   │   ├── ngx-float-ui-defaults.model.ts
    │       │   │   ├── ngx-float-ui-options.model.ts
    │       │   │   ├── ngx-float-ui-placements.model.ts
    │       │   │   ├── ngx-float-ui-triggers.model.ts
    │       │   │   └── ngx-float-ui-utils.class.ts
    │       │   ├── ngx-float-ui.module.spec.ts
    │       │   ├── ngx-float-ui.module.ts
    │       │   └── scss
    │       │   │   ├── theme-dark.scss
    │       │   │   ├── theme-white.scss
    │       │   │   └── theme.scss
    │       ├── public-api.ts
    │       └── test.ts
    │   ├── tsconfig.lib.json
    │   └── tsconfig.spec.json
├── symlink.js
├── tsbl.js
├── tsconfig.json
├── tslint.json
└── yarn.lock


/.github/ISSUE_TEMPLATE/bug_report.md:
--------------------------------------------------------------------------------
 1 | ---
 2 | name: BUGS ONLY!
 3 | about: DO NOT OPEN TO ASK FOR NEXT VERSION!
 4 | title: 'BUG: your summary here'
 5 | labels: ''
 6 | assignees: ''
 7 | 
 8 | ---
 9 | 
10 | **NOTE**
11 | 
12 | **REQUESTS WILL BE IMMEDIATELY DELETED, you cannot do feature requests such as "Update to Angular xx"**
13 | I deal with updates with my own schedule, don't need a reminder. 
14 | 
15 | **Describe the bug**
16 | A clear and concise description of what the bug is.
17 | 
18 | **To Reproduce**
19 | Possibly create a stackblitz reproducing the bug, or a zip with basic sources for a reproduction
20 | 
21 | OR
22 | 
23 | Steps to reproduce the behavior:
24 | 1. Go to '...'
25 | 2. Click on '....'
26 | 3. Scroll down to '....'
27 | 4. See error
28 | 
29 | **Expected behavior**
30 | A clear and concise description of what you expected to happen.
31 | 
32 | **Screenshots**
33 | If applicable, add screenshots to help explain your problem.
34 | 
35 | **Desktop (if execution):**
36 |  - OS: [e.g. iOS]
37 |  - Browser [e.g. chrome, safari]
38 | 
39 | ** Versions
40 |  - ngx-float-ui version [e.g. 9.0.0]
41 |  - @angular/core version [e.g. 10.2.3]
42 |  - @angular/material version [e.g. 10.2.7]
43 |  - typescript version [es. 3.9.2]
44 | 
45 | **Additional context (optional)**
46 | Add any other context about the problem here.
47 | 
48 | 
49 | **Additional context**
50 | Add any other context about the problem here.
51 | 


--------------------------------------------------------------------------------
/.github/workflows/gh-pages.yaml:
--------------------------------------------------------------------------------
 1 | # Sample workflow for building and deploying a Nuxt site to GitHub Pages
 2 | #
 3 | # To get started with Nuxt see: https://nuxtjs.org/docs/get-started/installation
 4 | #
 5 | name: Build and deploy Angular site to Pages
 6 | 
 7 | on:
 8 |   # Runs on pushes targeting the default branch
 9 |   push:
10 |     branches: [ "master" ]
11 | 
12 |   # Allows you to run this workflow manually from the Actions tab
13 |   workflow_dispatch:
14 | 
15 | # Sets permissions of the GITHUB_TOKEN to allow deployment to GitHub Pages
16 | permissions:
17 |   contents: read
18 |   pages: write
19 |   id-token: write
20 | 
21 | # Allow one concurrent deployment
22 | concurrency:
23 |   group: "pages"
24 |   cancel-in-progress: true
25 | 
26 | jobs:
27 |   # Build job
28 |   build:
29 |     runs-on: ubuntu-latest
30 |     steps:
31 |       - name: Checkout
32 |         uses: actions/checkout@v4
33 |       - name: Enable corepack
34 |         run: corepack enable
35 |       - name: Detect package manager
36 |         id: detect-package-manager
37 |         run: |
38 |           if [ -f "${{ github.workspace }}/yarn.lock" ]; then
39 |             echo "manager=yarn" >> $GITHUB_OUTPUT
40 |             echo "command=install" >> $GITHUB_OUTPUT
41 |             exit 0
42 |           elif [ -f "${{ github.workspace }}/package.json" ]; then
43 |             echo "manager=npm" >> $GITHUB_OUTPUT
44 |             echo "command=ci" >> $GITHUB_OUTPUT
45 |             exit 0
46 |           else
47 |             echo "Unable to determine packager manager"
48 |             exit 1
49 |           fi
50 |       - name: Setup Node
51 |         uses: actions/setup-node@v3
52 |         with:
53 |           node-version: "22.16.0"
54 |           cache: ${{ steps.detect-package-manager.outputs.manager }}
55 |       - name: Restore cache
56 |         uses: actions/cache@v3
57 |         with:
58 |           path: |
59 |             dist
60 |             .angular
61 |           key: ${{ runner.os }}-angular-build-${{ hashFiles('dist') }}
62 |           restore-keys: |
63 |             ${{ runner.os }}-angular-build-
64 |       - name: Enable corepack
65 |         run: corepack enable
66 |       - name: Install dependencies
67 |         run: ${{ steps.detect-package-manager.outputs.manager }} ${{ steps.detect-package-manager.outputs.command }}
68 |       - name: Static HTML export Angular
69 |         run: ${{ steps.detect-package-manager.outputs.manager }} run build:demo
70 |       - name: Upload artifact
71 |         uses: actions/upload-pages-artifact@v3.0.1
72 |         with:
73 |           path: ./dist/ngx-float-ui-repo
74 | 
75 |   # Deployment job
76 |   deploy:
77 |     environment:
78 |       name: github-pages
79 |       url: ${{ steps.deployment.outputs.page_url }}
80 |     runs-on: ubuntu-latest
81 |     needs: build
82 |     steps:
83 |       - name: Deploy to GitHub Pages
84 |         id: deployment
85 |         uses: actions/deploy-pages@v4.0.5
86 | 


--------------------------------------------------------------------------------
/.github/workflows/main.yml:
--------------------------------------------------------------------------------
 1 | # This workflow will do a clean installation of node dependencies, cache/restore them, build the source code and run tests across different versions of node
 2 | # For more information see: https://docs.github.com/en/actions/automating-builds-and-tests/building-and-testing-nodejs
 3 | 
 4 | name: Node.js CI
 5 | 
 6 | on:
 7 |   push:
 8 |     branches: [ "master" ]
 9 |   pull_request:
10 |     branches: [ "master" ]
11 | 
12 | jobs:
13 |   build:
14 | 
15 |     runs-on: ubuntu-latest
16 | 
17 |     strategy:
18 |       matrix:
19 |         node-version: [22.16.0]
20 |         # See supported Node.js release schedule at https://nodejs.org/en/about/releases/
21 |     steps:
22 |     - uses: actions/checkout@v3
23 |     - name: Use Node.js ${{ matrix.node-version }}
24 |       uses: actions/setup-node@v3
25 |       with:
26 |         node-version: ${{ matrix.node-version }}
27 |         cache: 'npm'
28 |     - run: corepack enable
29 |     - run: yarn install
30 |     - run: npm run test:ci
31 |     - run: npm run build
32 | 


--------------------------------------------------------------------------------
/.github/workflows/npm-publish-github-packages.yml:
--------------------------------------------------------------------------------
 1 | # This workflow will run tests using node and then publish a package to GitHub Packages when a release is created
 2 | # For more information see: https://docs.github.com/en/actions/publishing-packages/publishing-nodejs-packages
 3 | 
 4 | name: Publish on NPM
 5 | 
 6 | on:
 7 |     release:
 8 |         types: [ created ]
 9 | 
10 | jobs:
11 |     build:
12 |         runs-on: ubuntu-latest
13 |         steps:
14 |             -   uses: actions/checkout@v3
15 |             -   uses: actions/setup-node@v3
16 |                 with:
17 |                     node-version: 22.16.0
18 |                     registry-url: https://registry.npmjs.org/
19 |             -   run: corepack enable
20 |             -   run: yarn install
21 |             -   run: npm run build
22 |             -   run: |
23 |                     pkgversion=$(node -p -e "require('./package.json').version")
24 |                     if [[ $pkgversion == *"beta"*  || $pkgversion =~ -rc\.[0-9]+$ ]]; then
25 |                         npm run release:beta
26 |                     else
27 |                         npm run release
28 |                     fi
29 |                 env:
30 |                     NODE_AUTH_TOKEN: ${{secrets.NPM_TOKEN}}
31 | 


--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
 1 | # See http://help.github.com/ignore-files/ for more about ignoring files.
 2 | 
 3 | # compiled output
 4 | /dist
 5 | /tmp
 6 | /out-tsc
 7 | # Only exists if Bazel was run
 8 | /bazel-out
 9 | 
10 | # angular cache
11 | .angular
12 | 
13 | # dependencies
14 | /node_modules
15 | /_node_modules
16 | 
17 | # profiling files
18 | chrome-profiler-events*.json
19 | speed-measure-plugin*.json
20 | 
21 | # IDEs and editors
22 | /.idea
23 | .project
24 | .classpath
25 | .c9/
26 | *.launch
27 | .settings/
28 | *.sublime-workspace
29 | 
30 | # IDE - VSCode
31 | .vscode/*
32 | !.vscode/settings.json
33 | !.vscode/tasks.json
34 | !.vscode/launch.json
35 | !.vscode/extensions.json
36 | .history/*
37 | 
38 | # misc
39 | /.sass-cache
40 | /connect.lock
41 | /coverage
42 | /libpeerconnection.log
43 | npm-debug.log
44 | yarn-error.log
45 | testem.log
46 | /typings
47 | 
48 | # System Files
49 | .DS_Store
50 | Thumbs.db
51 | 
52 | package-lock.json
53 | /.yarn/install-state.gz
54 | 


--------------------------------------------------------------------------------
/.yarnrc.yml:
--------------------------------------------------------------------------------
1 | nodeLinker: node-modules
2 | 


--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
 1 | MIT License
 2 | 
 3 | Copyright (c) 2023 Tony Samperi
 4 | 
 5 | Permission is hereby granted, free of charge, to any person obtaining a copy
 6 | of this software and associated documentation files (the "Software"), to deal
 7 | in the Software without restriction, including without limitation the rights
 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
 9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 | 
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 | 
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 | 


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
  1 | # ngx-float-ui  
  2 | 
  3 | [![npm][badge-npm-version]][url-npm] [![npm][badge-npm-downloads]][url-npm] [![MIT licensed][badge-licence]][url-licence] [![Build state][badge-ci-state]][url-ci-state] [![Size][badge-bundle]][url-bundle] [![Rate this package][badge-openbase]][url-openbase]
  4 | 
  5 | ngx-float-ui is an angular wrapper for the [FloatingUI](https://floating-ui.com/) library (v ^1.5.3).
  6 | 
  7 | ## VERY IMPORTANT READ THIS
  8 | I'm moving this to the top because it appears that people don't get to reading it in the **contribute** section.
  9 | FOR THIS LIBRARY **PLEASE USE ISSUES ONLY FOR BUG REPORTING**. DON'T OPEN ISSUES SUCH AS "I need upgrade for Angular 1745646456" especially if Angular 1745646456 was released a few days ago.
 10 | I **guarantee** that I manage the updates **AS SOON AS POSSIBLE**. But as you understand this is not a paying job, so you can't get Angular 1745646456 the day it gets released.
 11 | **ISSUES NOT RESPECTING THIS WILL BE DELETED IMMEDIATELY WITHOUT ANY RESPONSE**.
 12 | Thank you.
 13 | 
 14 | ### Premise
 15 | 
 16 | The goal of this library is to adopt the more promising technology of floating-ui instead of popper.js and make it available in our Angular projects.
 17 | 
 18 | ### Installation
 19 | 
 20 | node and npm are required to run this package.
 21 | 
 22 | 1. Use npm/yarn to install the package:
 23 | 
 24 |   ```terminal
 25 |   $ npm install @floating-ui/dom ngx-float-ui --save
 26 |   ```
 27 |   
 28 |   Or 
 29 |   
 30 |    ```terminal
 31 |     $ yarn add @floating-ui/dom --save
 32 |     $ yarn add ngx-float-ui --save 
 33 |   ```
 34 | 
 35 | 2. You simply add into your module `NgxFloatUiModule`:
 36 | 
 37 |   ```typescript
 38 |   import {NgxFloatUiModule} from 'ngx-float-ui';
 39 |   
 40 |   @NgModule({
 41 |    // ...
 42 |    imports: [
 43 |      // ...
 44 |      NgxFloatUiModule
 45 |    ]
 46 |   })
 47 |   ```
 48 | 
 49 | Optionally you can include in your `styles.css` / `styles.css` one of the prebuilt themes:
 50 | * `@import node_modules/ngx-float-ui/css/theme-dark.css`
 51 | * `@import node_modules/css/theme-white.css`
 52 | 
 53 | * `@use ngx-float-ui/scss/theme as floatUiBaseTheme`
 54 | * `@use ngx-float-ui/scss/theme-dark as floatUiDarkTheme`
 55 | * `@use ngx-float-ui/scss/theme-white floatUiWhiteTheme`
 56 | 
 57 | or easily create your own theme using the @mixin:
 58 | 
 59 | ```
 60 | @use "ngx-float-ui/scss/theme" as floatUiBaseTheme;
 61 | 
 62 | body {
 63 |     @include floatUiBaseTheme.ngx-float-ui-theme($background-color, $text-color, $max-width, $z-index);
 64 | }
 65 | ```
 66 | 
 67 | 3. Add to view:
 68 | 
 69 |   ```HTML  
 70 |    <float-ui-content #popper1Content>
 71 |        <p class="bold">Popper on bottom</p>
 72 |    </float-ui-content>
 73 |    <div [floatUi]="popper1Content"
 74 |         [showOnStart]="true"
 75 |         [showTrigger]="'click'"
 76 | 		hideOnClickOutside
 77 |         [hideOnScroll]="true"
 78 |         [placement]="'bottom'">
 79 |        <p class="bold">Hey!</p>
 80 |        <p class="thin">Choose where to put your popper!</p>         
 81 |    </div>
 82 |   ```
 83 | 
 84 | 4. As text:
 85 |  ```HTML
 86 |       <div floatUi="As text"
 87 |            [showTrigger]="'hover'"
 88 |            [placement]="'bottom'"
 89 |            (onShown)="onShown($event)">
 90 |         <p class="bold">Pop</p>
 91 |         <p class="thin">on the bottom</p>
 92 |       </div>
 93 |  ```
 94 | 
 95 |   ```HTML
 96 |        <div floatUi="{{someTextProperty}}"
 97 |             [showTrigger]="'hover'"
 98 |             [placement]="'bottom'"
 99 |             [styles]="{'background-color: 'blue''}"
100 |             (onShown)="onShown($event)">
101 |          <p class="bold">Pop</p>
102 |          <p class="thin">on the bottom</p>
103 |        </div>
104 |   ```
105 |  
106 |   5. Position fixed, breaking overflow:
107 |    ```HTML
108 |         <div floatUi="As text"
109 |              [showTrigger]="'hover'"
110 |              [placement]="'bottom'"
111 |              [positionFixed]="true"
112 |              (onShown)="onShown($event)">
113 |         </div>
114 |    ```
115 |  
116 |  6. Specific target:
117 |   ```HTML
118 |  <div class="example">
119 |        <div #popperTargetElement></div>
120 |        <div floatUi="As text"
121 |             showTrigger="hover"
122 |             placement="bottom"
123 |             [targetElement]="popperTargetElement.nativeElement"
124 |             (onShown)="onShown($event)">
125 |        </div>
126 |   ```
127 |   
128 | 7. hide/show programmatically:
129 |   ```HTML
130 |    <div [floatUi]="tooltipcontent"
131 |         showTrigger="hover"
132 |         placement="bottom"
133 |         [applyClass]="'popperSpecialStyle'">
134 |         <p class="bold">Pop</p>
135 |         <p class="thin">on the bottom</p>
136 |       </div>
137 |       <float-ui-content #tooltipcontent>
138 |         <div>
139 |           <p>This is a tooltip with text</p>
140 |           <span (click)="tooltipcontent.hide()">Close</span>
141 |         </div>
142 |       </float-ui-content>
143 |   ```
144 |  
145 | 8. Attributes map:  
146 |   
147 |     | Option             | Type              | Default   | Description                                                                            |
148 |     |:-------------------|:----------------  |:--------- |:---------------------------------------------------------------------------------------|
149 |     | disableAnimation   | boolean           | false     | Disable the default animation on show/hide                                             |
150 |     | disableStyle       | boolean           | false     | Disable the default styling                                                            |
151 |     | disabled           | boolean           | false     | Disable the popper, ignore all events                                                  |
152 |     | showDelay          | number            | 0         | Delay time until popper it shown                                                       |
153 |     | hideTimeout        | number            | 0         | Set delay before the popper is hidden                                                  |
154 |     | timeoutAfterShow   | number            | 0         | Set a time on which the popper will be hidden after it is shown                        |
155 |     | placement          | Placement(string) | auto      | The placement to show the popper relative to the reference element *                   |
156 |     | targetElement      | HtmlElement       | auto      | Specify a different reference element other the the one hosting the directive          |
157 |     | boundaries         | string(selector)  | undefined | Specify a selector to serve as the boundaries of the element                           |
158 |     | showOnStart        | boolean           | false     | Popper default to show                                                                 |
159 |     | showTrigger        | Trigger(string)   | click     | Trigger/Event on which to show/hide the popper                                         |
160 |     | positionFixed      | boolean           | false     | Set the popper element to use position: fixed                                          |
161 |     | appendTo           | string            | undefined | append The popper-floatUi element to a given selector, if multiple will apply to first |
162 |     | preventOverflow    | boolean           | undefined | Prevent the popper from being positioned outside the boundary *                        |
163 |     | hideOnClickOutside | boolean           | true      | Popper will hide on a click outside                                                    |
164 |     | hideOnScroll       | boolean           | false     | Popper will hide on scroll                                                             |
165 |     | hideOnMouseLeave   | boolean           | false     | Popper will hide on mouse leave                                                        |
166 |     | applyClass         | string            | undefined | list of comma separated class to apply on ngpx__container                              |
167 |     | styles             | Object            | undefined | Apply the styles object, aligned with ngStyles                                         |
168 |     | applyArrowClass    | string            | undefined | list of comma separated class to apply on ngpx__arrow                                  |
169 |     | onShown            | EventEmitter<>    | $event    | Event handler when popper is shown                                                     |
170 |     | onHidden           | EventEmitter<>    | $event    | Event handler when popper is hidden                                                    |
171 |     | onUpdate           | EventEmitter<>    | $event    | Event handler when popper is updated                                                   |
172 |     | ariaDescribeBy     | string            | undefined | Define value for aria-describeby attribute                                             |
173 |     | ariaRole           | string            | popper    | Define value for aria-role attribute                                                   |
174 | 
175 | \* **VERY IMPORTANT**: All the "auto" placements can't be used in combo with prevent overflow (as per float-ui specs), because the two algorythms **would conflict**, ending in infinite repositioning.
176 | See [here](https://floating-ui.com/docs/autoPlacement#usage)
177 | 
178 | 9. Override defaults:
179 | 
180 |     ngx-float-ui comes with a few default properties you can override in default to effect all instances
181 |     These are overridden by any child attributes.
182 | 
183 | ```JavaScript
184 | NgModule({
185 |     imports: [
186 |         BrowserModule,
187 |         FormsModule,
188 |         NgxFloatUiModule.forRoot({placement: NgxFloatUiPlacements.TOP})],
189 |     declarations: [AppComponent],
190 |     providers: [],
191 |     bootstrap: [AppComponent]
192 | 
193 | });
194 | ```
195 |   
196 |    | Options               | Type                             | Default   |
197 |    |:----------------------|:---------------------------------|:----------|
198 |    | showDelay             | number                           | 0         |
199 |    | disableAnimation      | boolean                          | false     |
200 |    | disableDefaultStyling | boolean                          | false     |
201 |    | placement             | NgxFloatUiPopPlacements (string) | auto      |
202 |    | boundariesElement     | string(selector)                 | undefined |
203 |    | showTrigger           | NgxFloatUiTriggers (string)      | hover     |
204 |    | positionFixed         | boolean                          | false     |
205 |    | hideOnClickOutside    | boolean                          | true      |
206 |    | hideOnMouseLeave      | boolean                          | false     |
207 |    | hideOnScroll          | boolean                          | false     |
208 |    | applyClass            | string                           | undefined |
209 |    | styles                | Object                           | undefined |
210 |    | applyArrowClass       | string                           | undefined |
211 |    | ariaDescribeBy        | string                           | undefined |
212 |    | ariaRole              | string                           | undefined |
213 |    | appendTo              | string                           | undefined |
214 |    | preventOverflow       | boolean                          | undefined |
215 | 
216 | 10. NgxFloatUiPopPlacements:
217 | 
218 |   | 'top'
219 |   | 'bottom'
220 |   | 'left'
221 |   | 'right'
222 |   | 'top-start'
223 |   | 'bottom-start'
224 |   | 'left-start'
225 |   | 'right-start'
226 |   | 'top-end'
227 |   | 'bottom-end'
228 |   | 'left-end'
229 |   | 'right-end'
230 |   | 'auto'
231 |   | 'auto-start'
232 |   | 'auto-end'
233 |   
234 | 11. NgxFloatUiTriggers:
235 | 
236 |   | 'click'
237 |   | 'mousedown'
238 |   | 'hover'
239 |   | 'none'
240 | 
241 | ### Liking hardcoded strings everywhere? Too lazy to use Enums? No problem mate!
242 | 
243 | `floatUiLoose` is what you're looking for!
244 | 
245 | You can then use `loosePlacement` and `looseTrigger` passing the values above as strings!
246 |     
247 | ### Demo site with sample codes
248 | <a href="https://tonysamperi.github.io/ngx-float-ui/">Demo of ngx-float-ui</a>
249 | 
250 | ### Contribute
251 |   You can only **report bugs**. Every other issue will be deleted right away.
252 |   
253 | ```terminal
254 |   $ npm install
255 |   $ npm run start  //run example
256 | ```
257 | 
258 | ## License
259 | 
260 | This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details
261 | 
262 | ### Thanks to
263 | 
264 | The developers of Floating UI
265 | 
266 | [badge-bundle]: https://img.shields.io/bundlephobia/minzip/ngx-float-ui
267 | [badge-ci-state]: https://github.com/tonysamperi/ngx-float-ui/actions/workflows/main.yml/badge.svg
268 | [badge-licence]: https://img.shields.io/badge/license-MIT-blue.svg?style=flat-square
269 | [badge-npm-downloads]: https://img.shields.io/npm/dm/ngx-float-ui.svg?style=flat-square
270 | [badge-npm-version]: https://img.shields.io/npm/v/ngx-float-ui.svg?style=flat-square
271 | [badge-openbase]: https://badges.openbase.com/js/rating/ngx-float-ui.svg
272 | [url-bundle]: https://img.shields.io/bundlephobia/minzip/ngx-float-ui
273 | [url-ci-state]: https://github.com/tonysamperi/ngx-float-ui/actions
274 | [url-licence]: https://github.com/tonysamperi/ngx-float-ui/blob/master/LICENSE
275 | [url-npm]: https://www.npmjs.com/package/ngx-float-ui
276 | [url-openbase]: https://openbase.com/js/ngx-float-ui
277 | 


--------------------------------------------------------------------------------
/angular.json:
--------------------------------------------------------------------------------
  1 | {
  2 |   "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
  3 |   "version": 1,
  4 |   "newProjectRoot": "projects",
  5 |   "projects": {
  6 |     "ngx-float-ui": {
  7 |       "projectType": "library",
  8 |       "root": "projects/ngx-float-ui",
  9 |       "sourceRoot": "projects/ngx-float-ui/src",
 10 |       "prefix": "lib",
 11 |       "architect": {
 12 |         "build": {
 13 |           "builder": "@angular-devkit/build-ng-packagr:build",
 14 |           "options": {
 15 |             "tsConfig": "projects/ngx-float-ui/tsconfig.lib.json",
 16 |             "project": "projects/ngx-float-ui/ng-package.json"
 17 |           },
 18 |           "configurations": {
 19 |             "production": {
 20 |             }
 21 |           }
 22 |         },
 23 |         "test": {
 24 |           "builder": "@angular-devkit/build-angular:karma",
 25 |           "options": {
 26 |             "main": "projects/ngx-float-ui/src/test.ts",
 27 |             "tsConfig": "projects/ngx-float-ui/tsconfig.spec.json",
 28 |             "karmaConfig": "projects/ngx-float-ui/karma.conf.js",
 29 |             "polyfills": "projects/ngx-float-ui-repo/src/polyfills.ts",
 30 |             "styles": [
 31 |               "projects/ngx-float-ui-repo/src/styles.scss"
 32 |             ]
 33 |           }
 34 |         },
 35 |         "lint": {
 36 |           "builder": "@angular-devkit/build-angular:tslint",
 37 |           "options": {
 38 |             "tsConfig": [
 39 |               "projects/ngx-float-ui/tsconfig.lib.json",
 40 |               "projects/ngx-float-ui/tsconfig.spec.json"
 41 |             ],
 42 |             "exclude": [
 43 |               "**/node_modules/**"
 44 |             ]
 45 |           }
 46 |         }
 47 |       }
 48 |     },
 49 |     "ngx-float-ui-repo": {
 50 |       "projectType": "application",
 51 |       "schematics": {
 52 |         "@schematics/angular:component": {
 53 |           "style": "scss"
 54 |         }
 55 |       },
 56 |       "root": "projects/ngx-float-ui-repo",
 57 |       "sourceRoot": "projects/ngx-float-ui-repo/src",
 58 |       "prefix": "app",
 59 |       "architect": {
 60 |         "build": {
 61 |           "builder": "@angular-devkit/build-angular:application",
 62 |           "options": {
 63 |             "outputPath": {
 64 |               "base": "dist/ngx-float-ui-repo",
 65 |               "browser": ""
 66 |             },
 67 |             "index": "projects/ngx-float-ui-repo/src/index.html",
 68 |             "polyfills": [
 69 |               "projects/ngx-float-ui-repo/src/polyfills.ts"
 70 |             ],
 71 |             "tsConfig": "projects/ngx-float-ui-repo/tsconfig.app.json",
 72 |             "aot": false,
 73 |             "assets": [
 74 |               "projects/ngx-float-ui-repo/src/favicon.ico",
 75 |               "projects/ngx-float-ui-repo/src/assets"
 76 |             ],
 77 |             "styles": [
 78 |               "projects/ngx-float-ui-repo/src/styles.scss"
 79 |             ],
 80 |             "scripts": [],
 81 |             "browser": "projects/ngx-float-ui-repo/src/main.ts"
 82 |           },
 83 |           "configurations": {
 84 |             "dev": {
 85 |               "optimization": false,
 86 |               "outputHashing": "none",
 87 |               "sourceMap": true,
 88 |               "namedChunks": false,
 89 |               "extractLicenses": false
 90 |             },
 91 |             "production": {
 92 |               "fileReplacements": [
 93 |                 {
 94 |                   "replace": "projects/ngx-float-ui-repo/src/environments/environment.ts",
 95 |                   "with": "projects/ngx-float-ui-repo/src/environments/environment.prod.ts"
 96 |                 }
 97 |               ],
 98 |               "optimization": true,
 99 |               "outputHashing": "all",
100 |               "sourceMap": false,
101 |               "namedChunks": false,
102 |               "aot": true,
103 |               "extractLicenses": true,
104 |               "budgets": [
105 |                 {
106 |                   "type": "initial",
107 |                   "maximumWarning": "2mb",
108 |                   "maximumError": "5mb"
109 |                 },
110 |                 {
111 |                   "type": "anyComponentStyle",
112 |                   "maximumWarning": "15kb",
113 |                   "maximumError": "30kb"
114 |                 }
115 |               ]
116 |             }
117 |           }
118 |         },
119 |         "serve": {
120 |           "builder": "@angular-devkit/build-angular:dev-server",
121 |           "options": {
122 |             "buildTarget": "ngx-float-ui-repo:build"
123 |           },
124 |           "configurations": {
125 |             "development": {
126 |               "buildTarget": "ngx-float-ui-repo:build:dev"
127 |             },
128 |             "production": {
129 |               "buildTarget": "ngx-float-ui-repo:build:production"
130 |             }
131 |           },
132 |           "defaultConfiguration": "development"
133 |         },
134 |         "extract-i18n": {
135 |           "builder": "@angular-devkit/build-angular:extract-i18n",
136 |           "options": {
137 |             "buildTarget": "ngx-float-ui-repo:build"
138 |           }
139 |         },
140 |         "test": {
141 |           "builder": "@angular-devkit/build-angular:karma",
142 |           "options": {
143 |             "main": "projects/ngx-float-ui-repo/src/test.ts",
144 |             "polyfills": "projects/ngx-float-ui-repo/src/polyfills.ts",
145 |             "tsConfig": "projects/ngx-float-ui-repo/tsconfig.spec.json",
146 |             "karmaConfig": "projects/ngx-float-ui-repo/karma.conf.js",
147 |             "assets": [
148 |               "projects/ngx-float-ui-repo/src/favicon.ico",
149 |               "projects/ngx-float-ui-repo/src/assets"
150 |             ],
151 |             "styles": [
152 |               "projects/ngx-float-ui-repo/src/styles.scss"
153 |             ]
154 |           }
155 |         },
156 |         "lint": {
157 |           "builder": "@angular-devkit/build-angular:tslint",
158 |           "options": {
159 |             "tsConfig": [
160 |               "projects/ngx-float-ui-repo/tsconfig.app.json",
161 |               "projects/ngx-float-ui-repo/tsconfig.spec.json",
162 |               "projects/ngx-float-ui-repo/e2e/tsconfig.json"
163 |             ],
164 |             "exclude": [
165 |               "**/node_modules/**"
166 |             ]
167 |           }
168 |         }
169 |       }
170 |     }
171 |   },
172 |   "cli": {
173 |     "analytics": false
174 |   },
175 |   "schematics": {
176 |     "@schematics/angular:component": {
177 |       "type": "component"
178 |     },
179 |     "@schematics/angular:directive": {
180 |       "type": "directive"
181 |     },
182 |     "@schematics/angular:service": {
183 |       "type": "service"
184 |     },
185 |     "@schematics/angular:guard": {
186 |       "typeSeparator": "."
187 |     },
188 |     "@schematics/angular:interceptor": {
189 |       "typeSeparator": "."
190 |     },
191 |     "@schematics/angular:module": {
192 |       "typeSeparator": "."
193 |     },
194 |     "@schematics/angular:pipe": {
195 |       "typeSeparator": "."
196 |     },
197 |     "@schematics/angular:resolver": {
198 |       "typeSeparator": "."
199 |     }
200 |   }
201 | }
202 | 


--------------------------------------------------------------------------------
/browserslist:
--------------------------------------------------------------------------------
 1 | # This file is used by the build system to adjust CSS and JS output to support the specified browsers below.
 2 | # For additional information regarding the format and rule options, please see:
 3 | # https://github.com/browserslist/browserslist#queries
 4 | 
 5 | # You can see what browsers were selected by your queries by running:
 6 | #   npx browserslist
 7 | 
 8 | last 2 Chrome versions
 9 | last 1 Firefox version
10 | last 2 Edge major versions
11 | last 2 Safari major versions
12 | last 2 iOS major versions
13 | Firefox ESR
14 | 


--------------------------------------------------------------------------------
/changelog.md:
--------------------------------------------------------------------------------
 1 | #20.0.0
 2 | * Release for Angular 20! 🎉
 3 | 
 4 | #19.0.1
 5 | * Jetbrains no longer supporting :(
 6 | 
 7 | #19.0.0
 8 | * Release for Angular 19! 🎉
 9 | 
10 | #18.0.2
11 | * Fix in the hide process
12 | 
13 | #18.0.1
14 | * Fix package deps
15 | * Upgrade to latest floating-ui
16 | 
17 | #18.0.0
18 | * Release for Angular 18! 🎉
19 | 
20 | #17.1.4
21 | * Fix docs on targetElement
22 | 
23 | #17.1.3
24 | * Remove development background rule causing graphic bug in certain scenarios (closes [#16](https://github.com/tonysamperi/ngx-float-ui/issues/16))
25 | 
26 | #17.1.2
27 | * Fix some nullpointer when placement was not passed (closes [#12](https://github.com/tonysamperi/ngx-float-ui/issues/12) for real)
28 | * Performance improvement
29 | 
30 | #17.1.1
31 | * Fix placement default to NgxFloatUiPlacements.AUTO
32 | 
33 | #17.1.0
34 | * Fix readme (closes [#4](https://github.com/tonysamperi/ngx-float-ui/issues/4))
35 | * Add support for `auto-start` and `auto-end` placements
36 | 
37 | #17.0.1
38 | * Fix position fixed not applied to popper style
39 | 
40 | #17.0.0
41 | * First release! 🎉
42 | 
43 | #16.0.3
44 | * Remove development background rule causing graphic bug in certain scenarios (closes [#16](https://github.com/tonysamperi/ngx-float-ui/issues/16))
45 | 
46 | #16.0.2
47 | * Fix some nullpointer when placement was not passed (closes [#12](https://github.com/tonysamperi/ngx-float-ui/issues/12) for real)
48 | * Performance improvement
49 | 
50 | #16.0.1
51 | * Fix placement default to NgxFloatUiPlacements.AUTO
52 | 
53 | #16.0.0
54 | * Release for Angular 16! 🎉
55 | 


--------------------------------------------------------------------------------
/gulpfile.js:
--------------------------------------------------------------------------------
  1 | "use strict";
  2 | 
  3 | function logStart(msg) {
  4 |     console.info("***** Task '" + msg + "' started *****");
  5 | }
  6 | 
  7 | function logEnd(msg) {
  8 |     console.info("***** Task '" + msg + "' finished *****");
  9 | }
 10 | 
 11 | const {task, dest, src, series} = require("gulp"),
 12 |     {join} = require("path"),
 13 |     exec = require("child_process").exec,
 14 |     sass = require("gulp-sass")(require("sass")),
 15 |     {inc} = require("semver"),
 16 |     log = require("plugin-log"),
 17 |     {obj} = require("through2")
 18 | ;const gulp = require("gulp");
 19 | 
 20 | const libName = "ngx-float-ui";
 21 | const rootFolder = join(__dirname);
 22 | const srcFolder = join(rootFolder, `projects/${libName}/src/lib`);
 23 | const distFolder = join(rootFolder, `dist/${libName}`);
 24 | 
 25 | const doBump = (type) => {
 26 |     return Promise.all(["./", join(rootFolder, "projects", libName)].map((p) => {
 27 |         return src(join(p, "package.json"))
 28 |             .pipe(obj((file, enc, cb) => {
 29 |                 const pkgData = JSON.parse(file.contents.toString());
 30 |                 const prevVersion = pkgData.version;
 31 |                 pkgData.version = inc(prevVersion, type);
 32 |                 file.contents = Buffer.from(JSON.stringify(pkgData, null, 4));
 33 |                 log(
 34 |                     "Bumped", log.colors.cyan(prevVersion),
 35 |                     "to", log.colors.magenta(pkgData.version),
 36 |                     "with type:", log.colors.cyan(type)
 37 |                 );
 38 |                 cb(null, file);
 39 |             }))
 40 |             .pipe(dest(p));
 41 |     }));
 42 | };
 43 | 
 44 | //
 45 | 
 46 | task("bump:patch", () => {
 47 |     return doBump("patch");
 48 | });
 49 | 
 50 | task("bump:minor", () => {
 51 |     return doBump("minor");
 52 | });
 53 | 
 54 | task("bump:major", () => {
 55 |     return doBump("major");
 56 | });
 57 | 
 58 | gulp.task("bump:beta", () => {
 59 |     return doBump("prerelease", "beta");
 60 | });
 61 | 
 62 | task("build++", () => {
 63 |     return gulp.src(join(__dirname, "package.json"))
 64 |         .pipe(obj((file, enc, cb) => {
 65 |             const pkgData = JSON.parse(file.contents.toString());
 66 |             const prevBuild = pkgData.build;
 67 |             pkgData.build++;
 68 |             file.contents = Buffer.from(JSON.stringify(pkgData, null, 4));
 69 |             log(
 70 |                 "Increased", log.colors.cyan(prevBuild),
 71 |                 "to", log.colors.magenta(pkgData.build)
 72 |             );
 73 |             cb(null, file);
 74 |         }))
 75 |         .pipe(dest(__dirname));
 76 | });
 77 | 
 78 | task("handleStyles", () => {
 79 |     logStart("handleStyles");
 80 | 
 81 |     const buildScss = new Promise((resolve, reject) => {
 82 |         // SASS BUILD SCSS SOURCES
 83 |         gulp.src([join(srcFolder, "scss/theme-*.scss")])
 84 |             .pipe(sass({
 85 |                 outputStyle: "expanded"
 86 |             }))
 87 |             .pipe(gulp.dest(join(distFolder, "css")))
 88 |             .on("error", reject)
 89 |             .on("end", resolve);
 90 |     });
 91 | 
 92 |     const copyScss = new Promise((resolve, reject) => {
 93 |         src([join(srcFolder, "scss/*.scss")])
 94 |             .pipe(dest(join(distFolder, "scss")))
 95 |             .on("error", reject)
 96 |             .on("end", resolve);
 97 |     });
 98 | 
 99 |     const copyScssIndex = new Promise((resolve, reject) => {
100 |         src([join(srcFolder, "_index.scss")])
101 |             .pipe(dest(distFolder))
102 |             .on("error", reject)
103 |             .on("end", resolve);
104 |     });
105 | 
106 |     return Promise.all([buildScss, copyScss, copyScssIndex])
107 |         .then(() => logEnd("handleStyles"))
108 |         .catch(console.error);
109 | });
110 | 
111 | task("copyFiles", (cb) => {
112 |     logStart("copyFiles");
113 |     src([join(rootFolder, "changelog.md"), join(rootFolder, "README.md"), join(rootFolder, "tsbl.js")])
114 |         .pipe(dest(distFolder))
115 |         .on("error", cb)
116 |         .on("end", () => {
117 |             logEnd("copyFiles");
118 |             cb();
119 |         });
120 | });
121 | 
122 | // PACK
123 | task("pack", (cb) => {
124 |     logStart("pack");
125 |     exec(`npm pack ./dist/${libName}`, (err, stdout, stderr) => {
126 |         console.log(stdout);
127 |         console.log(stderr);
128 |         logEnd("pack");
129 |         cb(err);
130 |     });
131 | });
132 | 
133 | //MAIN
134 | task("postBuild", series("handleStyles", "copyFiles", function (cb, err) {
135 |     logEnd("postBuild");
136 |     cb(err);
137 | }));
138 | 


--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |     "name": "ngx-float-ui-repo",
 3 |     "version": "20.0.0",
 4 |     "build": 0,
 5 |     "license": "MIT",
 6 |     "description": "ngx-float-ui is an Angular wrapper for @floating-ui",
 7 |     "homepage": "https://tonysamperi.github.io/ngx-float-ui",
 8 |     "repository": {
 9 |         "type": "git",
10 |         "url": "https://github.com/tonysamperi/ngx-float-ui.git"
11 |     },
12 |     "bugs": {
13 |         "url": "https://github.com/tonysamperi/ngx-float-ui/issues"
14 |     },
15 |     "author": {
16 |         "name": "Tony Samperi",
17 |         "email": "github@tonysamperi.it"
18 |     },
19 |     "keywords": [
20 |         "Angular 20+",
21 |         "ngx-float-ui",
22 |         "popper Angular",
23 |         "floating ui",
24 |         "float",
25 |         "ui"
26 |     ],
27 |     "engines": {
28 |         "node": ">=20.11.1"
29 |     },
30 |     "scripts": {
31 |         "ng": "ng",
32 |         "start": "ng serve",
33 |         "test": "ng test ngx-float-ui",
34 |         "test:ci": "ng test ngx-float-ui --browsers=ChromeHeadless --watch=false",
35 |         "test:demo": "ng test ngx-float-ui-repo",
36 |         "lint": "ng lint",
37 |         "build++": "gulp build++",
38 |         "build": "ng build ngx-float-ui --configuration=production && gulp postBuild",
39 |         "build:demo": "ng build ngx-float-ui-repo --configuration=production --base-href=",
40 |         "pack": "gulp pack",
41 |         "release": "npm publish ./dist/ngx-float-ui",
42 |         "release:beta": "npm publish ./dist/ngx-float-ui --tag beta",
43 |         "bump:patch": "gulp bump:patch",
44 |         "bump:minor": "gulp bump:minor",
45 |         "bump:major": "gulp bump:major"
46 |     },
47 |     "private": true,
48 |     "dependencies": {
49 |         "@angular/animations": "^20.0.2",
50 |         "@angular/common": "^20.0.2",
51 |         "@angular/compiler": "^20.0.2",
52 |         "@angular/core": "^20.0.2",
53 |         "@angular/forms": "^20.0.2",
54 |         "@angular/platform-browser": "^20.0.2",
55 |         "@angular/platform-browser-dynamic": "^20.0.2",
56 |         "@angular/ssr": "^20.0.1",
57 |         "@floating-ui/dom": "^1.6.13",
58 |         "rxjs": "^7.4.0",
59 |         "tslib": "^2.3.1",
60 |         "typewriter-effect": "^2.19.0",
61 |         "zone.js": "^0.15.0"
62 |     },
63 |     "devDependencies": {
64 |         "@angular-devkit/build-angular": "^20.0.1",
65 |         "@angular-devkit/build-ng-packagr": "^0.1002.0",
66 |         "@angular/cli": "^20.0.1",
67 |         "@angular/compiler-cli": "^20.0.2",
68 |         "@angular/language-service": "^20.0.2",
69 |         "@types/jasmine": "^3.3.8",
70 |         "@types/jasminewd2": "^2.0.3",
71 |         "@types/node": "^18.13.0",
72 |         "@types/prismjs": "^1.16.5",
73 |         "@types/semver": "^7.3.13",
74 |         "gulp": "^4.0.2",
75 |         "gulp-sass": "^5.1.0",
76 |         "jasmine-core": "^4.6.1",
77 |         "jasmine-spec-reporter": "^7.0.0",
78 |         "karma": "^6.4.4",
79 |         "karma-chrome-launcher": "^3.2.0",
80 |         "karma-coverage-istanbul-reporter": "^3.0.3",
81 |         "karma-jasmine": "^5.1.0",
82 |         "karma-jasmine-html-reporter": "^2.1.0",
83 |         "ng-packagr": "^20.0.0",
84 |         "plugin-log": "^0.1.0",
85 |         "prismjs": "^1.30.0",
86 |         "puppeteer": "^24.10.0",
87 |         "semver": "^7.6.2",
88 |         "through2": "^4.0.2",
89 |         "ts-node": "^10.9.1",
90 |         "tslint": "^6.1.3",
91 |         "typescript": "~5.8.3"
92 |     },
93 |     "packageManager": "yarn@4.3.1"
94 | }
95 | 


--------------------------------------------------------------------------------
/projects/ngx-float-ui-repo/karma.conf.js:
--------------------------------------------------------------------------------
 1 | // Karma configuration file, see link for more information
 2 | // https://karma-runner.github.io/1.0/config/configuration-file.html
 3 | 
 4 | module.exports = function (config) {
 5 |   config.set({
 6 |     basePath: '',
 7 |     frameworks: ['jasmine', '@angular-devkit/build-angular'],
 8 |     plugins: [
 9 |       require('karma-jasmine'),
10 |       require('karma-chrome-launcher'),
11 |       require('karma-jasmine-html-reporter'),
12 |       require('karma-coverage-istanbul-reporter'),
13 |       require('@angular-devkit/build-angular/plugins/karma')
14 |     ],
15 |     client: {
16 |       clearContext: false // leave Jasmine Spec Runner output visible in browser
17 |     },
18 |     coverageIstanbulReporter: {
19 |       dir: require('path').join(__dirname, '../../coverage/ngx-float-ui-repo'),
20 |       reports: ['html', 'lcovonly', 'text-summary'],
21 |       fixWebpackSourcePaths: true
22 |     },
23 |     reporters: ['progress', 'kjhtml'],
24 |     port: 9876,
25 |     colors: true,
26 |     logLevel: config.LOG_INFO,
27 |     autoWatch: true,
28 |     browsers: ['Chrome'],
29 |     singleRun: false,
30 |     restartOnFileChange: true
31 |   });
32 | };
33 | 


--------------------------------------------------------------------------------
/projects/ngx-float-ui-repo/src/app/app.component.html:
--------------------------------------------------------------------------------
1 | @if (isDemo) {
2 | 	<app-demo></app-demo>
3 | }
4 | @else {
5 | 	<app-test></app-test>
6 | }
7 | 


--------------------------------------------------------------------------------
/projects/ngx-float-ui-repo/src/app/app.component.scss:
--------------------------------------------------------------------------------
 1 | @import "../scss/responsive";
 2 | 
 3 | .terminal {
 4 |   position: relative;
 5 |   width: 80%;
 6 |   max-width: 600px;
 7 |   border-radius: 6px;
 8 |   overflow: hidden;
 9 |   background-color: rgb(15, 15, 16);
10 |   font-family: SFMono-Regular, Consolas, Liberation Mono, Menlo, monospace;
11 |   color: white;
12 |   padding: 0 1rem 1rem;
13 |   margin: 0;
14 |   text-align: left;
15 |   padding-top: 44px;
16 | 
17 |   &:before {
18 |     content: "\2022 \2022 \2022";
19 |     position: absolute;
20 |     top: 0;
21 |     left: 0;
22 |     background: #3a3a3a;
23 |     color: #c2c3c4;
24 |     width: 100%;
25 |     font-size: 34px;
26 |     line-height: 26px;
27 |     text-indent: 6px;
28 |     text-align: left;
29 |     height: 34px;
30 |   }
31 | 
32 |   ul {
33 |     list-style: none;
34 |     padding: 0;
35 |     margin: 0;
36 |   }
37 | 
38 |   a {
39 |     color: #ff6b81;
40 |   }
41 | 
42 |   @include respond-below(sm) {
43 |     width: 100%;
44 |   }
45 | }
46 | 


--------------------------------------------------------------------------------
/projects/ngx-float-ui-repo/src/app/app.component.ts:
--------------------------------------------------------------------------------
 1 | import {Component, ViewEncapsulation} from "@angular/core";
 2 | //
 3 | import {NGX_FLOAT_UI_ENVIRONMENT} from "../environments/environment";
 4 | 
 5 | 
 6 | @Component({
 7 |     selector: "app-root",
 8 |     templateUrl: "./app.component.html",
 9 |     styleUrls: ["./app.component.scss"],
10 |     encapsulation: ViewEncapsulation.None,
11 |     standalone: false
12 | })
13 | export class NgxFloatUiAppComponent {
14 | 
15 |     isDemo: boolean = NGX_FLOAT_UI_ENVIRONMENT.isDemo;
16 | 
17 | }
18 | 


--------------------------------------------------------------------------------
/projects/ngx-float-ui-repo/src/app/app.module.ts:
--------------------------------------------------------------------------------
 1 | import {BrowserModule} from "@angular/platform-browser";
 2 | import {NgModule} from "@angular/core";
 3 | //
 4 | import {NgxFloatUiModule, NgxFloatUiPlacements, NgxFloatUiTriggers} from "ngx-float-ui";
 5 | //
 6 | import {NgxFloatUiAppComponent} from "./app.component";
 7 | import {NgxFloatUiDemoComponent} from "./components/demo/demo.component";
 8 | import {NgxFloatUiTestComponent} from "./components/test/test.component";
 9 | 
10 | @NgModule({
11 |     declarations: [NgxFloatUiAppComponent],
12 |     imports: [
13 |         BrowserModule,
14 |         NgxFloatUiModule.forRoot({
15 |             trigger: NgxFloatUiTriggers.click,
16 |             hideOnClickOutside: false,
17 |             placement: NgxFloatUiPlacements.BOTTOM
18 |         }),
19 |         NgxFloatUiDemoComponent,
20 |         NgxFloatUiTestComponent
21 |     ],
22 |     providers: [],
23 |     bootstrap: [NgxFloatUiAppComponent]
24 | })
25 | export class NgxFloatUiAppModule {
26 | }
27 | 


--------------------------------------------------------------------------------
/projects/ngx-float-ui-repo/src/app/components/demo/demo.component.scss:
--------------------------------------------------------------------------------
  1 | @import "../../../scss/vars";
  2 | @import "../../../scss/responsive";
  3 | 
  4 | $pop-header-img: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAUCAYAAAD/Rn+7AAAMbWlDQ1BJQ0MgcHJvZmlsZQAAeJyVVwdYU8kWnluSkJDQAghICb0J0gkgJYQWQHoRRCUkgYQSY0JQsaOLCq5dRLGiqyKKbaXZsSuLYu+LBRVlXdTFhsqbkICu+8r3zvfNvX/OnPlPuTO59wCg+YErkeSjWgAUiAulCeHBjDFp6QxSJ1AHRIAAL8Dg8mQSVlxcNIAyeP+7vLsBLaFcdVJw/XP+v4oOXyDjAYBkQJzFl/EKID4OAL6OJ5EWAkBU6C0nF0oUeDbEulIYIMQrFThHiXcocJYSHx6wSUpgQ3wZADUqlyvNAUDjHtQzing5kEfjM8QuYr5IDIDmCIgDeEIuH2JF7CMKCiYqcCXEdtBeAjGMBzCzvuPM+Rt/1hA/l5szhJV5DYhaiEgmyedO/T9L87+lIF8+6MMGDqpQGpGgyB/W8FbexCgFpkLcLc6KiVXUGuIPIr6y7gCgFKE8IllpjxrzZGxYP6APsQufGxIFsTHEYeL8mGiVPitbFMaBGO4WdIqokJMEsQHECwSy0ESVzSbpxASVL7Q+W8pmqfTnuNIBvwpfD+R5ySwV/xuhgKPixzSKhUmpEFMgtioSpcRArAGxsywvMUplM6pYyI4ZtJHKExTxW0GcIBCHByv5saJsaViCyr6sQDaYL7ZJKOLEqPD+QmFShLI+2CkedyB+mAt2WSBmJQ/yCGRjogdz4QtCQpW5Y88F4uREFc8HSWFwgnItTpHkx6nscQtBfrhCbwGxh6woUbUWTymEm1PJj2dLCuOSlHHixbncyDhlPPhSEA3YIAQwgByOLDAR5AJRW3dDN/ylnAkDXCAFOUAAnFSawRWpAzNieE0ExeAPiARANrQueGBWAIqg/suQVnl1AtkDs0UDK/LAU4gLQBTIh7/lA6vEQ95SwBOoEf3DOxcOHow3Hw7F/L/XD2q/aVhQE63SyAc9MjQHLYmhxBBiBDGMaI8b4QG4Hx4Nr0FwuOFM3Gcwj2/2hKeEdsIjwnVCB+H2BFGJ9IcoR4MOyB+mqkXW97XAbSCnJx6M+0N2yIzr40bACfeAflh4IPTsCbVsVdyKqjB+4P5bBt89DZUd2YWMkoeRg8h2P67UcNDwHGJR1Pr7+ihjzRqqN3to5kf/7O+qz4f3qB8tsQXYAewsdgI7jx3GGgADO4Y1Yq3YEQUe2l1PBnbXoLeEgXjyII/oH/64Kp+KSspcal26XD4r5woFUwoVB489UTJVKsoRFjJY8O0gYHDEPOcRDDcXN1cAFO8a5d/X2/iBdwii3/pNN/d3APyP9ff3H/qmizwGwD5vePybvunsmABoqwNwroknlxYpdbjiQoD/EprwpBkCU2AJ7GA+bvCN5geCQCiIBLEgCaSB8bDKQrjPpWAymA7mgFJQDpaCVWAt2Ai2gB1gN9gPGsBhcAKcARfBZXAd3IW7pxO8BD3gHehDEISE0BA6YoiYIdaII+KGMJEAJBSJRhKQNCQTyUHEiByZjsxFypHlyFpkM1KD7EOakBPIeaQduY08RLqQN8gnFEOpqC5qgtqgI1EmykKj0CR0HJqDTkKL0XnoYrQSrUZ3ofXoCfQieh3tQF+ivRjA1DF9zBxzwpgYG4vF0rFsTIrNxMqwCqwaq8Oa4XO+inVg3dhHnIjTcQbuBHdwBJ6M8/BJ+Ex8Eb4W34HX46fwq/hDvAf/SqARjAmOBF8ChzCGkEOYTCglVBC2EQ4STsOz1El4RyQS9Ym2RG94FtOIucRpxEXE9cQ9xOPEduJjYi+JRDIkOZL8SbEkLqmQVEpaQ9pFOka6QuokfVBTVzNTc1MLU0tXE6uVqFWo7VQ7qnZF7ZlaH1mLbE32JceS+eSp5CXkreRm8iVyJ7mPok2xpfhTkii5lDmUSkod5TTlHuWturq6hbqPery6SH22eqX6XvVz6g/VP1J1qA5UNjWDKqcupm6nHqfepr6l0Wg2tCBaOq2QtphWQztJe0D7oEHXcNbgaPA1ZmlUadRrXNF4pUnWtNZkaY7XLNas0DygeUmzW4usZaPF1uJqzdSq0mrSuqnVq03XdtWO1S7QXqS9U/u89nMdko6NTqgOX2eezhadkzqP6Rjdks6m8+hz6Vvpp+mdukRdW12Obq5uue5u3TbdHj0dPQ+9FL0pelV6R/Q69DF9G32Ofr7+Ev39+jf0Pw0zGcYaJhi2cFjdsCvD3hsMNwgyEBiUGewxuG7wyZBhGGqYZ7jMsMHwvhFu5GAUbzTZaIPRaaPu4brD/YbzhpcN3z/8jjFq7GCcYDzNeItxq3GvialJuInEZI3JSZNuU33TINNc05WmR027zOhmAWYis5Vmx8xeMPQYLEY+o5JxitFjbmweYS4332zeZt5nYWuRbFFiscfiviXFkmmZbbnSssWyx8rMarTVdKtaqzvWZGumtdB6tfVZ6/c2tjapNvNtGmye2xrYcmyLbWtt79nR7ALtJtlV212zJ9oz7fPs19tfdkAdPB2EDlUOlxxRRy9HkeN6x/YRhBE+I8QjqkfcdKI6sZyKnGqdHjrrO0c7lzg3OL8aaTUyfeSykWdHfnXxdMl32epy11XHNdK1xLXZ9Y2bgxvPrcrtmjvNPcx9lnuj+2sPRw+BxwaPW550z9Ge8z1bPL94eXtJveq8urytvDO913nfZOoy45iLmOd8CD7BPrN8Dvt89PXyLfTd7/unn5Nfnt9Ov+ejbEcJRm0d9djfwp/rv9m/I4ARkBmwKaAj0DyQG1gd+CjIMogftC3oGcuelcvaxXoV7BIsDT4Y/J7ty57BPh6ChYSHlIW0heqEJoeuDX0QZhGWE1Yb1hPuGT4t/HgEISIqYlnETY4Jh8ep4fREekfOiDwVRY1KjFob9SjaIVoa3TwaHR05esXoezHWMeKYhlgQy4ldEXs/zjZuUtyheGJ8XHxV/NME14TpCWcT6YkTEncmvksKTlqSdDfZLlme3JKimZKRUpPyPjUkdXlqx5iRY2aMuZhmlCZKa0wnpaekb0vvHRs6dtXYzgzPjNKMG+Nsx00Zd3680fj88UcmaE7gTjiQSchMzdyZ+Zkby63m9mZxstZl9fDYvNW8l/wg/kp+l8BfsFzwLNs/e3n28xz/nBU5XcJAYYWwW8QWrRW9zo3I3Zj7Pi82b3tef35q/p4CtYLMgiaxjjhPfGqi6cQpE9sljpJSScck30mrJvVIo6TbZIhsnKyxUBd+1LfK7eQ/yR8WBRRVFX2YnDL5wBTtKeIprVMdpi6c+qw4rPiXafg03rSW6ebT50x/OIM1Y/NMZGbWzJZZlrPmzeqcHT57xxzKnLw5v5W4lCwv+Wtu6tzmeSbzZs97/FP4T7WlGqXS0pvz/eZvXIAvEC1oW+i+cM3Cr2X8sgvlLuUV5Z8X8RZd+Nn158qf+xdnL25b4rVkw1LiUvHSG8sCl+1Yrr28ePnjFaNX1K9krCxb+deqCavOV3hUbFxNWS1f3VEZXdm4xmrN0jWf1wrXXq8KrtqzznjdwnXv1/PXX9kQtKFuo8nG8o2fNok23docvrm+2qa6YgtxS9GWp1tTtp79hflLzTajbeXbvmwXb+/YkbDjVI13Tc1O451LatFaeW3Xroxdl3eH7G6sc6rbvEd/T/lesFe+98W+zH039kftbznAPFD3q/Wv6w7SD5bVI/VT63sahA0djWmN7U2RTS3Nfs0HDzkf2n7Y/HDVEb0jS45Sjs472n+s+Fjvccnx7hM5Jx63TGi5e3LMyWun4k+1nY46fe5M2JmTZ1lnj53zP3f4vO/5pgvMCw0XvS7Wt3q2HvzN87eDbV5t9Ze8LzVe9rnc3D6q/eiVwCsnroZcPXONc+3i9Zjr7TeSb9y6mXGz4xb/1vPb+bdf3ym603d39j3CvbL7WvcrHhg/qP7d/vc9HV4dRx6GPGx9lPjo7mPe45dPZE8+d857Snta8czsWc1zt+eHu8K6Lr8Y+6LzpeRlX3fpH9p/rHtl9+rXP4P+bO0Z09P5Wvq6/82it4Zvt//l8VdLb1zvg3cF7/rel30w/LDjI/Pj2U+pn571Tf5M+lz5xf5L89eor/f6C/r7JVwpd+BTAIMDzc4G4M12AGhpANBh30YZq+wFBwRR9q8DCPwnrOwXB8QLgDr4/R7fDb9ubgKwdytsvyC/JuxV42gAJPkA1N19aKhElu3upuSiwj6F8KC//y3s2UgrAPiytL+/r7q//8sWGCzsHY+LlT2oQoiwZ9gU9yWrIAv8G1H2p9/l+OMdKCLwAD/e/wUumZDWKfzJRwAAAAlwSFlzAAAWJQAAFiUBSVIk8AAABcJJREFUeJytllmIXEUUhs+purfv7e7ZemYySSaLE3WMiviiLyr4IpgnBReCqHELBiEoARUSEkVjNA8qPogmGhElESSoQQQf3CDJiyEuuEQl22Qxs2Zmenp6eu5SVcf/9hDz4Ew250L1qe6ue89X/zmnzvVolq4Na17hgf4RVRmO2KWOlW+lsRRKc1uDvL7lZXepz/X+L9jK5WtUub/q//r9Id85WxBHAZHzhJwZHynHp45SdOct90fNHUWzfde2iwa9aMAtmz7mctRCiZnkvp4fuf9kf94Y00okbSQ0n1hKIpITcQnsqDg7GE8mfQPHa5V7b72r9smeXXbWAXds3c+9v/Vy3ylSB/Ym7AWJikxZVWo6J07NYaJuEerC0qsAOQcWKlIM6CEh6SHnfsf8xNi47Xtk+ROTH+zcesFKnhPw88++4wN7xvmXr/5W0QTCJgAi308i48dpEjijG1m8bqH0BgDA0hUAKgHSx/dMwTLsYjyqgA0UxYVu8JAdvPvmdalfzJmOy/LuzffWyiUBfvPlXt7/9Qj3Hkw9k+pAKS44kSao1SBis3kzEUMtdT2W34ix+Kx6oggxhp0H2+6EQ3FeK7liIbHhsSRNyjRuy8NDteo9tz0Xf/rtS+aiAf/YF1H/Yaed8UJANYmldmbqxHbbHUkLlrRPAcrVmF+JUcI8hGXkIbgASaJFeK6IB9iggbjQBpcnmXmAFR1RSh2Lx8zAY3dsqr7/xYZpc3NGwPJRVjZx+F8V6s5Z5sMuAWwnvKMoCM4oA52H0QiYHNjwdxaxqajhE6jKJ/FbmAJhzuWV0guZ1aBW3ARA1lrFUSWJ1q16zW1+95n/hHtGwNHRqkKQkHMIpcj8LL/w87Vwu6hesVAVjgKMJqqvI3UGDurVRyYmXIAjyCvOK825Vq08A66KVqoR1mnmCltVrg7Y9N+dnQ/wjc3vcM9uoy25gISb4C6r1EWZgpgvFrIlfA8V4gRAjZiqs0+Ws0OYFHtADJWng5yncj7AwMUFKDgGe1wxtfpK5VxqeDqWaQGVXYJn15DoEQ5cxEakARZFIS2SDbFNCJ6frQSAA6WrC4e7ppQ7E+ApWUFlfe3BavZABdUUdPW0Io+n5uz7cuGAHd41dFB+QOQsHDoNH17mB3OEMjtusmF05hyAKTLJAtpB2Vz2EyCnchGLlHKRr6ma99kVfZ3PQy5AVj2mPsD1Y9UYGJOGfG7a42ZawL9qO0lcJ/wYeDUxHNUAVhUy42hjE/gdiZ/iXmMQ5qpm3whbD2vz9WJBBUNNHB0ygTWnNaenQ8+mpbwKil5dxTLy4gCIcIBzr+FcFLS2XDjgixuflieXfeRSSlMoMwllKrAjmTOpQ1jjMkiyCVSsQMGaygJHOO+Esy6ShSvrJCO4F0qZXg0lQ01+AWQeK9xDR7HmCKhGpUGZp95eOW13mbGKOYwtTeCgkRhw6QDgcECbACrWuF4kFoAuUmxGoAjgVWxRk8LGq0shNAE7jI31OZcMYF2U16SKur6VGBsbxSh7QVgLu8IZ+/OMgKW5gYuOVRPiqIJwaicpZDEp1BiEbcreWEARa3bDUHIIt1St5ggKOnSOjDHKQozErDg21XyOTHMYUF5Q8ko7lLQJinkbLgzdsvWPztjuZgRccLmW0aHYJOVkkrBhluwYMA7KlTGKxFYj1xJAjHmaRnDiVIVVpppxJqsTMhAs1Z6XNnc2mMVLFzpFRfTECv2pS3Rd1yJauvL2c/bhcwKuWnufbHt1h/tp9+F4YjwVpdOUJUHSW3QWm1Uzg9rCQ+QpN+GTFxeCXNxcajT5BSWpTkQyp6uN1q5Dd9h3PoxLAMyux599ULa/9aHr+flwfOLEpGEzGRvLFRwdqg5IeGXAW6pPylDArqNrnu2+qVseeGjFeZWZFcDsWrH64XpbWL/6eYl6E1upORwTjhl90KCB5CxJa3sLml+zvPDmRqEts4U2df0D5RUZ23o6ejYAAAAASUVORK5CYII=";
  5 | 
  6 | // All strong tags here are red
  7 | strong {
  8 |   color: map-get($pop-colors, primary-light);
  9 | }
 10 | 
 11 | .pop-generic-section {
 12 |   padding: 50px 40px;
 13 |   max-width: 900px;
 14 |   margin: 0 auto;
 15 |   border-bottom: 1px solid map-get($pop-colors, violet);
 16 | }
 17 | 
 18 | .pop-top-section {
 19 |   background-image: url($pop-header-img), radial-gradient(500px, #202028, #202028 20%, #202028);
 20 |   width: 100%;
 21 |   background-repeat: no-repeat;
 22 |   background-position: center;
 23 |   background-size: cover;
 24 |   text-align: center;
 25 |   padding: 60px 25px 50px;
 26 |   position: relative;
 27 | 
 28 |   > img.pop-angular-logo {
 29 |     position: absolute;
 30 |     width: $pop-angular-logo-size;
 31 |     left: calc(50% - #{$pop-angular-logo-size * 0.5});
 32 |     top: 235px; // Since popper logo has height 200px
 33 |     border-radius: 50%;
 34 |     background-color: #FFF;
 35 |     box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.5);
 36 |   }
 37 | 
 38 |   > img.pop-popper-logo {
 39 |     height: 200px;
 40 |     -webkit-user-select: none;
 41 |     -moz-user-select: none;
 42 |     -ms-user-select: none;
 43 |     user-select: none;
 44 |     margin-bottom: 24px;
 45 |     display: inline-block;
 46 |   }
 47 | 
 48 |   > h2 {
 49 |     font-size: 36px;
 50 |   }
 51 | }
 52 | 
 53 | .pop-badges {
 54 |   > img {
 55 |     display: inline-block;
 56 |     margin-right: 8px;
 57 | 
 58 |     &:last-child {
 59 |       margin-right: 0;
 60 |     }
 61 |   }
 62 | }
 63 | 
 64 | .pop-install-section {
 65 |   background: map-get($pop-colors, background);
 66 |   padding: 15px 0;
 67 |   font-weight: bold;
 68 |   margin-bottom: 25px;
 69 |   width: 100%;
 70 |   text-align: center;
 71 |   border-bottom: 1px solid map-get($pop-colors, violet);
 72 | 
 73 |   > div {
 74 |     padding: 0 40px;
 75 |     max-width: 900px;
 76 |     margin: 0 auto;
 77 |     -webkit-flex-direction: row;
 78 |     -ms-flex-direction: row;
 79 |     flex-direction: row;
 80 |     display: -webkit-box;
 81 |     display: -webkit-flex;
 82 |     display: -ms-flexbox;
 83 |     display: flex;
 84 |     -webkit-box-pack: center;
 85 |     -webkit-justify-content: center;
 86 |     -ms-flex-pack: center;
 87 |     justify-content: center;
 88 |     -webkit-align-items: center;
 89 |     -webkit-box-align: center;
 90 |     -ms-flex-align: center;
 91 |     align-items: center;
 92 |     color: white;
 93 | 
 94 |     @include respond-below(xs) {
 95 |       flex-direction: column;
 96 |     }
 97 |   }
 98 | }
 99 | 
100 | .pop-demo {
101 |   position: relative;
102 |   padding: 0 40px;
103 |   background-color: map-get($pop-colors, background);
104 |   border-bottom: 1px solid map-get($pop-colors, violet);
105 | 
106 |   @include respond-below(sm) {
107 |     padding: 0 20px;
108 |   }
109 | 
110 |   > article {
111 |     position: relative;
112 |     display: grid;
113 |     grid-template-columns: 2fr 3fr;
114 |     -webkit-align-items: flex-start;
115 |     -webkit-box-align: start;
116 |     -ms-flex-align: start;
117 |     align-items: start;
118 |     font-size: 17px;
119 |     padding: 50px 0;
120 |     border-bottom: 1px solid map-get($pop-colors, violet);
121 | 
122 |     &:last-child {
123 |       border-bottom: 0;
124 |     }
125 | 
126 |     @include respond-below(sm) {
127 |       grid-template-columns: 1fr;
128 |     }
129 | 
130 |     .pop-popcorn-box {
131 |       position: absolute;
132 |       left: 50%;
133 |       top: 50%;
134 |       width: 130px;
135 |       margin-left: -65px;
136 |       margin-top: -65px;
137 |     }
138 | 
139 |     > div.pop-popcorn-wrap + div {
140 |       padding: 0 40px;
141 |       display: grid;
142 |       @include respond-below(sm) {
143 |         padding: 0;
144 |       }
145 |     }
146 | 
147 |     &[pop-position] > div.pop-popcorn-wrap {
148 |       height: 450px;
149 |       position: relative;
150 |     }
151 | 
152 |     &[pop-theming] {
153 |       > div.pop-popcorn-wrap {
154 |         position: relative;
155 |         width: 100%;
156 |         border-radius: 10px;
157 |         background-color: map-get($pop-colors, background-grey);
158 |         height: 300px;
159 | 
160 |         .pop-popcorn-box {
161 |           width: 100px;
162 |           margin-left: -50px;
163 |           margin-top: -50px;
164 |         }
165 |       }
166 |     }
167 | 
168 |     &[pop-overflow], &[pop-flipping], &[pop-click], &[pop-loose] {
169 |       > div.pop-popcorn-wrap {
170 |         @include pop-scrollbar();
171 |         position: relative;
172 |         width: 100%;
173 |         background-color: map-get($pop-colors, background-grey);
174 |         border-radius: 10px;
175 |         overflow-y: scroll;
176 |         overscroll-behavior: contain;
177 |         height: 450px;
178 |         margin: 0 auto;
179 | 
180 |         &:before {
181 |           content: '';
182 |           display: block;
183 |           width: 1px;
184 |           height: 600px;
185 |           //border: 2px solid green;
186 |         }
187 | 
188 |         &:after {
189 |           content: '';
190 |           display: block;
191 |           width: 1px;
192 |           height: 600px;
193 |         }
194 | 
195 |         .pop-popcorn-box {
196 |           position: relative;
197 |           left: 0;
198 |           width: 100px;
199 |           margin-left: 100px;
200 |           top: 0;
201 |         }
202 | 
203 |       }
204 |     }
205 | 
206 |     .pop-demo-placement-button {
207 |       display: -webkit-box;
208 |       display: -webkit-flex;
209 |       display: -ms-flexbox;
210 |       display: flex;
211 |       -webkit-box-pack: center;
212 |       -webkit-justify-content: center;
213 |       -ms-flex-pack: center;
214 |       justify-content: center;
215 |       -webkit-align-items: center;
216 |       -webkit-box-align: center;
217 |       -ms-flex-align: center;
218 |       align-items: center;
219 |       position: absolute;
220 |       width: 50px;
221 |       height: 50px;
222 |       padding: 0;
223 |       border: none;
224 |       background: none;
225 |       -webkit-transition: -webkit-transform 0.4s cubic-bezier(0.54, 1.5, 0.38, 1.2);
226 |       -webkit-transition: transform 0.4s cubic-bezier(0.54, 1.5, 0.38, 1.2);
227 |       transition: transform 0.4s cubic-bezier(0.54, 1.5, 0.38, 1.2);
228 |       cursor: pointer;
229 |       outline: 0;
230 |       will-change: transform;
231 |       -webkit-tap-highlight-color: transparent;
232 | 
233 |       &:hover {
234 |         -webkit-transform: scale(1.5);
235 |         -ms-transform: scale(1.5);
236 |         transform: scale(1.5);
237 |       }
238 | 
239 |       &[data-placement^='top'] {
240 |         top: 0;
241 |         left: 50%;
242 |         margin-left: -25px;
243 |       }
244 | 
245 |       &[data-placement^='bottom'] {
246 |         bottom: 0;
247 |         left: 50%;
248 |         margin-left: -25px;
249 |       }
250 | 
251 |       &[data-placement='top-start'], &[data-placement='bottom-start'] {
252 |         left: calc(50% - 50px);
253 |       }
254 | 
255 |       &[data-placement='top-end'], &[data-placement='bottom-end'] {
256 |         left: calc(50% + 50px);
257 |       }
258 | 
259 |       &[data-placement^='right'] {
260 |         right: 0;
261 |         top: 50%;
262 |         margin-top: -25px;
263 |       }
264 | 
265 |       &[data-placement^='left'] {
266 |         left: 0;
267 |         top: 50%;
268 |         margin-top: -25px;
269 |       }
270 | 
271 |       &[data-placement='left-start'], &[data-placement='right-start'] {
272 |         top: calc(50% - 50px);
273 |       }
274 | 
275 |       &[data-placement='left-end'], &[data-placement='right-end'] {
276 |         top: calc(50% + 50px);
277 |       }
278 | 
279 |       &:focus > div {
280 |         box-shadow: 0 0 0 6px rgba(255, 100, 150, 0.4);
281 |       }
282 | 
283 |       > div {
284 |         width: 18px;
285 |         height: 18px;
286 |         border: 2px solid map-get($pop-colors, primary-light);
287 |         background: transparent;
288 |         border-radius: 50%;
289 | 
290 |         &.selected {
291 |           width: 18px;
292 |           height: 18px;
293 |           border: 2px solid #ff6b81;
294 |           background: #ff6b81;
295 |           border-radius: 50%;
296 |         }
297 |       }
298 |     }
299 |   }
300 | 
301 | }
302 | 
303 | footer {
304 |   text-align: center;
305 |   padding: 25px 0;
306 |   width: 100%;
307 | }
308 | 
309 | .animate-float {
310 |   animation: float 8s ease infinite;
311 | }
312 | 
313 | .animate-string {
314 |   animation: string .25s ease-in-out infinite
315 | }
316 | 
317 | @keyframes float {
318 |   0%,to {
319 |     transform: rotate(-1deg) translate(-.1rem,1rem)
320 |   }
321 | 
322 |   50% {
323 |     transform: rotate(2deg)
324 |   }
325 | 
326 |   75% {
327 |     transform: rotate(.5deg) translate(.25rem,.5rem)
328 |   }
329 | }
330 | 
331 | @keyframes string {
332 |   25% {
333 |     transform: translate(.02rem,-.05rem) scaleY(1.03) scaleX(1.02)
334 |   }
335 | 
336 |   50% {
337 |     transform: translate(.1rem,.1rem) scaleY(1.05) scaleX(.95)
338 |   }
339 | 
340 |   75% {
341 |     transform: translate(.05rem,.05rem) scaleY(.96) scaleX(1)
342 |   }
343 | }
344 | 


--------------------------------------------------------------------------------
/projects/ngx-float-ui-repo/src/app/components/demo/demo.component.ts:
--------------------------------------------------------------------------------
  1 | import {Component, OnInit} from "@angular/core";
  2 | 
  3 | import {
  4 |     NgxFloatUiPlacements,
  5 |     NgxFloatUiLooseDirective,
  6 |     NgxFloatUiDirective,
  7 |     NgxFloatUiContentComponent
  8 | } from "ngx-float-ui";
  9 | //
 10 | import {getNgxFloatUiCodeMap} from "../../shared/ngx-float-ui-code-map.const";
 11 | import {NgxFloatUiArticleTypes, NgxFloatUiArticleTypesRef} from "../../shared/ngx-float-ui-article-types.model";
 12 | //
 13 | import pkg from "../../../../../../package.json";
 14 | import {highlightElement} from "prismjs";
 15 | import {catchError, of, switchMap, timer} from "rxjs";
 16 | import {ajax, AjaxResponse} from "rxjs/ajax";
 17 | import TypeWriter from "typewriter-effect/dist/core.js";
 18 | 
 19 | const codeTypes: NgxFloatUiArticleTypesRef<"css" | "markup"> = {
 20 |     position: "markup",
 21 |     overflow: "markup",
 22 |     flipping: "markup",
 23 |     theming: "css",
 24 |     click: "markup",
 25 |     scroll: "markup"
 26 | };
 27 | 
 28 | @Component({
 29 |     selector: "app-demo",
 30 |     templateUrl: "demo.component.html",
 31 |     styleUrls: ["demo.component.scss"],
 32 |     imports: [NgxFloatUiContentComponent, NgxFloatUiDirective, NgxFloatUiLooseDirective]
 33 | })
 34 | export class NgxFloatUiDemoComponent implements OnInit {
 35 | 
 36 |     get buildRef(): string {
 37 |         return `${pkg.version}-build-${pkg.build}`;
 38 |     }
 39 | 
 40 |     get codeMap(): NgxFloatUiArticleTypesRef<string> {
 41 |         return getNgxFloatUiCodeMap(this.selectedPosition);
 42 |     }
 43 | 
 44 |     messages: { opts?: { delay?: number | "natural"; loop?: boolean; }; text: string; }[] = [];
 45 |     popperPlacements: typeof NgxFloatUiPlacements = NgxFloatUiPlacements;
 46 |     // tslint:disable-next-line:no-bitwise
 47 |     positionButtons: NgxFloatUiPlacements[] = Object.values(NgxFloatUiPlacements).filter((v) => !~v.indexOf("auto"));
 48 |     selectedPosition: NgxFloatUiPlacements = this.positionButtons[0];
 49 |     year: number = new Date().getFullYear();
 50 | 
 51 |     ngOnInit(): void {
 52 |         Object.values(NgxFloatUiArticleTypes).forEach((s: NgxFloatUiArticleTypes) => this._updateCode(s));
 53 |         Array.from(document.querySelectorAll(".pop-popcorn-wrap")).forEach((el: HTMLElement) => el.scrollTop = 300);
 54 |         this._getMessages();
 55 |     }
 56 | 
 57 |     onPopperUpdate(): void {
 58 |         console.info("ON POPPER UPDATE FIRED!");
 59 |     }
 60 | 
 61 |     showAlert(): void {
 62 |         alert("Ciao!");
 63 |     }
 64 | 
 65 |     updatePosition(positionButton: NgxFloatUiPlacements): void {
 66 |         this.selectedPosition = positionButton;
 67 |         this._updateCode(NgxFloatUiArticleTypes.position);
 68 |     }
 69 | 
 70 |     private _getMessages(): void {
 71 |         ajax.get(`./assets/messages.json`)
 72 |             .pipe(
 73 |                 switchMap((resp: AjaxResponse<any>) => {
 74 |                     this.messages = resp.response.messages;
 75 | 
 76 |                     return timer(150);
 77 |                 }),
 78 |                 catchError(() => of([]))
 79 |             )
 80 |             .subscribe({
 81 |                 next: () => {
 82 |                     this.messages.forEach(({text, opts = {}}, i: number) => {
 83 |                         const tw = new TypeWriter(`[pop-messages] li:nth-child(${i + 1})`, {
 84 |                             strings: !!opts.loop ? [text] : void 0,
 85 |                             autoStart: !!opts.loop,
 86 |                             loop: !!opts.loop,
 87 |                             delay: opts.delay || "natural"
 88 |                         });
 89 |                         if (!opts.loop) {
 90 |                             tw.typeString(text).stop().start();
 91 |                         }
 92 |                         // else {
 93 |                         //     console.info("AUTOSTART WAS TRUE FOR", text);
 94 |                         // }
 95 |                     });
 96 |                 }
 97 |             });
 98 |     }
 99 | 
100 |     private _updateCode(key: NgxFloatUiArticleTypes): void {
101 |         const $code = document.querySelector(`[pop-${key}-code]`);
102 |         if (!$code) {
103 |             return;
104 |         }
105 |         $code.classList.add(`language-${codeTypes[key] || "markup"}`);
106 |         $code.innerHTML = this.codeMap[key];
107 |         highlightElement($code);
108 |     }
109 | 
110 | }
111 | 


--------------------------------------------------------------------------------
/projects/ngx-float-ui-repo/src/app/components/test/test.component.html:
--------------------------------------------------------------------------------
 1 | <!-- * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * -->
 2 | <!-- * * * * * * * * * * * * POPPER DEMO! :) * * * * * * * * * * * -->
 3 | <!-- * * * * * * * * * cloned from popper.js.org * * * * * * * * * -->
 4 | <!-- * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * -->
 5 | <div class="content"
 6 | 	 role="main">
 7 | 
 8 | 	<div class="pop-demo">
 9 | 		<article pop-click>
10 | 			<div class="pop-popcorn-wrap expand pippo">
11 | 				<float-ui-content #popperClickContent>
12 | 					<p class="pop-text-bold">POPCORN<br />CONDIMENTS<br />& PRICE</p>
13 | 					<ul>
14 | 						<li>BUTTER: $1.99</li>
15 | 						<li>SALT: $0.99</li>
16 | 						<li>CARAMEL: $0.49</li>
17 | 					</ul>
18 | 				</float-ui-content>
19 | 				<img alt="Popcorn box"
20 | 					 src="assets/images/popcorn-box.svg"
21 | 					 hideOnClickOutside
22 | 					 boundariesElement=".pippo"
23 | 					 [floatUi]="popperClickContent"
24 | 					 preventOverflow
25 | 					 class="pop-popcorn-box">
26 | 			</div>
27 | 			<div>
28 | 				<h3 class="pop-title-light">
29 | 					<svg xmlns="http://www.w3.org/2000/svg"
30 | 						 width="24"
31 | 						 height="24"
32 | 						 viewBox="0 0 24 24"
33 | 						 fill="none"
34 | 						 stroke="currentColor"
35 | 						 stroke-width="2"
36 | 						 stroke-linecap="round"
37 | 						 stroke-linejoin="round">
38 | 						<path d="M6.13 1L6 16a2 2 0 0 0 2 2h15"></path>
39 | 						<path d="M1 6.13L16 6a2 2 0 0 1 2 2v15"></path>
40 | 					</svg>
41 | 					Open on click
42 | 				</h3>
43 | 				<p><strong>Click the popcorn</strong> to show condiments!.</p>
44 | 				<p><strong>Click the popcorn</strong> again to hide condiments.</p>
45 | 				<pre><code pop-trigger-click-code></code></pre>
46 | 			</div>
47 | 		</article>
48 | 	</div>
49 | 
50 | </div>
51 | <footer>
52 | 	<p>Created with ♥ by <a class="pop-link-yellow"
53 | 							href="https://tonysamperi.github.io"
54 | 							target="_blank">Tony
55 | 		Samperi</a>
56 | 	</p>
57 | 	<p>© {{ year }} MIT License</p>
58 | </footer>
59 | 


--------------------------------------------------------------------------------
/projects/ngx-float-ui-repo/src/app/components/test/test.component.scss:
--------------------------------------------------------------------------------
1 | @import "../demo/demo.component";
2 | 
3 | .expand {
4 | 	min-height: 700px;
5 | }
6 | 


--------------------------------------------------------------------------------
/projects/ngx-float-ui-repo/src/app/components/test/test.component.ts:
--------------------------------------------------------------------------------
 1 | import {Component} from "@angular/core";
 2 | //
 3 | import {NgxFloatUiContentComponent, NgxFloatUiDirective, NgxFloatUiPlacements} from "ngx-float-ui";
 4 | 
 5 | @Component({
 6 |     selector: "app-test",
 7 |     templateUrl: "test.component.html",
 8 |     styleUrls: ["test.component.scss"],
 9 |     standalone: true,
10 |     imports: [NgxFloatUiContentComponent, NgxFloatUiDirective]
11 | })
12 | export class NgxFloatUiTestComponent {
13 | 
14 |     popperPlacements: typeof NgxFloatUiPlacements = NgxFloatUiPlacements;
15 |     year: number = new Date().getFullYear();
16 | 
17 | }
18 | 


--------------------------------------------------------------------------------
/projects/ngx-float-ui-repo/src/app/shared/ngx-float-ui-article-types.model.ts:
--------------------------------------------------------------------------------
 1 | export enum NgxFloatUiArticleTypes {
 2 |     position = "position",
 3 |     overflow = "overflow",
 4 |     flipping = "flipping",
 5 |     theming = "theming",
 6 |     click = "click",
 7 |     scroll = "scroll"
 8 | }
 9 | 
10 | export type NgxFloatUiArticleTypesRef<T = any> = { [key in NgxFloatUiArticleTypes]: T };
11 | 


--------------------------------------------------------------------------------
/projects/ngx-float-ui-repo/src/app/shared/ngx-float-ui-code-map.const.ts:
--------------------------------------------------------------------------------
 1 | import {NgxFloatUiArticleTypesRef} from "./ngx-float-ui-article-types.model";
 2 | import {NgxFloatUiPlacements} from "ngx-float-ui";
 3 | 
 4 | const positionEntries = Object.entries(NgxFloatUiPlacements);
 5 | // tslint:disable-next-line:naming-convention
 6 | export const getNgxFloatUiCodeMap = (positionValue: NgxFloatUiPlacements): NgxFloatUiArticleTypesRef => {
 7 |     const position = positionValue
 8 |         ? positionEntries.find(([, v]) => v === positionValue)[0]
 9 |         : "";
10 | 
11 |     return {
12 |         popLoose: `<img alt="Popcorn box"
13 |                      src="assets/images/popcorn-box.svg"
14 |                      [popperLoose]="'My loose content with string placement'"
15 |                      [popperLoosePlacement]="'TOP'"
16 |                      class="pop-popcorn-box" />
17 | `,
18 |         click: `&lt;float-ui-content #popperClickContent&gt;
19 |             &lt;/float-ui-content&gt;
20 | &lt;img alt="Popcorn box" src="assets/images/popcorn-box.svg"
21 |      [floatUi]="popperClickContent"
22 |      trigger="click"
23 |      [placement]="NgxFloatUiPlacements.BOTTOM"
24 |      class="pop-popcorn-box"&gt;`,
25 |         scroll: `&lt;float-ui-content #popperClickContent&gt;
26 |             &lt;/float-ui-content&gt;
27 | &lt;img alt="Popcorn box" src="assets/images/popcorn-box.svg"
28 |      [floatUi]="popperClickContent"
29 |      [hideOnScroll]="!0"
30 |      trigger="click"
31 |      [placement]="NgxFloatUiPlacements.TOP"
32 |      class="pop-popcorn-box"&gt;`,
33 |         flipping: `&lt;float-ui-content #myPopperContent&gt;
34 |             I'm popper :)
35 |             &lt;/float-ui-content&gt;
36 | &lt;img alt="Popcorn box" src="assets/images/popcorn-box.svg"
37 |      [floatUi]="myPopperContent"
38 |      [showOnStart]="true"
39 |      trigger="click"
40 |      preventOverflow
41 |      [placement]="NgxFloatUiPlacements.TOP"
42 |      class="pop-popcorn-box"&gt;`,
43 |         overflow: `&lt;float-ui-content #popcornPrices&gt;
44 |  &lt;p class="pop-text-bold"&gt;POPCORN&lt;br /&gt;SIZE&lt;br /&gt;&amp; PRICE&lt;/p&gt;
45 |  &lt;ul&gt;
46 |      &lt;li&gt;XXS: $1.99&lt;/li&gt;
47 |      &lt;li&gt;XS: $2.99&lt;/li&gt;
48 |      &lt;li&gt;S: $3.99&lt;/li&gt;
49 |      &lt;li&gt;M: $4.99&lt;/li&gt;
50 |      &lt;li&gt;L: $5.99&lt;/li&gt;
51 |      &lt;li&gt;XL: $6.99&lt;/li&gt;
52 |      &lt;li&gt;XXL: $7.99&lt;/li&gt;
53 |  &lt;/ul&gt;
54 |  &lt;/float-ui-content&gt;
55 |  &lt;img alt="Popcorn box" src="assets/images/popcorn-box.svg"
56 |       [floatUi]="popcornPrices"
57 |       [showOnStart]="true"
58 |       trigger="click"
59 |       [placement]="NgxFloatUiPlacements.RIGHT"
60 |       class="pop-popcorn-box"&gt;`,
61 |         position: `&lt;float-ui-content #myPopperContent&gt;
62 |             I'm popper :)
63 |             &lt;/float-ui-content&gt;
64 | &lt;img alt="Popcorn box" src="assets/images/popcorn-box.svg"
65 |      [floatUi]="myPopperContent"
66 |      [showOnStart]="true"
67 |      [hideOnClickOutside]="false"
68 |      trigger="click"
69 |      [placement]="NgxFloatUiPlacements.${position}"
70 |      class="pop-popcorn-box"&gt;`,
71 |         theming: `@use ngx-float-ui/css/theme-dark.css
72 | /* OR */
73 | @use ngx-float-ui/css/theme-white.css
74 | /* OR */
75 | @use ngx-float-ui/scss/theme-dark
76 | /* OR */
77 | @use ngx-float-ui/scss/theme-white
78 | /* OR */
79 | @include ngx-float-ui-theme(#777, #fff1e0);
80 | `
81 |     } as NgxFloatUiArticleTypesRef;
82 | };
83 | 


--------------------------------------------------------------------------------
/projects/ngx-float-ui-repo/src/assets/.gitkeep:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/tonysamperi/ngx-float-ui/c8d6298c3cf9669d5b251ec15fec652de4eedca6/projects/ngx-float-ui-repo/src/assets/.gitkeep


--------------------------------------------------------------------------------
/projects/ngx-float-ui-repo/src/assets/favicon/favicon.ico:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/tonysamperi/ngx-float-ui/c8d6298c3cf9669d5b251ec15fec652de4eedca6/projects/ngx-float-ui-repo/src/assets/favicon/favicon.ico


--------------------------------------------------------------------------------
/projects/ngx-float-ui-repo/src/assets/fonts/luckiest-guy-latin-400.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/tonysamperi/ngx-float-ui/c8d6298c3cf9669d5b251ec15fec652de4eedca6/projects/ngx-float-ui-repo/src/assets/fonts/luckiest-guy-latin-400.woff


--------------------------------------------------------------------------------
/projects/ngx-float-ui-repo/src/assets/fonts/luckiest-guy-latin-400.woff2:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/tonysamperi/ngx-float-ui/c8d6298c3cf9669d5b251ec15fec652de4eedca6/projects/ngx-float-ui-repo/src/assets/fonts/luckiest-guy-latin-400.woff2


--------------------------------------------------------------------------------
/projects/ngx-float-ui-repo/src/assets/images/popcorn-box.svg:
--------------------------------------------------------------------------------
 1 | <?xml version="1.0" encoding="UTF-8" standalone="no"?>
 2 | <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
 3 | <svg width="100%" height="100%" viewBox="0 0 188 169" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
 4 |     <g id="Artboard1" transform="matrix(1,0,0,1,-1950,-1050)">
 5 |         <rect x="1950" y="1050" width="187.498" height="168.75" style="fill:none;"/>
 6 |         <clipPath id="_clip1">
 7 |             <rect x="1950" y="1050" width="187.498" height="168.75"/>
 8 |         </clipPath>
 9 |         <g clip-path="url(#_clip1)">
10 |             <g transform="matrix(1,0,0,1,18.75,2.34195e-11)">
11 |                 <g transform="matrix(1,0,0,1.5,0.00237366,-693.75)">
12 |                     <path d="M2118.75,1174.5C2118.75,1167.87 2110.69,1162.5 2100.75,1162.5C2064.93,1162.5 1985.08,1162.5 1949.26,1162.5C1939.31,1162.5 1931.26,1167.87 1931.26,1174.5C1931.26,1195.68 1931.26,1237.5 1931.26,1237.5L2118.75,1237.5L2118.75,1174.5Z" style="fill:rgb(255,230,157);"/>
13 |                     <path d="M2100.75,1162.5L2100.98,1162.5L2101.22,1162.5L2101.45,1162.51L2101.68,1162.52L2101.91,1162.52L2102.14,1162.54L2102.36,1162.55L2102.59,1162.56L2102.82,1162.58L2103.04,1162.6L2103.27,1162.62L2103.49,1162.64L2103.71,1162.66L2103.94,1162.69L2104.16,1162.71L2104.38,1162.74L2104.6,1162.78L2104.82,1162.81L2105.03,1162.84L2105.25,1162.88L2105.46,1162.92L2105.68,1162.95L2105.89,1163L2106.1,1163.04L2106.31,1163.08L2106.52,1163.13L2106.73,1163.18L2106.94,1163.23L2107.14,1163.28L2107.35,1163.33L2107.55,1163.39L2107.76,1163.44L2107.96,1163.5L2108.16,1163.56L2108.36,1163.62L2108.55,1163.68L2108.75,1163.75L2108.95,1163.81L2109.14,1163.88L2109.33,1163.95L2109.52,1164.02L2109.71,1164.09L2109.9,1164.16L2110.08,1164.24L2110.27,1164.31L2110.45,1164.39L2110.63,1164.47L2110.81,1164.55L2110.99,1164.63L2111.17,1164.71L2111.35,1164.8L2111.52,1164.88L2111.69,1164.97L2111.86,1165.06L2112.03,1165.15L2112.2,1165.24L2112.37,1165.33L2112.53,1165.43L2112.69,1165.52L2112.85,1165.62L2113.01,1165.71L2113.17,1165.81L2113.32,1165.91L2113.48,1166.02L2113.63,1166.12L2113.78,1166.22L2113.93,1166.33L2114.07,1166.43L2114.22,1166.54L2114.36,1166.65L2114.5,1166.76L2114.64,1166.87L2114.78,1166.98L2114.91,1167.09L2115.04,1167.2L2115.17,1167.32L2115.3,1167.44L2115.43,1167.55L2115.55,1167.67L2115.68,1167.79L2115.8,1167.91L2115.91,1168.03L2116.03,1168.15L2116.14,1168.28L2116.26,1168.4L2116.37,1168.53L2116.47,1168.65L2116.58,1168.78L2116.68,1168.91L2116.78,1169.04L2116.88,1169.17L2116.97,1169.3L2117.07,1169.43L2117.16,1169.56L2117.25,1169.69L2117.34,1169.83L2117.42,1169.96L2117.5,1170.1L2117.58,1170.24L2117.66,1170.37L2117.73,1170.51L2117.8,1170.65L2117.87,1170.79L2117.94,1170.93L2118.01,1171.07L2118.07,1171.21L2118.13,1171.36L2118.18,1171.5L2118.24,1171.64L2118.29,1171.79L2118.34,1171.93L2118.38,1172.08L2118.43,1172.23L2118.47,1172.38L2118.51,1172.52L2118.54,1172.67L2118.57,1172.82L2118.61,1172.97L2118.63,1173.12L2118.66,1173.27L2118.68,1173.42L2118.7,1173.58L2118.71,1173.73L2118.73,1173.88L2118.74,1174.04L2118.74,1174.19L2118.75,1174.35L2118.75,1174.5L2118.75,1237.5L1931.26,1237.5L1931.26,1174.5L1931.26,1174.35L1931.26,1174.19L1931.27,1174.04L1931.28,1173.88L1931.29,1173.73L1931.31,1173.58L1931.33,1173.42L1931.35,1173.27L1931.37,1173.12L1931.4,1172.97L1931.43,1172.82L1931.46,1172.67L1931.5,1172.52L1931.54,1172.38L1931.58,1172.23L1931.62,1172.08L1931.67,1171.93L1931.72,1171.79L1931.77,1171.64L1931.82,1171.5L1931.88,1171.36L1931.94,1171.21L1932,1171.07L1932.06,1170.93L1932.13,1170.79L1932.2,1170.65L1932.27,1170.51L1932.35,1170.37L1932.42,1170.24L1932.5,1170.1L1932.59,1169.96L1932.67,1169.83L1932.76,1169.69L1932.85,1169.56L1932.94,1169.43L1933.03,1169.3L1933.13,1169.17L1933.22,1169.04L1933.32,1168.91L1933.43,1168.78L1933.53,1168.65L1933.64,1168.53L1933.75,1168.4L1933.86,1168.28L1933.97,1168.15L1934.09,1168.03L1934.21,1167.91L1934.33,1167.79L1934.45,1167.67L1934.58,1167.55L1934.7,1167.44L1934.83,1167.32L1934.96,1167.2L1935.09,1167.09L1935.23,1166.98L1935.37,1166.87L1935.5,1166.76L1935.64,1166.65L1935.79,1166.54L1935.93,1166.43L1936.08,1166.33L1936.23,1166.22L1936.38,1166.12L1936.53,1166.02L1936.68,1165.91L1936.84,1165.81L1936.99,1165.71L1937.15,1165.62L1937.31,1165.52L1937.48,1165.43L1937.64,1165.33L1937.81,1165.24L1937.97,1165.15L1938.14,1165.06L1938.31,1164.97L1938.49,1164.88L1938.66,1164.8L1938.84,1164.71L1939.01,1164.63L1939.19,1164.55L1939.37,1164.47L1939.55,1164.39L1939.74,1164.31L1939.92,1164.24L1940.11,1164.16L1940.3,1164.09L1940.48,1164.02L1940.67,1163.95L1940.87,1163.88L1941.06,1163.81L1941.26,1163.75L1941.45,1163.68L1941.65,1163.62L1941.85,1163.56L1942.05,1163.5L1942.25,1163.44L1942.45,1163.39L1942.65,1163.33L1942.86,1163.28L1943.07,1163.23L1943.27,1163.18L1943.48,1163.13L1943.69,1163.08L1943.9,1163.04L1944.11,1163L1944.33,1162.95L1944.54,1162.92L1944.76,1162.88L1944.97,1162.84L1945.19,1162.81L1945.41,1162.78L1945.63,1162.74L1945.85,1162.71L1946.07,1162.69L1946.29,1162.66L1946.51,1162.64L1946.74,1162.62L1946.96,1162.6L1947.19,1162.58L1947.41,1162.56L1947.64,1162.55L1947.87,1162.54L1948.1,1162.52L1948.33,1162.52L1948.56,1162.51L1948.79,1162.5L1949.02,1162.5L1949.26,1162.5L2100.75,1162.5ZM1949.05,1164.03L1948.85,1164.03L1948.65,1164.04L1948.44,1164.04L1948.24,1164.05L1948.04,1164.06L1947.84,1164.07L1947.65,1164.08L1947.45,1164.1L1947.25,1164.11L1947.06,1164.13L1946.86,1164.15L1946.66,1164.17L1946.47,1164.19L1946.28,1164.21L1946.09,1164.24L1945.89,1164.27L1945.7,1164.3L1945.52,1164.33L1945.33,1164.36L1945.14,1164.39L1944.95,1164.42L1944.77,1164.46L1944.58,1164.5L1944.4,1164.54L1944.22,1164.58L1944.03,1164.62L1943.85,1164.66L1943.67,1164.71L1943.5,1164.75L1943.32,1164.8L1943.14,1164.85L1942.97,1164.9L1942.79,1164.95L1942.62,1165.01L1942.45,1165.06L1942.28,1165.12L1942.11,1165.17L1941.94,1165.23L1941.77,1165.29L1941.6,1165.35L1941.44,1165.41L1941.27,1165.48L1941.11,1165.54L1940.95,1165.61L1940.79,1165.68L1940.63,1165.75L1940.47,1165.82L1940.32,1165.89L1940.16,1165.96L1940.01,1166.03L1939.86,1166.11L1939.71,1166.18L1939.56,1166.26L1939.41,1166.34L1939.26,1166.42L1939.12,1166.5L1938.98,1166.58L1938.83,1166.66L1938.69,1166.75L1938.55,1166.83L1938.42,1166.92L1938.28,1167.01L1938.15,1167.1L1938.02,1167.18L1937.88,1167.28L1937.75,1167.37L1937.63,1167.46L1937.5,1167.55L1937.38,1167.65L1937.25,1167.74L1937.13,1167.84L1937.01,1167.94L1936.9,1168.04L1936.78,1168.13L1936.67,1168.24L1936.55,1168.34L1936.44,1168.44L1936.34,1168.54L1936.23,1168.65L1936.12,1168.75L1936.02,1168.86L1935.92,1168.96L1935.82,1169.07L1935.72,1169.18L1935.63,1169.29L1935.53,1169.4L1935.44,1169.51L1935.35,1169.62L1935.26,1169.73L1935.18,1169.85L1935.09,1169.96L1935.01,1170.08L1934.93,1170.19L1934.86,1170.31L1934.78,1170.42L1934.71,1170.54L1934.63,1170.66L1934.57,1170.78L1934.5,1170.9L1934.43,1171.02L1934.37,1171.14L1934.31,1171.26L1934.25,1171.38L1934.2,1171.51L1934.14,1171.63L1934.09,1171.76L1934.04,1171.88L1933.99,1172.01L1933.95,1172.13L1933.91,1172.26L1933.87,1172.39L1933.83,1172.52L1933.79,1172.64L1933.76,1172.77L1933.73,1172.9L1933.7,1173.03L1933.67,1173.16L1933.65,1173.3L1933.63,1173.43L1933.61,1173.56L1933.59,1173.69L1933.58,1173.83L1933.57,1173.96L1933.56,1174.09L1933.55,1174.23L1933.55,1174.36L1933.55,1174.51L1933.55,1235.97L2116.46,1235.97L2116.46,1174.51L2116.46,1174.36L2116.45,1174.23L2116.45,1174.09L2116.44,1173.96L2116.43,1173.83L2116.41,1173.69L2116.4,1173.56L2116.38,1173.43L2116.36,1173.3L2116.33,1173.16L2116.31,1173.03L2116.28,1172.9L2116.25,1172.77L2116.21,1172.64L2116.18,1172.52L2116.14,1172.39L2116.1,1172.26L2116.06,1172.13L2116.01,1172.01L2115.96,1171.88L2115.91,1171.76L2115.86,1171.63L2115.81,1171.51L2115.75,1171.38L2115.69,1171.26L2115.63,1171.14L2115.57,1171.02L2115.51,1170.9L2115.44,1170.78L2115.37,1170.66L2115.3,1170.54L2115.22,1170.42L2115.15,1170.31L2115.07,1170.19L2114.99,1170.08L2114.91,1169.96L2114.83,1169.85L2114.74,1169.73L2114.65,1169.62L2114.56,1169.51L2114.47,1169.4L2114.38,1169.29L2114.28,1169.18L2114.19,1169.07L2114.09,1168.96L2113.99,1168.86L2113.88,1168.75L2113.78,1168.65L2113.67,1168.54L2113.56,1168.44L2113.45,1168.34L2113.34,1168.24L2113.22,1168.13L2113.11,1168.04L2112.99,1167.94L2112.87,1167.84L2112.75,1167.74L2112.63,1167.65L2112.5,1167.55L2112.38,1167.46L2112.25,1167.37L2112.12,1167.28L2111.99,1167.18L2111.86,1167.1L2111.72,1167.01L2111.59,1166.92L2111.45,1166.83L2111.31,1166.75L2111.17,1166.66L2111.03,1166.58L2110.89,1166.5L2110.74,1166.42L2110.6,1166.34L2110.45,1166.26L2110.3,1166.18L2110.15,1166.11L2109.99,1166.03L2109.84,1165.96L2109.69,1165.89L2109.53,1165.82L2109.37,1165.75L2109.22,1165.68L2109.05,1165.61L2108.89,1165.54L2108.73,1165.48L2108.57,1165.41L2108.4,1165.35L2108.24,1165.29L2108.07,1165.23L2107.9,1165.17L2107.73,1165.12L2107.56,1165.06L2107.39,1165.01L2107.21,1164.95L2107.04,1164.9L2106.86,1164.85L2106.69,1164.8L2106.51,1164.75L2106.33,1164.71L2106.15,1164.66L2105.97,1164.62L2105.79,1164.58L2105.61,1164.54L2105.42,1164.5L2105.24,1164.46L2105.05,1164.42L2104.87,1164.39L2104.68,1164.36L2104.49,1164.33L2104.3,1164.3L2104.11,1164.27L2103.92,1164.24L2103.73,1164.21L2103.53,1164.19L2103.34,1164.17L2103.14,1164.15L2102.95,1164.13L2102.75,1164.11L2102.56,1164.1L2102.36,1164.08L2102.16,1164.07L2101.96,1164.06L2101.76,1164.05L2101.56,1164.04L2101.36,1164.04L2101.16,1164.03L2100.95,1164.03L2100.74,1164.03L1949.26,1164.03L1949.05,1164.03Z" style="fill:rgb(200,59,80);"/>
14 |                 </g>
15 |                 <g transform="matrix(1.04736,0,0,1.06044,-360.97,-57.4004)">
16 |                     <path d="M2190.71,1150.25C2190.71,1150.25 2190.24,1125.69 2192.29,1122.77C2194.24,1119.99 2199.41,1118.92 2199.41,1118.92C2199.41,1118.92 2194,1106.84 2200.69,1097.03C2207.55,1086.96 2222.49,1087.97 2222.49,1087.97C2222.49,1087.97 2224.84,1075.38 2236.65,1075.1C2249.74,1074.8 2252.65,1088.01 2252.65,1088.01C2252.65,1088.01 2255.23,1088.47 2256.36,1089.07C2257.53,1089.7 2259.25,1091.1 2259.25,1091.1C2259.25,1091.1 2259.95,1079.67 2268.27,1076.41C2280.25,1071.69 2287.17,1081.49 2287.17,1081.49C2287.17,1081.49 2288.42,1079.12 2291.05,1077.36C2293.35,1075.82 2297.45,1076 2297.45,1076C2297.45,1076 2292.96,1059.16 2311.57,1056.26C2324.6,1054.22 2327.99,1069.1 2327.99,1069.1C2327.99,1069.1 2334.26,1067.35 2338.32,1071.92C2341.9,1075.93 2340.34,1081.69 2340.34,1081.69C2340.34,1081.69 2342.78,1082.23 2344.35,1084.08C2345.95,1085.98 2345.75,1088.12 2345.75,1088.12C2345.75,1088.12 2355.49,1086.28 2358.63,1092.84C2362.33,1100.54 2354.82,1104.73 2354.82,1104.73C2354.82,1104.73 2357.99,1107.71 2358.88,1111.42C2359.79,1115.2 2358.95,1118.96 2358.95,1118.96C2358.95,1118.96 2362.6,1120.53 2364.34,1123.33C2366.2,1126.34 2366.63,1150.47 2366.63,1150.47L2190.71,1150.25Z" style="fill:rgb(255,218,125);"/>
17 |                     <ellipse cx="2240.54" cy="1093.82" rx="6.564" ry="6.52" style="fill:rgb(255,173,26);"/>
18 |                     <ellipse cx="2318.73" cy="1084.49" rx="9.435" ry="9.511" style="fill:rgb(255,173,26);"/>
19 |                     <ellipse cx="2340.53" cy="1100.08" rx="6.414" ry="6.226" style="fill:rgb(255,173,26);"/>
20 |                     <path d="M2202.25,1150.15C2202.25,1150.15 2196.49,1133.03 2205.43,1125.14C2213.46,1118.06 2219.28,1121.07 2219.28,1121.07L2221.7,1119.24C2221.7,1119.24 2220.8,1114.83 2222.59,1111.04C2224.7,1106.55 2228.91,1105.68 2231.75,1105.78C2239.2,1106.03 2239.51,1112.96 2239.51,1112.96C2239.51,1112.96 2245.51,1112.76 2247.74,1113.57C2249.72,1114.29 2251.56,1115.9 2252.38,1117.82C2253.19,1119.73 2252.63,1125.06 2252.63,1125.06C2252.63,1125.06 2255.43,1124.39 2258.43,1124.92C2261.06,1125.38 2262.58,1127.01 2262.58,1127.01L2265.25,1125.96C2265.25,1125.96 2265.18,1119.29 2266.37,1117.07C2267.56,1114.87 2272.44,1112.63 2272.44,1112.63C2272.44,1112.63 2270.89,1110.23 2271.2,1108.56C2271.8,1105.28 2272.64,1103.8 2274.63,1102.19C2277.01,1100.27 2278.22,1100.13 2281.29,1099.86C2283.21,1099.68 2285.09,1100.95 2285.09,1100.95C2285.09,1100.95 2287.01,1097.87 2288.26,1096.73C2289.52,1095.58 2291.03,1094.64 2292.63,1094.08C2294.23,1093.51 2296.22,1093.27 2297.86,1093.35C2299.45,1093.42 2301.07,1093.78 2302.47,1094.51C2305.19,1095.94 2306.87,1097.22 2308.59,1100.36C2309.74,1102.46 2309.62,1107.47 2309.62,1107.47C2309.62,1107.47 2313.36,1106.33 2315.28,1106.39C2317.28,1106.46 2319.76,1106.76 2321.63,1107.86C2323.51,1108.97 2325.55,1110.87 2326.55,1113.03C2327.57,1115.23 2328.2,1118.6 2327.74,1121.11C2327.28,1123.62 2323.81,1128.08 2323.81,1128.08C2323.81,1128.08 2332.95,1128.46 2338.35,1135.41C2343.39,1141.91 2342.05,1150.52 2342.05,1150.52L2202.25,1150.15Z" style="fill:rgb(255,173,26);"/>
21 |                     <g transform="matrix(0.954782,0,0,0.943007,339.521,55.2063)">
22 |                         <path d="M1960.7,1157.38C1961.1,1153.5 1960.48,1147.22 1965.59,1142.32C1970.22,1137.88 1975.24,1143.08 1975.24,1143.08C1975.24,1143.08 1977.84,1134.15 1990.31,1135.93C2002.56,1137.68 1999.8,1145.98 2000.96,1150.97C2002.12,1155.94 1997.26,1165.84 1997.26,1165.84L1963.14,1165.57C1963.14,1165.57 1960.4,1160.21 1960.7,1157.38Z" style="fill:rgb(255,218,125);"/>
23 |                     </g>
24 |                     <g transform="matrix(0.954782,0,0,0.943007,344.648,54.129)">
25 |                         <path d="M2025.64,1157.41C2025.64,1157.41 2016.65,1153.38 2022.39,1139.02C2025.84,1130.38 2038.65,1133.64 2038.65,1133.64C2038.65,1133.64 2037.42,1121.96 2047.61,1121.76C2060.58,1121.51 2056.72,1137.37 2056.72,1137.37C2056.72,1137.37 2068.97,1136.94 2069.06,1143.04C2069.24,1155.84 2058.9,1152.09 2054.51,1156.17C2050.51,1159.89 2047.51,1167.32 2042.7,1167.52C2037.89,1167.73 2025.64,1157.41 2025.64,1157.41Z" style="fill:rgb(255,218,125);"/>
26 |                     </g>
27 |                 </g>
28 |                 <g transform="matrix(1,0,0,1.5,0.00237366,-693.75)">
29 |                     <path d="M2100.75,1162.5L2100.98,1162.5L2101.22,1162.5L2101.45,1162.51L2101.68,1162.52L2101.91,1162.52L2102.14,1162.54L2102.36,1162.55L2102.59,1162.56L2102.82,1162.58L2103.04,1162.6L2103.27,1162.62L2103.49,1162.64L2103.71,1162.66L2103.94,1162.69L2104.16,1162.71L2104.38,1162.74L2104.6,1162.78L2104.82,1162.81L2105.03,1162.84L2105.25,1162.88L2105.46,1162.92L2105.68,1162.95L2105.89,1163L2106.1,1163.04L2106.31,1163.08L2106.52,1163.13L2106.73,1163.18L2106.94,1163.23L2107.14,1163.28L2107.35,1163.33L2107.55,1163.39L2107.76,1163.44L2107.96,1163.5L2108.16,1163.56L2108.36,1163.62L2108.55,1163.68L2108.75,1163.75L2108.95,1163.81L2109.14,1163.88L2109.33,1163.95L2109.52,1164.02L2109.71,1164.09L2109.9,1164.16L2110.08,1164.24L2110.27,1164.31L2110.45,1164.39L2110.63,1164.47L2110.81,1164.55L2110.99,1164.63L2111.17,1164.71L2111.35,1164.8L2111.52,1164.88L2111.69,1164.97L2111.86,1165.06L2112.03,1165.15L2112.2,1165.24L2112.37,1165.33L2112.53,1165.43L2112.69,1165.52L2112.85,1165.62L2113.01,1165.71L2113.17,1165.81L2113.32,1165.91L2113.48,1166.02L2113.63,1166.12L2113.78,1166.22L2113.93,1166.33L2114.07,1166.43L2114.22,1166.54L2114.36,1166.65L2114.5,1166.76L2114.64,1166.87L2114.78,1166.98L2114.91,1167.09L2115.04,1167.2L2115.17,1167.32L2115.3,1167.44L2115.43,1167.55L2115.55,1167.67L2115.68,1167.79L2115.8,1167.91L2115.91,1168.03L2116.03,1168.15L2116.14,1168.28L2116.26,1168.4L2116.37,1168.53L2116.47,1168.65L2116.58,1168.78L2116.68,1168.91L2116.78,1169.04L2116.88,1169.17L2116.97,1169.3L2117.07,1169.43L2117.16,1169.56L2117.25,1169.69L2117.34,1169.83L2117.42,1169.96L2117.5,1170.1L2117.58,1170.24L2117.66,1170.37L2117.73,1170.51L2117.8,1170.65L2117.87,1170.79L2117.94,1170.93L2118.01,1171.07L2118.07,1171.21L2118.13,1171.36L2118.18,1171.5L2118.24,1171.64L2118.29,1171.79L2118.34,1171.93L2118.38,1172.08L2118.43,1172.23L2118.47,1172.38L2118.51,1172.52L2118.54,1172.67L2118.57,1172.82L2118.61,1172.97L2118.63,1173.12L2118.66,1173.27L2118.68,1173.42L2118.7,1173.58L2118.71,1173.73L2118.73,1173.88L2118.74,1174.04L2118.74,1174.19L2118.75,1174.35L2118.75,1174.5L2118.75,1237.5L1931.26,1237.5L1931.26,1174.5L1931.26,1174.35L1931.26,1174.19L1931.27,1174.04L1931.28,1173.88L1931.29,1173.73L1931.31,1173.58L1931.33,1173.42L1931.35,1173.27L1931.37,1173.12L1931.4,1172.97L1931.43,1172.82L1931.46,1172.67L1931.5,1172.52L1931.54,1172.38L1931.58,1172.23L1931.62,1172.08L1931.67,1171.93L1931.72,1171.79L1931.77,1171.64L1931.82,1171.5L1931.88,1171.36L1931.94,1171.21L1932,1171.07L1932.06,1170.93L1932.13,1170.79L1932.2,1170.65L1932.27,1170.51L1932.35,1170.37L1932.42,1170.24L1932.5,1170.1L1932.59,1169.96L1932.67,1169.83L1932.76,1169.69L1932.85,1169.56L1932.94,1169.43L1933.03,1169.3L1933.13,1169.17L1933.22,1169.04L1933.32,1168.91L1933.43,1168.78L1933.53,1168.65L1933.64,1168.53L1933.75,1168.4L1933.86,1168.28L1933.97,1168.15L1934.09,1168.03L1934.21,1167.91L1934.33,1167.79L1934.45,1167.67L1934.58,1167.55L1934.7,1167.44L1934.83,1167.32L1934.96,1167.2L1935.09,1167.09L1935.23,1166.98L1935.37,1166.87L1935.5,1166.76L1935.64,1166.65L1935.79,1166.54L1935.93,1166.43L1936.08,1166.33L1936.23,1166.22L1936.38,1166.12L1936.53,1166.02L1936.68,1165.91L1936.84,1165.81L1936.99,1165.71L1937.15,1165.62L1937.31,1165.52L1937.48,1165.43L1937.64,1165.33L1937.81,1165.24L1937.97,1165.15L1938.14,1165.06L1938.31,1164.97L1938.49,1164.88L1938.66,1164.8L1938.84,1164.71L1939.01,1164.63L1939.19,1164.55L1939.37,1164.47L1939.55,1164.39L1939.74,1164.31L1939.92,1164.24L1940.11,1164.16L1940.3,1164.09L1940.48,1164.02L1940.67,1163.95L1940.87,1163.88L1941.06,1163.81L1941.26,1163.75L1941.45,1163.68L1941.65,1163.62L1941.85,1163.56L1942.05,1163.5L1942.25,1163.44L1942.45,1163.39L1942.65,1163.33L1942.86,1163.28L1943.07,1163.23L1943.27,1163.18L1943.48,1163.13L1943.69,1163.08L1943.9,1163.04L1944.11,1163L1944.33,1162.95L1944.54,1162.92L1944.76,1162.88L1944.97,1162.84L1945.19,1162.81L1945.41,1162.78L1945.63,1162.74L1945.85,1162.71L1946.07,1162.69L1946.29,1162.66L1946.51,1162.64L1946.74,1162.62L1946.96,1162.6L1947.19,1162.58L1947.41,1162.56L1947.64,1162.55L1947.87,1162.54L1948.1,1162.52L1948.33,1162.52L1948.56,1162.51L1948.79,1162.5L1949.02,1162.5L1949.26,1162.5L2100.75,1162.5ZM1949.1,1166.67L1948.95,1166.67L1948.8,1166.67L1948.64,1166.68L1948.49,1166.68L1948.34,1166.69L1948.19,1166.7L1948.05,1166.71L1947.9,1166.72L1947.75,1166.73L1947.6,1166.74L1947.46,1166.76L1947.31,1166.77L1947.17,1166.79L1947.02,1166.81L1946.88,1166.83L1946.74,1166.85L1946.6,1166.87L1946.45,1166.89L1946.31,1166.91L1946.17,1166.94L1946.04,1166.96L1945.9,1166.99L1945.76,1167.02L1945.62,1167.05L1945.49,1167.08L1945.35,1167.11L1945.22,1167.14L1945.08,1167.17L1944.95,1167.21L1944.82,1167.24L1944.68,1167.28L1944.55,1167.32L1944.42,1167.36L1944.29,1167.4L1944.16,1167.44L1944.04,1167.48L1943.91,1167.52L1943.78,1167.57L1943.66,1167.61L1943.53,1167.65L1943.41,1167.7L1943.29,1167.75L1943.17,1167.8L1943.05,1167.85L1942.93,1167.9L1942.81,1167.95L1942.69,1168L1942.57,1168.06L1942.46,1168.11L1942.34,1168.16L1942.23,1168.22L1942.12,1168.28L1942,1168.34L1941.89,1168.39L1941.78,1168.45L1941.67,1168.51L1941.57,1168.58L1941.46,1168.64L1941.36,1168.7L1941.25,1168.77L1941.15,1168.83L1941.05,1168.89L1940.95,1168.96L1940.85,1169.03L1940.75,1169.1L1940.65,1169.16L1940.56,1169.23L1940.46,1169.3L1940.37,1169.38L1940.28,1169.45L1940.19,1169.52L1940.1,1169.59L1940.01,1169.67L1939.92,1169.74L1939.84,1169.82L1939.75,1169.89L1939.67,1169.97L1939.59,1170.05L1939.51,1170.12L1939.43,1170.2L1939.35,1170.28L1939.28,1170.36L1939.2,1170.44L1939.13,1170.52L1939.06,1170.6L1938.99,1170.69L1938.92,1170.77L1938.85,1170.85L1938.79,1170.94L1938.72,1171.02L1938.66,1171.11L1938.6,1171.19L1938.54,1171.28L1938.48,1171.37L1938.43,1171.45L1938.37,1171.54L1938.32,1171.63L1938.27,1171.72L1938.22,1171.81L1938.17,1171.9L1938.12,1171.99L1938.08,1172.08L1938.03,1172.17L1937.99,1172.26L1937.95,1172.35L1937.91,1172.45L1937.87,1172.54L1937.84,1172.63L1937.81,1172.73L1937.77,1172.82L1937.74,1172.92L1937.72,1173.01L1937.69,1173.11L1937.66,1173.2L1937.64,1173.3L1937.62,1173.4L1937.6,1173.5L1937.58,1173.6L1937.57,1173.69L1937.55,1173.79L1937.54,1173.89L1937.53,1173.99L1937.52,1174.09L1937.51,1174.19L1937.51,1174.3L1937.51,1174.4L1937.51,1174.51L1937.51,1233.33L2112.5,1233.33L2112.5,1174.51L2112.5,1174.4L2112.5,1174.3L2112.49,1174.19L2112.48,1174.09L2112.48,1173.99L2112.47,1173.89L2112.45,1173.79L2112.44,1173.69L2112.42,1173.6L2112.41,1173.5L2112.39,1173.4L2112.36,1173.3L2112.34,1173.2L2112.32,1173.11L2112.29,1173.01L2112.26,1172.92L2112.23,1172.82L2112.2,1172.73L2112.17,1172.63L2112.13,1172.54L2112.09,1172.45L2112.05,1172.35L2112.01,1172.26L2111.97,1172.17L2111.93,1172.08L2111.88,1171.99L2111.84,1171.9L2111.79,1171.81L2111.74,1171.72L2111.69,1171.63L2111.63,1171.54L2111.58,1171.45L2111.52,1171.37L2111.47,1171.28L2111.41,1171.19L2111.34,1171.11L2111.28,1171.02L2111.22,1170.94L2111.15,1170.85L2111.09,1170.77L2111.02,1170.69L2110.95,1170.6L2110.88,1170.52L2110.8,1170.44L2110.73,1170.36L2110.65,1170.28L2110.57,1170.2L2110.5,1170.12L2110.42,1170.05L2110.34,1169.97L2110.25,1169.89L2110.17,1169.82L2110.08,1169.74L2110,1169.67L2109.91,1169.59L2109.82,1169.52L2109.73,1169.45L2109.64,1169.38L2109.54,1169.3L2109.45,1169.23L2109.35,1169.16L2109.26,1169.1L2109.16,1169.03L2109.06,1168.96L2108.96,1168.89L2108.86,1168.83L2108.75,1168.77L2108.65,1168.7L2108.54,1168.64L2108.44,1168.58L2108.33,1168.51L2108.22,1168.45L2108.11,1168.39L2108,1168.34L2107.89,1168.28L2107.78,1168.22L2107.66,1168.16L2107.55,1168.11L2107.43,1168.06L2107.32,1168L2107.2,1167.95L2107.08,1167.9L2106.96,1167.85L2106.84,1167.8L2106.72,1167.75L2106.59,1167.7L2106.47,1167.65L2106.35,1167.61L2106.22,1167.57L2106.1,1167.52L2105.97,1167.48L2105.84,1167.44L2105.71,1167.4L2105.58,1167.36L2105.45,1167.32L2105.32,1167.28L2105.19,1167.24L2105.06,1167.21L2104.92,1167.17L2104.79,1167.14L2104.66,1167.11L2104.52,1167.08L2104.38,1167.05L2104.25,1167.02L2104.11,1166.99L2103.97,1166.96L2103.83,1166.94L2103.69,1166.91L2103.55,1166.89L2103.41,1166.87L2103.27,1166.85L2103.12,1166.83L2102.98,1166.81L2102.84,1166.79L2102.69,1166.77L2102.55,1166.76L2102.4,1166.74L2102.25,1166.73L2102.11,1166.72L2101.96,1166.71L2101.81,1166.7L2101.66,1166.69L2101.51,1166.68L2101.36,1166.68L2101.21,1166.67L2101.06,1166.67L2100.9,1166.67L2100.73,1166.67L1949.28,1166.67L1949.1,1166.67Z" style="fill:rgb(200,59,80);"/>
30 |                 </g>
31 |                 <g transform="matrix(1,0,0,0.75,0.00237366,290.625)">
32 |                     <path d="M2118.75,1162.5L1931.26,1162.5L1931.26,1225.5C1931.26,1228.68 1932.2,1231.74 1933.89,1233.99C1935.58,1236.24 1937.87,1237.5 1940.26,1237.5C1971.93,1237.5 2078.07,1237.5 2109.75,1237.5C2112.14,1237.5 2114.43,1236.24 2116.11,1233.99C2117.8,1231.74 2118.75,1228.68 2118.75,1225.5C2118.75,1204.32 2118.75,1162.5 2118.75,1162.5Z" style="fill:rgb(200,59,80);"/>
33 |                 </g>
34 |                 <g transform="matrix(1,0,0,1,0.00474731,1.36424e-11)">
35 |                     <circle cx="1950" cy="1162.5" r="18.75" style="fill:rgb(200,59,80);"/>
36 |                 </g>
37 |                 <g transform="matrix(1,0,0,1,0.00474731,1.36424e-11)">
38 |                     <circle cx="1987.5" cy="1162.5" r="18.75" style="fill:white;"/>
39 |                 </g>
40 |                 <g transform="matrix(1,0,0,1,0.00474731,1.36424e-11)">
41 |                     <circle cx="2025" cy="1162.5" r="18.75" style="fill:rgb(200,59,80);"/>
42 |                 </g>
43 |                 <g transform="matrix(1,0,0,1,37.5047,1.36424e-11)">
44 |                     <circle cx="2025" cy="1162.5" r="18.75" style="fill:white;"/>
45 |                 </g>
46 |                 <g transform="matrix(1,0,0,1,75,1.36424e-11)">
47 |                     <circle cx="2025" cy="1162.5" r="18.75" style="fill:rgb(200,59,80);"/>
48 |                 </g>
49 |                 <g transform="matrix(1,0,0,0.75,0,290.625)">
50 |                     <rect x="1968.76" y="1162.5" width="37.5" height="75" style="fill:white;"/>
51 |                 </g>
52 |                 <g transform="matrix(1,0,0,0.75,0,290.625)">
53 |                     <rect x="2043.76" y="1162.5" width="37.5" height="75" style="fill:white;"/>
54 |                 </g>
55 |             </g>
56 |         </g>
57 |     </g>
58 | </svg>
59 | 


--------------------------------------------------------------------------------
/projects/ngx-float-ui-repo/src/assets/images/popper-icon.eps:
--------------------------------------------------------------------------------
  1 | %!PS-Adobe-3.0 EPSF-3.0
  2 | %%CreationDate: Tue Sep 15 15:35:14 2020
  3 | %%LanguageLevel: 3
  4 | %%BoundingBox: 0 0 512 512
  5 | %%EndComments
  6 | newpath
  7 | 261.08 475.88 moveto
  8 | 280.90 490.55 305.10 499.90 329.95 499.96 curveto
  9 | 353.23 500.73 376.60 493.79 395.96 480.90 curveto
 10 | 419.09 465.60 436.47 441.70 443.53 414.85 curveto
 11 | 443.92 413.30 444.30 411.57 445.85 410.76 curveto
 12 | 468.72 393.58 486.92 370.25 497.99 343.87 curveto
 13 | 514.23 305.59 514.94 261.01 499.81 222.26 curveto
 14 | 485.72 185.55 457.78 154.41 422.82 136.42 curveto
 15 | 420.33 135.49 419.49 132.84 418.21 130.77 curveto
 16 | 403.42 105.95 381.66 85.34 356.07 71.95 curveto
 17 | 353.04 70.47 350.95 67.74 348.57 65.45 curveto
 18 | 333.53 50.46 318.58 35.38 303.49 20.44 curveto
 19 | 291.58 8.89 270.58 9.03 258.88 20.82 curveto
 20 | 242.98 36.59 227.20 52.49 211.33 68.31 curveto
 21 | 208.26 71.30 205.50 74.71 201.68 76.79 curveto
 22 | 185.42 86.57 171.13 99.46 159.32 114.28 curveto
 23 | 124.73 116.14 90.88 129.17 63.96 150.97 curveto
 24 | 39.31 170.76 20.40 197.65 10.28 227.62 curveto
 25 | -1.45 262.02 -1.53 300.27 10.13 334.71 curveto
 26 | 25.38 380.75 61.77 419.17 106.92 436.89 curveto
 27 | 109.90 437.71 111.37 440.60 113.30 442.75 curveto
 28 | 127.44 459.49 148.18 470.51 169.99 472.80 curveto
 29 | 194.35 475.69 219.53 467.39 237.78 451.09 curveto
 30 | 244.20 460.48 252.15 468.82 261.08 475.88 curveto
 31 | 250.39 421.64 moveto
 32 | 244.47 406.51 246.11 389.27 252.83 374.69 curveto
 33 | 254.74 369.85 258.65 365.41 257.88 359.88 curveto
 34 | 257.40 352.24 248.73 346.68 241.56 349.34 curveto
 35 | 236.81 350.67 234.21 355.15 232.30 359.33 curveto
 36 | 225.33 373.09 221.11 388.47 221.61 403.97 curveto
 37 | 221.63 412.02 223.64 419.83 225.59 427.56 curveto
 38 | 212.56 442.49 191.89 450.27 172.24 447.76 curveto
 39 | 155.05 445.84 138.92 436.23 129.07 422.01 curveto
 40 | 120.11 411.63 113.40 398.01 115.19 383.97 curveto
 41 | 116.31 377.47 111.50 370.72 104.98 369.69 curveto
 42 | 98.76 368.41 92.05 372.70 90.65 378.91 curveto
 43 | 89.15 385.96 89.71 393.26 90.73 400.34 curveto
 44 | 74.54 389.50 60.41 375.54 49.76 359.20 curveto
 45 | 34.02 335.33 25.83 306.59 26.61 278.01 curveto
 46 | 27.24 246.01 39.20 214.40 59.88 189.98 curveto
 47 | 81.12 164.51 111.55 146.90 144.24 141.26 curveto
 48 | 140.08 151.02 137.17 161.42 136.58 172.04 curveto
 49 | 136.16 179.18 142.90 185.65 150.03 184.84 curveto
 50 | 156.14 184.61 161.34 179.19 161.64 173.14 curveto
 51 | 162.68 160.36 167.87 148.35 174.41 137.46 curveto
 52 | 184.99 119.77 201.14 105.93 218.93 95.81 curveto
 53 | 246.26 80.42 279.19 75.49 309.88 81.83 curveto
 54 | 345.17 89.04 377.10 111.41 395.71 142.27 curveto
 55 | 401.17 152.69 406.13 163.50 408.90 174.98 curveto
 56 | 410.06 179.62 409.58 185.08 413.23 188.72 curveto
 57 | 418.03 194.33 427.75 194.04 432.20 188.13 curveto
 58 | 435.75 184.19 434.97 178.58 434.44 173.74 curveto
 59 | 453.61 189.56 468.81 210.29 477.26 233.71 curveto
 60 | 487.49 261.48 488.23 292.57 479.62 320.86 curveto
 61 | 470.78 350.18 451.72 376.20 426.60 393.69 curveto
 62 | 423.33 395.83 421.12 399.29 420.50 403.15 curveto
 63 | 416.12 425.01 403.07 444.90 385.00 457.92 curveto
 64 | 369.19 469.39 349.56 475.58 330.00 474.86 curveto
 65 | 296.24 474.47 263.33 452.98 250.39 421.64 curveto
 66 | 345.50 258.37 moveto
 67 | 352.34 259.72 359.76 257.57 364.72 252.64 curveto
 68 | 369.93 247.71 372.35 240.08 370.94 233.05 curveto
 69 | 369.63 225.98 364.55 219.79 357.90 217.08 curveto
 70 | 351.71 214.50 344.33 215.04 338.59 218.53 curveto
 71 | 331.87 222.43 327.62 230.20 328.10 237.97 curveto
 72 | 328.19 247.74 335.94 256.62 345.50 258.37 curveto
 73 | 188.44 257.36 moveto
 74 | 194.59 258.60 201.24 257.12 206.15 253.19 curveto
 75 | 212.79 248.12 215.96 239.01 213.82 230.92 curveto
 76 | 211.57 221.25 201.97 213.95 192.03 214.52 curveto
 77 | 181.22 214.68 171.54 224.10 171.23 234.93 curveto
 78 | 170.37 245.34 178.22 255.44 188.44 257.36 curveto
 79 | 216.22 189.15 moveto
 80 | 254.82 189.17 293.42 189.17 332.02 189.15 curveto
 81 | 329.36 172.13 320.30 155.93 306.34 145.66 curveto
 82 | 294.95 137.16 280.14 133.17 266.06 135.51 curveto
 83 | 254.01 137.31 242.82 143.52 234.41 152.28 curveto
 84 | 224.64 162.25 218.50 175.45 216.22 189.15 curveto
 85 | closepath
 86 | 0.784 0.231 0.314 setrgbcolor
 87 | fill
 88 | newpath
 89 | 250.39 421.64 moveto
 90 | 263.33 452.98 296.24 474.47 330.00 474.86 curveto
 91 | 349.56 475.58 369.19 469.39 385.00 457.92 curveto
 92 | 403.07 444.90 416.12 425.01 420.50 403.15 curveto
 93 | 421.12 399.29 423.33 395.83 426.60 393.69 curveto
 94 | 451.72 376.20 470.78 350.18 479.62 320.86 curveto
 95 | 488.23 292.57 487.49 261.48 477.26 233.71 curveto
 96 | 468.81 210.29 453.61 189.56 434.44 173.74 curveto
 97 | 434.97 178.58 435.75 184.19 432.20 188.13 curveto
 98 | 427.75 194.04 418.03 194.33 413.23 188.72 curveto
 99 | 409.58 185.08 410.06 179.62 408.90 174.98 curveto
100 | 406.13 163.50 401.17 152.69 395.71 142.27 curveto
101 | 377.10 111.41 345.17 89.04 309.88 81.83 curveto
102 | 279.19 75.49 246.26 80.42 218.93 95.81 curveto
103 | 201.14 105.93 184.99 119.77 174.41 137.46 curveto
104 | 167.87 148.35 162.68 160.36 161.64 173.14 curveto
105 | 161.34 179.19 156.14 184.61 150.03 184.84 curveto
106 | 142.90 185.65 136.16 179.18 136.58 172.04 curveto
107 | 137.17 161.42 140.08 151.02 144.24 141.26 curveto
108 | 111.55 146.90 81.12 164.51 59.88 189.98 curveto
109 | 39.20 214.40 27.24 246.01 26.61 278.01 curveto
110 | 25.83 306.59 34.02 335.33 49.76 359.20 curveto
111 | 60.41 375.54 74.54 389.50 90.73 400.34 curveto
112 | 89.71 393.26 89.15 385.96 90.65 378.91 curveto
113 | 92.05 372.70 98.76 368.41 104.98 369.69 curveto
114 | 111.50 370.72 116.31 377.47 115.19 383.97 curveto
115 | 113.40 398.01 120.11 411.63 129.07 422.01 curveto
116 | 138.92 436.23 155.05 445.84 172.24 447.76 curveto
117 | 191.89 450.27 212.56 442.49 225.59 427.56 curveto
118 | 223.64 419.83 221.63 412.02 221.61 403.97 curveto
119 | 221.11 388.47 225.33 373.09 232.30 359.33 curveto
120 | 234.21 355.15 236.81 350.67 241.56 349.34 curveto
121 | 248.73 346.68 257.40 352.24 257.88 359.88 curveto
122 | 258.65 365.41 254.74 369.85 252.83 374.69 curveto
123 | 246.11 389.27 244.47 406.51 250.39 421.64 curveto
124 | 345.50 258.37 moveto
125 | 335.94 256.62 328.19 247.74 328.10 237.97 curveto
126 | 327.62 230.20 331.87 222.43 338.59 218.53 curveto
127 | 344.33 215.04 351.71 214.50 357.90 217.08 curveto
128 | 364.55 219.79 369.63 225.98 370.94 233.05 curveto
129 | 372.35 240.08 369.93 247.71 364.72 252.64 curveto
130 | 359.76 257.57 352.34 259.72 345.50 258.37 curveto
131 | 188.44 257.36 moveto
132 | 178.22 255.44 170.37 245.34 171.23 234.93 curveto
133 | 171.54 224.10 181.22 214.68 192.03 214.52 curveto
134 | 201.97 213.95 211.57 221.25 213.82 230.92 curveto
135 | 215.96 239.01 212.79 248.12 206.15 253.19 curveto
136 | 201.24 257.12 194.59 258.60 188.44 257.36 curveto
137 | 216.22 189.15 moveto
138 | 218.50 175.45 224.64 162.25 234.41 152.28 curveto
139 | 242.82 143.52 254.01 137.31 266.06 135.51 curveto
140 | 280.14 133.17 294.95 137.16 306.34 145.66 curveto
141 | 320.30 155.93 329.36 172.13 332.02 189.15 curveto
142 | 293.42 189.17 254.82 189.17 216.22 189.15 curveto
143 | closepath
144 | 1.000 0.902 0.616 setrgbcolor
145 | fill
146 | %%EOF
147 | 


--------------------------------------------------------------------------------
/projects/ngx-float-ui-repo/src/assets/images/popper-icon.svg:
--------------------------------------------------------------------------------
 1 | <?xml version="1.0" encoding="UTF-8" ?>
 2 | <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
 3 | <svg width="512pt" height="512pt" viewBox="0 0 512 512" version="1.1" xmlns="http://www.w3.org/2000/svg">
 4 | <g id="#c83b50ff">
 5 | <path fill="#c83b50" opacity="1.00" d=" M 261.08 36.12 C 280.90 21.45 305.10 12.10 329.95 12.04 C 353.23 11.27 376.60 18.21 395.96 31.10 C 419.09 46.40 436.47 70.30 443.53 97.15 C 443.92 98.70 444.30 100.43 445.85 101.24 C 468.72 118.42 486.92 141.75 497.99 168.13 C 514.23 206.41 514.94 250.99 499.81 289.74 C 485.72 326.45 457.78 357.59 422.82 375.58 C 420.33 376.51 419.49 379.16 418.21 381.23 C 403.42 406.05 381.66 426.66 356.07 440.05 C 353.04 441.53 350.95 444.26 348.57 446.55 C 333.53 461.54 318.58 476.62 303.49 491.56 C 291.58 503.11 270.58 502.97 258.88 491.18 C 242.98 475.41 227.20 459.51 211.33 443.69 C 208.26 440.70 205.50 437.29 201.68 435.21 C 185.42 425.43 171.13 412.54 159.32 397.72 C 124.73 395.86 90.88 382.83 63.96 361.03 C 39.31 341.24 20.40 314.35 10.28 284.38 C -1.45 249.98 -1.53 211.73 10.13 177.29 C 25.38 131.25 61.77 92.83 106.92 75.11 C 109.90 74.29 111.37 71.40 113.30 69.25 C 127.44 52.51 148.18 41.49 169.99 39.20 C 194.35 36.31 219.53 44.61 237.78 60.91 C 244.20 51.52 252.15 43.18 261.08 36.12 M 250.39 90.36 C 244.47 105.49 246.11 122.73 252.83 137.31 C 254.74 142.15 258.65 146.59 257.88 152.12 C 257.40 159.76 248.73 165.32 241.56 162.66 C 236.81 161.33 234.21 156.85 232.30 152.67 C 225.33 138.91 221.11 123.53 221.61 108.03 C 221.63 99.98 223.64 92.17 225.59 84.44 C 212.56 69.51 191.89 61.73 172.24 64.24 C 155.05 66.16 138.92 75.77 129.07 89.99 C 120.11 100.37 113.40 113.99 115.19 128.03 C 116.31 134.53 111.50 141.28 104.98 142.31 C 98.76 143.59 92.05 139.30 90.65 133.09 C 89.15 126.04 89.71 118.74 90.73 111.66 C 74.54 122.50 60.41 136.46 49.76 152.80 C 34.02 176.67 25.83 205.41 26.61 233.99 C 27.24 265.99 39.20 297.60 59.88 322.02 C 81.12 347.49 111.55 365.10 144.24 370.74 C 140.08 360.98 137.17 350.58 136.58 339.96 C 136.16 332.82 142.90 326.35 150.03 327.16 C 156.14 327.39 161.34 332.81 161.64 338.86 C 162.68 351.64 167.87 363.65 174.41 374.54 C 184.99 392.23 201.14 406.07 218.93 416.19 C 246.26 431.58 279.19 436.51 309.88 430.17 C 345.17 422.96 377.10 400.59 395.71 369.73 C 401.17 359.31 406.13 348.50 408.90 337.02 C 410.06 332.38 409.58 326.92 413.23 323.28 C 418.03 317.67 427.75 317.96 432.20 323.87 C 435.75 327.81 434.97 333.42 434.44 338.26 C 453.61 322.44 468.81 301.71 477.26 278.29 C 487.49 250.52 488.23 219.43 479.62 191.14 C 470.78 161.82 451.72 135.80 426.60 118.31 C 423.33 116.17 421.12 112.71 420.50 108.85 C 416.12 86.99 403.07 67.10 385.00 54.08 C 369.19 42.61 349.56 36.42 330.00 37.14 C 296.24 37.53 263.33 59.02 250.39 90.36 Z" />
 6 | <path fill="#c83b50" opacity="1.00" d=" M 345.50 253.63 C 352.34 252.28 359.76 254.43 364.72 259.36 C 369.93 264.29 372.35 271.92 370.94 278.95 C 369.63 286.02 364.55 292.21 357.90 294.92 C 351.71 297.50 344.33 296.96 338.59 293.47 C 331.87 289.57 327.62 281.80 328.10 274.03 C 328.19 264.26 335.94 255.38 345.50 253.63 Z" />
 7 | <path fill="#c83b50" opacity="1.00" d=" M 188.44 254.64 C 194.59 253.40 201.24 254.88 206.15 258.81 C 212.79 263.88 215.96 272.99 213.82 281.08 C 211.57 290.75 201.97 298.05 192.03 297.48 C 181.22 297.32 171.54 287.90 171.23 277.07 C 170.37 266.66 178.22 256.56 188.44 254.64 Z" />
 8 | <path fill="#c83b50" opacity="1.00" d=" M 216.22 322.85 C 254.82 322.83 293.42 322.83 332.02 322.85 C 329.36 339.87 320.30 356.07 306.34 366.34 C 294.95 374.84 280.14 378.83 266.06 376.49 C 254.01 374.69 242.82 368.48 234.41 359.72 C 224.64 349.75 218.50 336.55 216.22 322.85 Z" />
 9 | </g>
10 | <g id="#ffe69dff">
11 | <path fill="#ffe69d" opacity="1.00" d=" M 250.39 90.36 C 263.33 59.02 296.24 37.53 330.00 37.14 C 349.56 36.42 369.19 42.61 385.00 54.08 C 403.07 67.10 416.12 86.99 420.50 108.85 C 421.12 112.71 423.33 116.17 426.60 118.31 C 451.72 135.80 470.78 161.82 479.62 191.14 C 488.23 219.43 487.49 250.52 477.26 278.29 C 468.81 301.71 453.61 322.44 434.44 338.26 C 434.97 333.42 435.75 327.81 432.20 323.87 C 427.75 317.96 418.03 317.67 413.23 323.28 C 409.58 326.92 410.06 332.38 408.90 337.02 C 406.13 348.50 401.17 359.31 395.71 369.73 C 377.10 400.59 345.17 422.96 309.88 430.17 C 279.19 436.51 246.26 431.58 218.93 416.19 C 201.14 406.07 184.99 392.23 174.41 374.54 C 167.87 363.65 162.68 351.64 161.64 338.86 C 161.34 332.81 156.14 327.39 150.03 327.16 C 142.90 326.35 136.16 332.82 136.58 339.96 C 137.17 350.58 140.08 360.98 144.24 370.74 C 111.55 365.10 81.12 347.49 59.88 322.02 C 39.20 297.60 27.24 265.99 26.61 233.99 C 25.83 205.41 34.02 176.67 49.76 152.80 C 60.41 136.46 74.54 122.50 90.73 111.66 C 89.71 118.74 89.15 126.04 90.65 133.09 C 92.05 139.30 98.76 143.59 104.98 142.31 C 111.50 141.28 116.31 134.53 115.19 128.03 C 113.40 113.99 120.11 100.37 129.07 89.99 C 138.92 75.77 155.05 66.16 172.24 64.24 C 191.89 61.73 212.56 69.51 225.59 84.44 C 223.64 92.17 221.63 99.98 221.61 108.03 C 221.11 123.53 225.33 138.91 232.30 152.67 C 234.21 156.85 236.81 161.33 241.56 162.66 C 248.73 165.32 257.40 159.76 257.88 152.12 C 258.65 146.59 254.74 142.15 252.83 137.31 C 246.11 122.73 244.47 105.49 250.39 90.36 M 345.50 253.63 C 335.94 255.38 328.19 264.26 328.10 274.03 C 327.62 281.80 331.87 289.57 338.59 293.47 C 344.33 296.96 351.71 297.50 357.90 294.92 C 364.55 292.21 369.63 286.02 370.94 278.95 C 372.35 271.92 369.93 264.29 364.72 259.36 C 359.76 254.43 352.34 252.28 345.50 253.63 M 188.44 254.64 C 178.22 256.56 170.37 266.66 171.23 277.07 C 171.54 287.90 181.22 297.32 192.03 297.48 C 201.97 298.05 211.57 290.75 213.82 281.08 C 215.96 272.99 212.79 263.88 206.15 258.81 C 201.24 254.88 194.59 253.40 188.44 254.64 M 216.22 322.85 C 218.50 336.55 224.64 349.75 234.41 359.72 C 242.82 368.48 254.01 374.69 266.06 376.49 C 280.14 378.83 294.95 374.84 306.34 366.34 C 320.30 356.07 329.36 339.87 332.02 322.85 C 293.42 322.83 254.82 322.83 216.22 322.85 Z" />
12 | </g>
13 | </svg>
14 | 


--------------------------------------------------------------------------------
/projects/ngx-float-ui-repo/src/assets/images/popper-logo.svg:
--------------------------------------------------------------------------------
 1 | <svg width="200" height="200" viewBox="0 0 200 200" fill="none" xmlns="http://www.w3.org/2000/svg">
 2 | <path fill-rule="evenodd" clip-rule="evenodd" d="M111.558 0.0145151C107.646 0.210413 103.858 1.33996 100.624 3.26768C98.6532 4.44098 98.2711 4.70982 97.0791 5.73933C95.8808 6.78134 94.0906 8.74449 93.4427 9.73857L93.2392 10.0428L93.0169 9.86153C92.8923 9.75942 92.4957 9.44889 92.1281 9.1738C87.1335 5.3392 80.3716 4.44098 74.5318 6.83344C71.7241 7.97757 69.1759 9.8907 67.3297 12.2311C66.8894 12.7896 66.8894 12.7896 66.0504 13.1293C59.7786 15.701 54.2586 20.2441 50.4748 25.9627C47.2205 30.8685 45.3369 36.3453 44.8322 42.3598C44.6723 44.2 44.745 47.3031 44.9839 49.2808C45.9433 57.3377 49.8123 64.911 55.7663 70.3962C58.3726 72.8011 60.8191 74.4892 63.9217 76.0189C67.8198 77.9382 71.5953 79.0032 76.0042 79.4242C77.0156 79.5179 77.1444 79.5471 77.2607 79.693C78.4444 81.1643 80.4422 83.2213 81.7485 84.3154C82.7744 85.1782 84.3631 86.3369 85.3288 86.9246L86.2177 87.4685L92.07 93.3079C98.0967 99.3287 98.35 99.5537 99.3593 100.004C99.5919 100.106 100.053 100.279 100.4 100.381C100.963 100.554 101.129 100.577 102.175 100.569C103.129 100.569 103.432 100.548 103.887 100.417C104.543 100.235 105.365 99.8663 105.943 99.4891C106.202 99.3162 108.368 97.2134 111.774 93.8143L117.188 88.4105L118.306 87.7936C121.524 86.018 124.449 83.6131 127.111 80.5475C128.216 79.2804 129.782 77.063 130.511 75.7292C130.799 75.1998 130.814 75.1853 131.499 74.8164C134.589 73.1575 137.015 71.3382 139.534 68.8165C146.605 61.6995 150.078 51.8963 149.083 41.8242C148.31 33.9841 144.809 26.6796 139.193 21.2007C138.176 20.2087 136.957 19.1438 136.053 18.4623L135.657 18.158L135.42 17.3098C134.539 14.1359 132.82 10.8973 130.685 8.39021C126.758 3.7741 121.425 0.889806 115.456 0.158313C114.561 0.049944 112.445 -0.0292494 111.558 0.0145151Z" fill="#FFE69D"/>
 3 | <path d="M111.558 0.0145151C107.646 0.210413 103.858 1.33996 100.624 3.26768C98.6532 4.44098 98.2711 4.70982 97.0791 5.73933C95.8808 6.78134 94.0906 8.74449 93.4427 9.73857L93.2392 10.0428L93.0169 9.86153C92.8923 9.75942 92.4957 9.44889 92.1281 9.1738C87.1335 5.3392 80.3716 4.44098 74.5318 6.83344C71.7241 7.97757 69.1759 9.8907 67.3297 12.2311C66.8894 12.7896 66.8894 12.7896 66.0504 13.1293C59.7786 15.701 54.2586 20.2441 50.4748 25.9627C47.2205 30.8685 45.3369 36.3453 44.8322 42.3598C44.6723 44.2 44.745 47.3031 44.9839 49.2808C45.9433 57.3377 49.8123 64.911 55.7663 70.3962C58.3726 72.8011 60.8191 74.4892 63.9217 76.0189C67.8198 77.9382 71.5953 79.0032 76.0042 79.4242C77.0156 79.5179 77.1444 79.5471 77.2607 79.693C78.4444 81.1643 80.4422 83.2213 81.7485 84.3154C82.7744 85.1782 84.3631 86.3369 85.3288 86.9246L86.2177 87.4685L92.07 93.3079C98.0967 99.3287 98.35 99.5537 99.3593 100.004C99.5919 100.106 100.053 100.279 100.4 100.381C100.963 100.554 101.129 100.577 102.175 100.569C103.129 100.569 103.432 100.548 103.887 100.417C104.543 100.235 105.365 99.8663 105.943 99.4891C106.202 99.3162 108.368 97.2134 111.774 93.8143L117.188 88.4105L118.306 87.7936C121.524 86.018 124.449 83.6131 127.111 80.5475C128.216 79.2804 129.782 77.063 130.511 75.7292C130.799 75.1998 130.814 75.1853 131.499 74.8164C134.589 73.1575 137.015 71.3382 139.534 68.8165C146.605 61.6995 150.078 51.8963 149.083 41.8242C148.31 33.9841 144.809 26.6796 139.193 21.2007C138.176 20.2087 136.957 19.1438 136.053 18.4623L135.657 18.158L135.42 17.3098C134.539 14.1359 132.82 10.8973 130.685 8.39021C126.758 3.7741 121.425 0.889806 115.456 0.158313C114.561 0.049944 112.445 -0.0292494 111.558 0.0145151ZM115.168 5.36212C118.32 5.83311 121.171 7.00016 123.618 8.84036C127.277 11.5788 129.667 15.2967 130.729 19.8982C130.994 21.0632 131.196 21.3466 132.452 22.274C135.636 24.6435 138.255 27.5341 140.167 30.7955C140.645 31.6062 141.511 33.3464 141.893 34.2446C143.056 37.0122 143.756 39.9694 144.007 43.1934C144.101 44.3813 144.059 47.0989 143.928 48.193C143.17 54.6868 140.508 60.3387 136.062 64.9256C135.167 65.8447 133.622 67.2576 133.572 67.1993C133.557 67.1847 133.586 66.8742 133.63 66.5053C133.752 65.4112 133.528 64.6714 132.878 64.0628C132.461 63.671 132.091 63.4835 131.551 63.3813C130.432 63.1709 129.283 63.7877 128.808 64.8443C128.714 65.0631 128.592 65.5696 128.519 66.0406C128.201 68.3017 126.577 72.3739 125.142 74.533C123.092 77.6131 120.565 80.1494 117.512 82.1918C114.034 84.5175 110.339 85.9034 105.928 86.5328C104.832 86.6849 101.561 86.7495 100.327 86.6411C94.1862 86.0847 88.7139 83.6777 84.2115 79.5409C81.3602 76.9317 79.0654 73.3367 78.1184 70.0252C77.8525 69.0916 77.7715 68.6998 77.6345 67.6494C77.5057 66.6345 77.2607 66.0697 76.7539 65.6196C76.2929 65.2153 75.8526 65.034 75.2462 64.9902C73.9753 64.8964 72.8933 65.6779 72.5755 66.9179C72.4821 67.3097 72.4758 67.4827 72.5464 68.1788C72.7126 69.8022 73.1529 71.5987 73.7738 73.1846C73.9337 73.5847 74.0479 73.9182 74.0417 73.9244C74.0334 73.9328 73.7302 73.8807 73.3771 73.8077C64.3329 71.9467 56.813 66.0843 52.8153 57.7941C51.7831 55.6496 51.1248 53.7657 50.6201 51.5274C49.046 44.548 50.1072 37.0997 53.5567 30.8747C54.2731 29.5847 55.4133 27.8821 56.3499 26.7088C57.3467 25.4542 59.5273 23.266 60.7817 22.2677C61.7702 21.4695 63.0059 20.5859 63.0557 20.6359C63.0702 20.6505 63.0349 21.1153 62.9685 21.6717C62.8688 22.5199 62.8688 22.8617 62.9332 23.737C62.9768 24.3184 63.064 24.9561 63.1284 25.1499C63.3942 25.9627 64.0962 26.6004 64.9622 26.8255C66.0878 27.1068 67.3297 26.5212 67.8551 25.4396C68.0295 25.0937 68.0358 25.0207 68.0358 23.5557C68.0441 22.3615 68.0731 21.9051 68.1728 21.4195C68.5342 19.7231 69.3711 18.0497 70.6774 16.42C70.9162 16.1219 71.2838 15.6447 71.4935 15.3675C71.7033 15.0862 72.1872 14.5652 72.561 14.2088C75.9253 11.014 80.6167 9.91988 85.063 11.2808C87.0982 11.9039 89.1542 13.1939 90.4979 14.6798L90.7928 15.007L90.6204 15.5863C90.2009 16.9847 89.9475 18.7311 89.9413 20.2587C89.9413 23.2305 90.664 26.0648 92.207 29.1658C92.9297 30.608 93.6441 31.1498 94.8133 31.1582C95.2889 31.1582 95.4634 31.129 95.8102 30.9685C96.5807 30.608 97.0064 30.1287 97.239 29.3617C97.4986 28.5198 97.4321 28.1718 96.7032 26.6504C95.4405 24.0204 95.0085 22.1864 95.0875 19.8982C95.1809 17.5349 95.8517 15.5488 97.2951 13.3981C99.1226 10.6868 101.575 8.53609 104.485 7.10853C105.083 6.81885 105.893 6.45623 106.289 6.31035C107.581 5.82477 109.429 5.41214 110.908 5.26001C111.797 5.17248 114.287 5.23083 115.168 5.36212Z" fill="#C83B50"/>
 4 | <path fill-rule="evenodd" clip-rule="evenodd" d="M115.072 49.8954C114.279 50.1058 113.722 50.4393 113.103 51.0562C112.194 51.9544 111.803 52.9109 111.803 54.2072C111.797 55.7515 112.526 57.0853 113.832 57.9314C114.48 58.3523 115.043 58.5274 115.903 58.5691C116.841 58.6212 117.375 58.5191 118.148 58.1502C118.856 57.8084 119.655 57.0623 120.017 56.4184C120.999 54.6636 120.71 52.4608 119.331 51.0708C118.494 50.2371 117.556 49.8308 116.357 49.7807C115.759 49.7578 115.491 49.7807 115.072 49.8954Z" fill="#C83B50"/>
 5 | <path fill-rule="evenodd" clip-rule="evenodd" d="M82.9551 50.0707C81.7568 50.3666 80.6021 51.3086 80.0684 52.4319C79.7216 53.1634 79.6198 53.6135 79.6198 54.4117C79.6198 55.5913 80.0455 56.627 80.8762 57.469C81.4826 58.0838 82.1244 58.461 82.9031 58.6652C84.442 59.0632 86.0141 58.6277 87.1335 57.5127C88.2445 56.3957 88.6703 54.8098 88.2819 53.2738C88.0784 52.4694 87.7461 51.9025 87.1272 51.2669C86.6932 50.823 86.4627 50.65 85.9726 50.4187C85.632 50.2582 85.1855 50.0915 84.9757 50.0478C84.4711 49.9477 83.4389 49.954 82.9551 50.0707Z" fill="#C83B50"/>
 6 | <path fill-rule="evenodd" clip-rule="evenodd" d="M88.8593 64.1538C88.8593 64.3789 89.2061 65.7335 89.4428 66.4525C90.8799 70.6977 94.1487 73.8946 98.0821 74.8866C99.758 75.3075 101.627 75.3075 103.33 74.8866C107.033 73.9592 110.214 71.0103 111.716 67.1048C112.1 66.1191 112.526 64.5894 112.532 64.183C112.532 64.1184 110.115 64.0976 100.695 64.0976C94.1861 64.0976 88.8593 64.1267 88.8593 64.1538Z" fill="#C83B50"/>
 7 | <path fill-rule="evenodd" clip-rule="evenodd" d="M80.7537 110.806C76.891 111.306 73.4934 113.444 71.371 116.704C70.9806 117.306 70.2745 118.683 70.1083 119.161C70.0502 119.327 69.9982 119.377 69.9339 119.336C69.884 119.307 69.6161 119.125 69.3358 118.944C68.2662 118.233 67.0472 117.727 65.6828 117.414C65.0265 117.27 64.7524 117.248 63.4897 117.256C62.306 117.256 61.9218 117.285 61.359 117.414C57.0373 118.371 53.8453 121.691 53.052 126.053C52.8942 126.928 52.9295 129.11 53.1164 129.964C53.2036 130.341 54.0052 132.901 54.9003 135.645C55.7871 138.392 56.5098 140.659 56.4869 140.689C56.4745 140.718 56.0612 140.812 55.5711 140.899C52.4601 141.479 50.996 142.327 50.1653 144.059C49.5527 145.342 49.4945 146.197 49.9057 148.268C50.049 148.994 50.3813 150.769 50.6409 152.217C51.8911 159.168 52.8422 164.246 53.1039 165.291C53.378 166.42 53.8827 167.37 54.6179 168.146L55.218 168.783L55.11 169.138C54.9356 169.688 54.9003 170.782 55.0291 171.341C55.297 172.464 58.4225 182.196 58.6758 182.682C59.1867 183.651 60.2188 184.47 61.3091 184.753C62.1108 184.97 62.767 184.926 66.0358 184.464C67.6889 184.224 69.3856 183.984 69.8051 183.934L70.5631 183.84L72.1643 188.767C73.0531 191.478 73.9898 194.398 74.2494 195.253C74.511 196.107 74.8059 197.057 74.9077 197.353C75.348 198.629 75.9024 199.427 76.6252 199.804L76.9865 200H102.464C127.4 200 127.95 200 128.303 199.86C128.498 199.781 128.816 199.571 129.003 199.398C129.609 198.833 129.962 198.058 130.569 196.013C130.93 194.796 134.502 183.747 134.554 183.695C134.595 183.659 137.569 184.107 140.01 184.522C142.377 184.92 143.127 184.97 143.885 184.774C145.293 184.414 146.526 183.217 146.917 181.848C147.046 181.392 148.605 171.349 148.663 170.58C148.684 170.296 148.678 169.892 148.643 169.673L148.584 169.275L148.908 169.015C150.165 168.014 151.11 166.572 151.506 165.057C151.947 163.348 151.529 161.312 150.489 160.124L150.265 159.87L150.468 159.718C151.27 159.13 152.337 158.001 153.002 157.05C154.667 154.66 155.189 151.313 154.358 148.406C154.113 147.537 153.346 146.015 152.769 145.232C151.781 143.9 150.404 142.654 149.016 141.841C148.599 141.595 148.273 141.378 148.287 141.349C148.375 141.203 151.76 130.698 151.868 130.219C152.605 127.103 151.818 123.704 149.768 121.161C148.229 119.248 146.144 117.973 143.619 117.423C142.579 117.189 140.479 117.189 139.432 117.414C138.082 117.712 136.674 118.298 135.671 118.973L135.173 119.307L134.61 118.169C133.788 116.516 132.863 115.291 131.551 114.111C127.661 110.618 121.894 109.799 117.151 112.075C115.678 112.777 114.553 113.582 113.377 114.77C112.748 115.407 111.701 116.756 111.5 117.189C111.456 117.285 111.407 117.356 111.377 117.356C111.348 117.356 111.147 117.118 110.931 116.829C109.803 115.328 108.109 114.053 106.362 113.378C102.42 111.865 98.0468 112.769 95.0812 115.705C94.7406 116.039 94.3149 116.51 94.1197 116.762L93.7729 117.218L93.6649 117.016C93.4427 116.589 92.6701 115.574 92.0637 114.916C89.2186 111.821 84.9405 110.27 80.7537 110.806Z" fill="white"/>
 8 | <path d="M80.7537 110.806C76.891 111.306 73.4934 113.444 71.371 116.704C70.9806 117.306 70.2745 118.683 70.1083 119.161C70.0502 119.327 69.9982 119.377 69.9339 119.336C69.884 119.307 69.6161 119.125 69.3358 118.944C68.2662 118.233 67.0472 117.727 65.6828 117.414C65.0265 117.27 64.7524 117.248 63.4897 117.256C62.306 117.256 61.9218 117.285 61.359 117.414C57.0373 118.371 53.8453 121.691 53.052 126.053C52.8942 126.928 52.9295 129.11 53.1164 129.964C53.2036 130.341 54.0052 132.901 54.9003 135.645C55.7871 138.392 56.5098 140.659 56.4869 140.689C56.4745 140.718 56.0612 140.812 55.5711 140.899C52.4601 141.479 50.996 142.327 50.1653 144.059C49.5527 145.342 49.4945 146.197 49.9057 148.268C50.049 148.994 50.3813 150.769 50.6409 152.217C51.8911 159.168 52.8422 164.246 53.1039 165.291C53.378 166.42 53.8827 167.37 54.6179 168.146L55.218 168.783L55.11 169.138C54.9356 169.688 54.9003 170.782 55.0291 171.341C55.297 172.464 58.4225 182.196 58.6758 182.682C59.1867 183.651 60.2188 184.47 61.3091 184.753C62.1108 184.97 62.767 184.926 66.0358 184.464C67.6889 184.224 69.3856 183.984 69.8051 183.934L70.5631 183.84L72.1643 188.767C73.0531 191.478 73.9898 194.398 74.2494 195.253C74.511 196.107 74.8059 197.057 74.9077 197.353C75.348 198.629 75.9024 199.427 76.6252 199.804L76.9865 200H102.464C127.4 200 127.95 200 128.303 199.86C128.498 199.781 128.816 199.571 129.003 199.398C129.609 198.833 129.962 198.058 130.569 196.013C130.93 194.796 134.502 183.747 134.554 183.695C134.595 183.659 137.569 184.107 140.01 184.522C142.377 184.92 143.127 184.97 143.885 184.774C145.293 184.414 146.526 183.217 146.917 181.848C147.046 181.392 148.605 171.349 148.663 170.58C148.684 170.296 148.678 169.892 148.643 169.673L148.584 169.275L148.908 169.015C150.165 168.014 151.11 166.572 151.506 165.057C151.947 163.348 151.529 161.312 150.489 160.124L150.265 159.87L150.468 159.718C151.27 159.13 152.337 158.001 153.002 157.05C154.667 154.66 155.189 151.313 154.358 148.406C154.113 147.537 153.346 146.015 152.769 145.232C151.781 143.9 150.404 142.654 149.016 141.841C148.599 141.595 148.273 141.378 148.287 141.349C148.375 141.203 151.76 130.698 151.868 130.219C152.605 127.103 151.818 123.704 149.768 121.161C148.229 119.248 146.144 117.973 143.619 117.423C142.579 117.189 140.479 117.189 139.432 117.414C138.082 117.712 136.674 118.298 135.671 118.973L135.173 119.307L134.61 118.169C133.788 116.516 132.863 115.291 131.551 114.111C127.661 110.618 121.894 109.799 117.151 112.075C115.678 112.777 114.553 113.582 113.377 114.77C112.748 115.407 111.701 116.756 111.5 117.189C111.456 117.285 111.407 117.356 111.377 117.356C111.348 117.356 111.147 117.118 110.931 116.829C109.803 115.328 108.109 114.053 106.362 113.378C102.42 111.865 98.0468 112.769 95.0812 115.705C94.7406 116.039 94.3149 116.51 94.1197 116.762L93.7729 117.218L93.6649 117.016C93.4427 116.589 92.6701 115.574 92.0637 114.916C89.2186 111.821 84.9405 110.27 80.7537 110.806ZM83.7484 116.016C86.8801 116.56 89.4948 119.002 90.1946 122.024C90.2881 122.428 91.8892 135.624 91.8892 135.993C91.8892 136.095 91.8332 136.125 91.6151 136.125C91.1188 136.125 89.6588 136.341 89.1625 136.494C88.4398 136.719 87.8043 137.102 87.2124 137.675C86.606 138.263 86.2322 138.834 85.9726 139.58L85.7836 140.109L85.2852 139.74C83.9581 138.769 82.2988 138.044 80.6374 137.711C80.0746 137.602 79.5409 137.552 78.6458 137.538L77.4185 137.523L75.9544 131.406L74.4819 125.292L74.4736 123.987C74.4591 122.82 74.4819 122.61 74.6336 122.03C75.377 119.198 77.4558 117.031 80.1972 116.226C80.5377 116.124 80.9926 116.016 81.2085 115.987C81.8648 115.887 83.0984 115.899 83.7484 116.016ZM124.606 116.197C127.495 116.85 129.804 119.132 130.583 122.103C130.735 122.674 130.756 122.914 130.756 124.023L130.749 125.292L129.35 131.161C128.583 134.385 127.942 137.044 127.927 137.058C127.913 137.081 127.314 137.037 126.585 136.973C124.326 136.762 123.3 136.827 122.226 137.263C121.416 137.588 120.55 138.24 120.052 138.898L119.9 139.109L119.556 138.819C118.183 137.667 116.378 136.812 114.302 136.335C113.789 136.212 113.355 136.102 113.34 136.095C113.319 136.066 114.798 123.493 114.914 122.704C115.404 119.4 118.168 116.639 121.533 116.089C122.363 115.951 123.755 116.001 124.606 116.197ZM110.476 139.966C111.94 140.036 112.59 140.124 113.651 140.399C115.051 140.747 116.09 141.276 117.151 142.168C119.346 144.009 119.894 147.385 118.494 150.371C117.614 152.247 116.177 153.689 114.191 154.704C112.929 155.341 111.811 155.696 110.208 155.942C109.876 155.994 109.89 155.935 109.797 157.986C109.71 159.899 109.602 160.189 108.908 160.552C108.549 160.739 106.981 160.754 106.412 160.581C105.992 160.449 105.581 160.131 105.409 159.791C105.156 159.297 105.22 157.899 106.001 147.355C106.138 145.501 106.304 143.219 106.362 142.283C106.426 141.349 106.514 140.487 106.555 140.378C106.657 140.109 106.917 139.943 107.328 139.878C107.654 139.828 108.042 139.84 110.476 139.966ZM96.834 140.326C98.6968 140.624 100.184 141.335 101.309 142.464C102.053 143.21 102.566 144.138 102.904 145.369C103.056 145.936 103.12 147.616 103.012 148.268C102.811 149.444 102.342 150.638 101.685 151.653C100.342 153.724 97.997 155.312 95.2183 156.015C94.8486 156.108 94.5309 156.196 94.5163 156.21C94.5018 156.225 94.5246 157.015 94.5683 157.963C94.6472 159.972 94.6181 160.139 94.1716 160.587C93.7729 160.993 93.4489 161.073 92.2506 161.081C91.3784 161.087 91.2475 161.073 90.9734 160.929C90.5767 160.71 90.2735 160.326 90.1718 159.914C90.0493 159.384 90.0202 158.355 89.9413 152.536C89.906 149.587 89.854 145.77 89.825 144.052L89.7834 140.928L89.9766 140.703C90.0929 140.566 90.2881 140.443 90.4688 140.393C90.8218 140.291 94.2713 140.132 95.2827 140.168C95.6585 140.182 96.3584 140.255 96.834 140.326ZM126.174 141.051C128.72 141.291 133.939 141.899 134.525 142.031C134.957 142.125 135.167 142.958 135.044 144.059C134.878 145.544 134.33 146.609 133.767 146.522C133.659 146.507 133.283 146.451 132.922 146.407C132.569 146.363 131.767 146.232 131.154 146.118C128.498 145.624 127.04 145.369 127.003 145.407C126.988 145.428 126.822 146.384 126.635 147.531C126.405 148.985 126.326 149.637 126.382 149.667C126.426 149.696 127.559 149.856 128.895 150.029C130.236 150.204 131.42 150.386 131.528 150.442C131.825 150.594 131.968 150.942 132.006 151.58C132.056 152.463 131.802 153.516 131.377 154.131C131.196 154.399 131.154 154.42 130.814 154.443C130.452 154.464 128.209 154.11 126.585 153.776C125.985 153.66 125.719 153.63 125.705 153.689C125.624 153.935 125.236 157.196 125.236 157.588C125.236 157.784 125.242 157.79 125.653 157.79C127.017 157.79 131.831 158.378 132.49 158.624C132.648 158.682 132.82 158.805 132.878 158.893C133.015 159.116 132.994 159.674 132.814 160.581C132.56 161.848 132.222 162.652 131.831 162.906C131.601 163.059 131.248 163.021 129.674 162.681C128.058 162.333 126.44 162.102 124.687 161.956C123.892 161.892 122.982 161.812 122.658 161.775C121.576 161.652 120.876 161.152 120.638 160.326C120.436 159.616 120.53 158.574 121.367 152.486C121.626 150.632 121.958 148.362 122.096 147.449C122.449 145.203 123.128 141.727 123.259 141.479C123.408 141.174 123.915 140.949 124.478 140.914C124.565 140.914 125.321 140.972 126.174 141.051ZM80.0019 141.777C83.4743 142.543 86.3319 145.799 87.1626 149.935C87.7254 152.697 87.4658 155.283 86.4046 157.544C84.9321 160.689 82.4068 162.435 79.3312 162.427C77.188 162.421 75.3334 161.558 73.6159 159.753C72.0418 158.109 71.0968 156.175 70.6192 153.624C70.4676 152.791 70.4178 150.857 70.5195 149.994C71.0159 145.943 73.564 142.639 76.7913 141.849C77.0945 141.777 77.4122 141.697 77.4912 141.683C77.9169 141.587 79.4038 141.645 80.0019 141.777ZM142.558 143.833C144.715 144.377 145.191 144.544 146.31 145.117C147.797 145.878 148.83 146.782 149.646 148.037C150.582 149.5 150.85 151.146 150.424 152.82C149.963 154.631 148.555 156.254 146.585 157.255C145.891 157.603 144.232 158.182 143.698 158.261C143.503 158.29 143.351 158.326 143.351 158.334C143.351 158.37 143.812 159.174 144.016 159.493C144.585 160.399 145.876 161.754 146.742 162.356C146.996 162.535 147.284 162.798 147.378 162.936C147.529 163.159 147.544 163.246 147.515 163.673C147.436 164.899 146.232 166.195 145.177 166.195C144.57 166.195 143.625 165.624 142.637 164.653C141.771 163.805 141.013 162.681 139.981 160.704C139.721 160.21 139.497 159.82 139.482 159.835C139.476 159.849 139.287 160.581 139.071 161.464C138.639 163.275 138.529 163.492 137.981 163.769C137.549 163.986 137.295 163.992 136.408 163.811C135.578 163.644 135.079 163.398 134.733 163C134.141 162.304 134.207 161.921 136.053 155.225C136.61 153.232 137.196 151.073 137.36 150.436C138.01 147.92 139.036 144.117 139.135 143.819C139.202 143.652 139.316 143.465 139.403 143.4C139.677 143.204 140.529 143.319 142.558 143.833ZM62.306 144.494C63.1429 144.638 63.7202 144.834 64.5925 145.269C66.1812 146.059 67.2715 147.493 67.7969 149.485C68.015 150.29 68.0295 152.109 67.826 152.972C67.5228 154.297 67.041 155.385 66.2829 156.442C65.7264 157.211 64.4346 158.449 63.5541 159.036C62.8895 159.487 61.6767 160.131 61.1513 160.312C60.9623 160.376 60.927 160.42 60.9623 160.558C61.1721 161.508 61.6476 163.898 61.6476 164.036C61.6476 164.24 61.3964 164.797 61.2302 164.986C60.9125 165.341 59.735 165.703 58.869 165.718C58.4079 165.724 58.2356 165.695 58.003 165.566C57.4111 165.253 57.2242 164.87 56.9272 163.436C56.7195 162.398 55.4423 155.508 54.7923 151.884C54.5472 150.529 54.2212 148.754 54.0634 147.935C53.9118 147.124 53.7809 146.349 53.7809 146.218C53.7809 145.87 54.0696 145.58 54.5971 145.407C55.1163 145.232 57.924 144.632 58.869 144.494C59.7869 144.363 61.5687 144.363 62.306 144.494ZM104.578 165.399H106.397V169.079C106.397 173.204 106.377 173.022 106.931 173.47C107.141 173.637 107.284 173.695 107.61 173.716C108.15 173.754 108.555 173.564 108.829 173.137L109.031 172.833L109.054 169.188L109.074 165.543H109.596C110.258 165.543 112.864 165.674 113.456 165.732L113.903 165.776V175.079L114.083 175.442C114.302 175.869 114.655 176.13 115.087 176.173C115.664 176.238 116.177 175.971 116.43 175.463C116.567 175.196 116.573 175.021 116.573 170.58V165.978H116.885C117.165 165.978 117.988 166.058 120.197 166.276L121.043 166.362L121.063 169.602L121.084 172.833L121.288 173.137C121.85 174 123.163 173.906 123.583 172.979C123.705 172.703 123.72 172.455 123.72 169.659V166.645L123.994 166.681C124.139 166.704 125.055 166.818 126.029 166.941L127.798 167.175L127.869 175.144L128.064 175.471C128.583 176.363 129.863 176.363 130.359 175.471L130.54 175.144L130.577 171.37L130.612 167.602L132.504 167.906C133.534 168.073 134.51 168.239 134.668 168.275L134.942 168.342L134.98 170.653C135.015 172.885 135.021 172.979 135.173 173.224C135.628 173.956 136.805 174.023 137.324 173.341C137.598 172.979 137.642 172.58 137.648 170.659V168.854L137.981 168.906C138.502 168.971 144.267 170.232 144.348 170.296C144.369 170.311 142.882 180.131 142.809 180.441C142.774 180.594 142.759 180.587 140.703 180.239C131.044 178.607 121.005 177.638 110.692 177.347C107.083 177.247 97.5484 177.305 94.2007 177.457C84.1596 177.905 74.3303 178.841 64.607 180.283C63.4378 180.456 62.4721 180.587 62.4576 180.579C62.3911 180.521 59.2594 170.457 59.2947 170.419C59.3611 170.355 64.0234 169.275 65.8489 168.906L66.0441 168.869L66.0877 172.753L66.2829 173.093C66.7087 173.812 67.7034 173.956 68.3182 173.385C68.7065 173.014 68.7211 172.914 68.7211 170.544C68.7211 168.848 68.7439 168.354 68.8145 168.333C68.9952 168.26 72.6544 167.66 72.7126 167.696C72.7416 167.71 72.7645 169.398 72.7645 171.449C72.7645 173.912 72.7915 175.24 72.8434 175.377C73.0095 175.819 73.564 176.196 74.0624 176.196C74.374 176.196 74.835 175.986 75.051 175.754C75.3978 175.369 75.3978 175.377 75.4186 171.174C75.4414 167.5 75.4476 167.21 75.5639 167.21C75.6283 167.204 76.5898 167.081 77.6864 166.935L79.6842 166.66L79.707 169.702L79.7278 172.753L79.923 173.093C80.4651 174.014 81.9084 173.906 82.2843 172.914C82.3341 172.783 82.3632 171.609 82.3632 169.559C82.3632 167.102 82.384 166.399 82.4567 166.376C82.5003 166.362 83.2292 166.283 84.0599 166.203C84.8968 166.116 85.7483 166.037 85.9581 166.014L86.3319 165.978V170.449C86.3319 173.479 86.3609 175.021 86.4129 175.217C86.5271 175.652 87.0255 176.1 87.4512 176.167C88.0639 176.253 88.5914 175.992 88.8593 175.463C88.9963 175.196 89.0026 175.021 89.0026 170.515C89.0026 167.941 89.0254 165.826 89.0607 165.812C89.0898 165.791 89.7606 165.739 90.5539 165.695C91.3493 165.653 92.2651 165.601 92.5974 165.58L93.1893 165.543V169.109C93.1893 172.595 93.1893 172.681 93.3409 172.993C93.5714 173.456 93.9618 173.695 94.5246 173.695C95.0376 173.695 95.3553 173.522 95.6502 173.093L95.8226 172.833L95.8455 169.159L95.8662 165.486L96.0261 165.443C96.1113 165.42 96.942 165.399 97.8599 165.399H99.54L99.5545 170.384L99.5774 175.377L99.785 175.644C100.377 176.428 101.519 176.334 102.03 175.463C102.167 175.225 102.175 175.065 102.196 170.261L102.219 165.305L102.485 165.355C102.63 165.376 103.575 165.399 104.578 165.399ZM114.171 181.752C115.774 181.819 117.116 181.898 117.159 181.927C117.223 181.963 116.929 183.311 116.142 186.608C115.541 189.151 114.935 191.754 114.798 192.383C114.517 193.731 114.293 194.448 114.142 194.507C113.789 194.644 107.724 193.585 106.817 193.231C106.622 193.158 106.613 193.137 106.613 192.608C106.613 192.31 106.678 191.645 106.759 191.137C106.902 190.282 107.913 181.934 107.913 181.667C107.913 181.55 108.042 181.544 109.596 181.588C110.511 181.608 112.576 181.688 114.171 181.752ZM97.3324 181.898C97.3532 182.05 97.5775 183.832 97.8163 185.868C98.2711 189.651 98.3999 191.564 98.2773 192.681C98.2337 193.087 98.2046 193.166 98.0676 193.225C97.9824 193.252 96.9918 193.419 95.8808 193.579C94.7635 193.746 93.4987 193.942 93.0668 194.021C91.586 194.296 90.8571 194.39 90.8073 194.311C90.7782 194.267 90.6557 193.658 90.5269 192.948C90.3961 192.245 89.7834 189.522 89.1625 186.906C88.5478 184.282 88.0576 182.123 88.0784 182.1C88.1449 182.029 94.7199 181.681 96.7405 181.644L97.2888 181.629L97.3324 181.898Z" fill="#C83B50"/>
 9 | <path fill-rule="evenodd" clip-rule="evenodd" d="M110.339 144.754C110.325 144.892 110.266 146.138 110.223 147.536C110.179 148.926 110.129 150.31 110.1 150.594L110.057 151.123H110.316C111.06 151.123 112.223 150.775 112.958 150.333C114.445 149.435 115.116 147.928 114.617 146.594C114.401 146.007 113.809 145.392 113.153 145.073C112.482 144.746 111.934 144.608 111.074 144.55L110.374 144.506L110.339 144.754Z" fill="#C83B50"/>
10 | <path fill-rule="evenodd" clip-rule="evenodd" d="M94.2214 144.726C94.0054 144.755 93.9826 144.776 93.9826 145.008C93.9826 145.262 94.157 148.965 94.2422 150.53L94.2858 151.349L94.5537 151.299C96.6616 150.943 98.3064 149.632 98.6096 148.067C98.892 146.616 97.9388 145.306 96.2857 144.849C95.8807 144.741 94.6264 144.662 94.2214 144.726Z" fill="#C83B50"/>
11 | <path fill-rule="evenodd" clip-rule="evenodd" d="M77.7653 145.727C76.2056 146.146 74.9866 147.805 74.6045 150.031C74.2867 151.827 74.5962 153.849 75.4414 155.472C76.9927 158.45 79.7943 159.328 81.7069 157.429C83.3953 155.756 83.9498 152.64 83.0423 149.864C82.1036 146.98 79.8005 145.175 77.7653 145.727Z" fill="#C83B50"/>
12 | <path fill-rule="evenodd" clip-rule="evenodd" d="M142.088 148.601C142.066 148.695 141.771 150.008 141.438 151.521C141.1 153.036 140.803 154.326 140.782 154.39C140.759 154.478 140.803 154.528 140.934 154.557C141.287 154.645 142.601 154.609 143.091 154.499C144.296 154.217 145.307 153.492 145.748 152.586C145.957 152.167 145.986 152.035 145.986 151.521C145.986 151.035 145.949 150.877 145.783 150.529C145.307 149.551 143.987 148.753 142.398 148.478C142.161 148.442 142.124 148.457 142.088 148.601Z" fill="#C83B50"/>
13 | <path fill-rule="evenodd" clip-rule="evenodd" d="M59.9883 148.923C59.8512 148.938 59.4546 149.011 59.1015 149.075C58.5948 149.169 58.4806 149.221 58.5097 149.307C58.545 149.423 59.5044 153.823 59.7433 154.958C59.8159 155.292 59.9094 155.575 59.9592 155.596C60.1046 155.648 61.1368 155.198 61.6559 154.858C62.335 154.402 62.9539 153.712 63.2862 153.033C63.5541 152.489 63.5603 152.46 63.5603 151.676C63.5603 150.967 63.5395 150.83 63.3817 150.511C63.0349 149.8 62.254 149.213 61.4254 149.031C61.0142 148.946 60.3061 148.894 59.9883 148.923Z" fill="#C83B50"/>
14 | <path fill-rule="evenodd" clip-rule="evenodd" d="M91.9809 102.679C91.9905 102.684 93.1375 103.372 93.1471 103.377C94.3362 104.103 94.6041 105.735 93.8928 106.942C93.1872 108.139 91.5674 108.341 90.3681 107.655C90.3509 107.651 89.4043 107.083 89.3899 107.074C88.1828 106.358 87.7812 104.788 88.4953 103.576C89.2122 102.36 90.7738 101.962 91.9809 102.679Z" fill="#F3909F"/>
15 | <path fill-rule="evenodd" clip-rule="evenodd" d="M71.6098 87.0488C71.6198 84.513 74.9443 83.7477 76.1853 85.5483C76.9629 86.6687 77.1572 88.7044 79.9135 92.5157C80.9053 93.8911 81.8025 95.2215 83.208 96.4919C84.175 97.3672 85.426 98.2025 86.9412 99.0578C89.2489 100.358 87.8384 104.575 84.7731 103.584C83.5171 103.184 82.1763 102.319 80.9801 101.339C79.435 100.078 78.169 98.7126 76.9678 97.2121C74.7499 94.4412 71.5998 88.8944 71.6098 87.0488Z" fill="#F3909F"/>
16 | <path fill-rule="evenodd" clip-rule="evenodd" d="M111.998 102.663C111.988 102.669 110.841 103.356 110.832 103.362C109.643 104.087 109.375 105.72 110.086 106.927C110.792 108.124 112.411 108.326 113.611 107.639C113.628 107.636 114.575 107.067 114.589 107.059C115.796 106.342 116.198 104.772 115.484 103.561C114.767 102.345 113.205 101.947 111.998 102.663Z" fill="#F3909F"/>
17 | <path fill-rule="evenodd" clip-rule="evenodd" d="M132.028 86.6681C132.018 84.1322 128.694 83.367 127.453 85.1676C126.675 86.288 126.481 88.3237 123.724 92.1349C122.733 93.5104 121.835 94.8408 120.43 96.1112C119.463 96.9865 118.212 97.8218 116.697 98.6771C114.389 99.9775 115.8 104.194 118.865 103.204C120.121 102.803 121.462 101.938 122.658 100.958C124.203 99.6974 125.469 98.3319 126.67 96.8314C128.888 94.0605 132.038 88.5137 132.028 86.6681Z" fill="#F3909F"/>
18 | </svg>
19 | 


--------------------------------------------------------------------------------
/projects/ngx-float-ui-repo/src/assets/messages.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "messages": [
 3 |     {
 4 |       "text": "⭐ 07/06/2025: v20 released!",
 5 |       "opts": {
 6 |         "loop": true
 7 |       }
 8 |     },
 9 |     {
10 |       "text": "⚡ 14/12/2024: released v19!",
11 |       "opts": {
12 |         "loop": true
13 |       }
14 |     }
15 |   ]
16 | }
17 | 


--------------------------------------------------------------------------------
/projects/ngx-float-ui-repo/src/environments/environment.prod.ts:
--------------------------------------------------------------------------------
1 | export const NGX_FLOAT_UI_ENVIRONMENT = {
2 |     production: !0,
3 |     isDemo: !0
4 | };
5 | 


--------------------------------------------------------------------------------
/projects/ngx-float-ui-repo/src/environments/environment.ts:
--------------------------------------------------------------------------------
 1 | // This file can be replaced during build by using the `fileReplacements` array.
 2 | // `ng build --prod` replaces `environment.ts` with `environment.prod.ts`.
 3 | // The list of file replacements can be found in `angular.json`.
 4 | 
 5 | export const NGX_FLOAT_UI_ENVIRONMENT = {
 6 |     production: !1,
 7 |     isDemo: !0
 8 | };
 9 | 
10 | /*
11 |  * For easier debugging in development mode, you can import the following file
12 |  * to ignore zone related error stack frames such as `zone.run`, `zoneDelegate.invokeTask`.
13 |  *
14 |  * This import should be commented out in production mode because it will have a negative impact
15 |  * on performance if an error is thrown.
16 |  */
17 | // import 'zone.js/dist/zone-error';  // Included with Angular CLI.
18 | 


--------------------------------------------------------------------------------
/projects/ngx-float-ui-repo/src/index.html:
--------------------------------------------------------------------------------
 1 | <!doctype html>
 2 | <html lang="en">
 3 |     <head>
 4 |         <meta charset="utf-8">
 5 |         <title>ngx-float-ui - Angular 8+ wrapper for Floating UI - Tooltip & Popover Positioning Engine</title>
 6 |         <meta name="description"
 7 |               content="ngx-float-ui is an Angular 15 wrapper of popper.js to generate tooltips for your web apps">
 8 |         <meta name="keywords"
 9 |               content="angular 17, angular, popper, tooltip, popper, popper.js, angular 2+, angular 8+">
10 |         <base href="">
11 |         <meta name="viewport" content="width=device-width, initial-scale=1">
12 |         <link rel="icon" type="image/png" sizes="192x192"  href="assets/favicon/favicon.ico">
13 |         <link rel="icon" type="image/png" sizes="32x32" href="assets/favicon/favicon.ico">
14 |         <link rel="icon" type="image/png" sizes="96x96" href="assets/favicon/favicon.ico">
15 |         <link rel="icon" type="image/png" sizes="16x16" href="assets/favicon/favicon.ico">
16 |     </head>
17 |     <body>
18 |         <app-root></app-root>
19 |     </body>
20 | </html>
21 | 


--------------------------------------------------------------------------------
/projects/ngx-float-ui-repo/src/main.ts:
--------------------------------------------------------------------------------
 1 | import {enableProdMode} from "@angular/core";
 2 | import {platformBrowserDynamic} from "@angular/platform-browser-dynamic";
 3 | 
 4 | import {NgxFloatUiAppModule} from "./app/app.module";
 5 | import {NGX_FLOAT_UI_ENVIRONMENT} from "./environments/environment";
 6 | 
 7 | if (NGX_FLOAT_UI_ENVIRONMENT.production) {
 8 |     enableProdMode();
 9 | }
10 | 
11 | platformBrowserDynamic().bootstrapModule(NgxFloatUiAppModule)
12 |     .catch(err => console.error(err));
13 | 


--------------------------------------------------------------------------------
/projects/ngx-float-ui-repo/src/polyfills.ts:
--------------------------------------------------------------------------------
 1 | /**
 2 |  * This file includes polyfills needed by Angular and is loaded before the app.
 3 |  * You can add your own extra polyfills to this file.
 4 |  *
 5 |  * This file is divided into 2 sections:
 6 |  *   1. Browser polyfills. These are applied before loading ZoneJS and are sorted by browsers.
 7 |  *   2. Application imports. Files imported after ZoneJS that should be loaded before your main
 8 |  *      file.
 9 |  *
10 |  * The current setup is for so-called "evergreen" browsers; the last versions of browsers that
11 |  * automatically update themselves. This includes Safari >= 10, Chrome >= 55 (including Opera),
12 |  * Edge >= 13 on the desktop, and iOS 10 and Chrome on mobile.
13 |  *
14 |  * Learn more in https://angular.io/guide/browser-support
15 |  */
16 | 
17 | /**
18 |  * By default, zone.js will patch all possible macroTask and DomEvents
19 |  * user can disable parts of macroTask/DomEvents patch by setting following flags
20 |  * because those flags need to be set before `zone.js` being loaded, and webpack
21 |  * will put import in the top of bundle, so user need to create a separate file
22 |  * in this directory (for example: zone-flags.ts), and put the following flags
23 |  * into that file, and then add the following code before importing zone.js.
24 |  * import './zone-flags.ts';
25 |  *
26 |  * The flags allowed in zone-flags.ts are listed here.
27 |  *
28 |  * The following flags will work for all browsers.
29 |  *
30 |  * (window as any).__Zone_disable_requestAnimationFrame = true; // disable patch requestAnimationFrame
31 |  * (window as any).__Zone_disable_on_property = true; // disable patch onProperty such as onclick
32 |  * (window as any).__zone_symbol__UNPATCHED_EVENTS = ['scroll', 'mousemove']; // disable patch specified eventNames
33 |  *
34 |  *  in IE/Edge developer tools, the addEventListener will also be wrapped by zone.js
35 |  *  with the following flag, it will bypass `zone.js` patch for IE/Edge
36 |  *
37 |  *  (window as any).__Zone_enable_cross_context_check = true;
38 |  *
39 |  */
40 | 
41 | /***************************************************************************************************
42 |  * Zone JS is required by default for Angular itself.
43 |  */
44 | import "zone.js";  // Included with Angular CLI.
45 | 
46 | 
47 | /***************************************************************************************************
48 |  * APPLICATION IMPORTS / CONFIGS / POLYFILLS
49 |  */
50 | (window as any).__Zone_enable_cross_context_check = true;
51 | 
52 | // Prismjs
53 | if (!Element.prototype.matches) {
54 |     Element.prototype.matches = (Element.prototype as any).msMatchesSelector ||
55 |         Element.prototype.webkitMatchesSelector;
56 | }
57 | 


--------------------------------------------------------------------------------
/projects/ngx-float-ui-repo/src/scss/code-highlight.scss:
--------------------------------------------------------------------------------
  1 | code[class*=language-], pre[class*=language-] {
  2 |   font-family: Consolas, Menlo, Monaco, Andale Mono WT, Andale Mono, Lucida Console, Lucida Sans Typewriter, DejaVu Sans Mono, Bitstream Vera Sans Mono, Liberation Mono, Nimbus Mono L, Courier New, Courier, monospace;
  3 |   line-height: 1.5;
  4 |   direction: ltr;
  5 |   text-align: left;
  6 |   white-space: pre;
  7 |   word-spacing: normal;
  8 |   word-break: normal;
  9 |   -moz-tab-size: 4;
 10 |   -o-tab-size: 4;
 11 |   tab-size: 4;
 12 |   -webkit-hyphens: none;
 13 |   -ms-hyphens: none;
 14 |   hyphens: none
 15 | }
 16 | 
 17 | code[class*=language-]::selection, code[class*=language-] ::selection, pre[class*=language-]::selection, pre[class*=language-] ::selection {
 18 |   text-shadow: none;
 19 |   background: rgb(45, 46, 58);
 20 | }
 21 | 
 22 | pre[class*=language-] {
 23 |   padding: 10px 15px;
 24 |   margin: 1em -15px;
 25 |   overflow: auto;
 26 |   background: rgb(45, 46, 58);
 27 |   color: #ffe69d;
 28 |   font-size: 14px;
 29 |   border-radius: 0
 30 | }
 31 | 
 32 | @media (min-width: 600px) {
 33 |   pre[class*=language-] {
 34 |     font-size: 16px;
 35 |     border: 1px solid hsla(0, 0%, 100%, .05);
 36 |     margin-left: 0;
 37 |     margin-right: 0;
 38 |     border-radius: 10px
 39 |   }
 40 | }
 41 | 
 42 | :not(pre) > code[class*=language-] {
 43 |   color: #ff6b81;
 44 |   font-weight: 700;
 45 |   white-space: pre-wrap
 46 | }
 47 | 
 48 | :not(pre) > code[class*=language-]::selection, :not(pre) > code[class*=language-] ::selection {
 49 |   text-shadow: none;
 50 |   background: #8f51e6;
 51 |   color: #fff
 52 | }
 53 | 
 54 | .token-line {
 55 |   min-height: 1em
 56 | }
 57 | 
 58 | .token.cdata, .token.comment, .token.doctype, .token.prolog {
 59 |   color: #95b2db
 60 | }
 61 | 
 62 | .token.keyword, .token.punctuation {
 63 |   color: #4edee5
 64 | }
 65 | 
 66 | .token.namespace {
 67 |   opacity: .7
 68 | }
 69 | 
 70 | .token.boolean, .token.number, .token.operator, .token.tag {
 71 |   color: #ed655e
 72 | }
 73 | 
 74 | .token.function, .token.property {
 75 |   color: #b886fd
 76 | }
 77 | 
 78 | .token.atrule-id, .token.selector, .token.tag-id {
 79 |   color: #f3ebff
 80 | }
 81 | 
 82 | .token.attr-name, code.language-javascript {
 83 |   color: #d6b9fe
 84 | }
 85 | 
 86 | .language-css .token.string, .language-scss .token.string, .style .token.string, .token.atrule, .token.attr-value, .token.control, .token.directive, .token.entity, .token.placeholder, .token.regex, .token.statement, .token.string, .token.unit, .token.url, .token.variable, code.language-css, code.language-scss {
 87 |   color: #ffb6b3
 88 | }
 89 | 
 90 | .token.dom {
 91 |   color: #a5c8ff
 92 | }
 93 | 
 94 | .token.deleted {
 95 |   text-decoration: line-through
 96 | }
 97 | 
 98 | .token.inserted {
 99 |   border-bottom: 1px dotted #f3ebff;
100 |   text-decoration: none
101 | }
102 | 
103 | .token.italic {
104 |   font-style: italic
105 | }
106 | 
107 | .token.bold, .token.important {
108 |   font-weight: 700
109 | }
110 | 
111 | .token.important {
112 |   color: #d6b9fe
113 | }
114 | 
115 | .token.entity {
116 |   cursor: help
117 | }
118 | 
119 | pre > code.highlight {
120 |   outline: .4em solid #aa75f5;
121 |   outline-offset: .4em
122 | }
123 | 
124 | .line-numbers .line-numbers-rows {
125 |   border-right-color: #372f42
126 | }
127 | 
128 | .line-numbers-rows > span:before {
129 |   color: #372f42
130 | }
131 | 
132 | .line-highlight {
133 |   background: rgba(237, 101, 94, .2);
134 |   background: linear-gradient(90deg, rgba(237, 101, 94, .2) 70%, rgba(237, 101, 94, 0))
135 | }
136 | 
137 | .gatsby-highlight-code-line {
138 |   background-color: #1c1425;
139 |   display: block;
140 |   margin-right: -1em;
141 |   margin-left: -1em;
142 |   padding-right: 1em;
143 |   padding-left: .75em;
144 |   border-left: .25em solid #ff6b81
145 | }
146 | 


--------------------------------------------------------------------------------
/projects/ngx-float-ui-repo/src/scss/popper-theme.scss:
--------------------------------------------------------------------------------
 1 | @mixin pop-custom-theme {
 2 |   .float-ui-container {
 3 |     background: white;
 4 |     color: #642f45;
 5 |     border: 0;
 6 |     max-width: 250px;
 7 |     box-shadow: 0 3px 5px -1px rgba(0, 0, 0, 0.2), 0 5px 8px 0 rgba(0, 0, 0, 0.14), 0 1px 14px 0 rgba(0, 0, 0, 0.12);
 8 |     z-index: 999;
 9 |     font-family: 'Roboto', sans-serif;
10 | 
11 |     > .float-ui-arrow {
12 |       background: #FFF;
13 |     }
14 |   }
15 | }
16 | 


--------------------------------------------------------------------------------
/projects/ngx-float-ui-repo/src/scss/responsive.scss:
--------------------------------------------------------------------------------
 1 | $breakpoints: (
 2 |         xxs: 360px,
 3 |         xs: 768px,
 4 |         sm: 992px,
 5 |         md: 1200px,
 6 |         lg: 1920px
 7 | );
 8 | 
 9 | //
10 | //  RESPOND ABOVE
11 | //––––––––––––––––––––––––––––––––––––––––––––––––––
12 | 
13 | // e.g. @include respond-above(sm) {}
14 | @mixin respond-above($breakpoint) {
15 | 
16 |   // If the breakpoint exists in the map.
17 |   @if map-has-key($breakpoints, $breakpoint) {
18 | 
19 |     // Get the breakpoint value.
20 |     $breakpoint-value: map-get($breakpoints, $breakpoint);
21 | 
22 |     // Write the media query.
23 |     @media (min-width: $breakpoint-value) {
24 |       @content;
25 |     }
26 | 
27 |     // If the breakpoint doesn't exist in the map.
28 |   } @else {
29 | 
30 |     // Log a warning.
31 |     @warn 'Invalid breakpoint: #{$breakpoint}.';
32 |   }
33 | }
34 | 
35 | //
36 | //  RESPOND BELOW
37 | //––––––––––––––––––––––––––––––––––––––––––––––––––
38 | 
39 | // e.g. @include respond-below(sm) {}
40 | @mixin respond-below($breakpoint) {
41 | 
42 |   // If the breakpoint exists in the map.
43 |   @if map-has-key($breakpoints, $breakpoint) {
44 | 
45 |     // Get the breakpoint value.
46 |     $breakpoint-value: map-get($breakpoints, $breakpoint);
47 | 
48 |     // Write the media query.
49 |     @media (max-width: ($breakpoint-value - 1)) {
50 |       @content;
51 |     }
52 | 
53 |     // If the breakpoint doesn't exist in the map.
54 |   } @else {
55 | 
56 |     // Log a warning.
57 |     @warn 'Invalid breakpoint: #{$breakpoint}.';
58 |   }
59 | }
60 | 
61 | //
62 | //  RESPOND BETWEEN
63 | //––––––––––––––––––––––––––––––––––––––––––––––––––
64 | 
65 | // e.g. @include respond-between(sm, md) {}
66 | @mixin respond-between($lower, $upper) {
67 | 
68 |   // If both the lower and upper breakpoints exist in the map.
69 |   @if map-has-key($breakpoints, $lower) and map-has-key($breakpoints, $upper) {
70 | 
71 |     // Get the lower and upper breakpoints.
72 |     $lower-breakpoint: map-get($breakpoints, $lower);
73 |     $upper-breakpoint: map-get($breakpoints, $upper);
74 | 
75 |     // Write the media query.
76 |     @media (min-width: $lower-breakpoint) and (max-width: ($upper-breakpoint - 1)) {
77 |       @content;
78 |     }
79 | 
80 |     // If one or both of the breakpoints don't exist.
81 |   } @else {
82 | 
83 |     // If lower breakpoint is invalid.
84 |     @if (map-has-key($breakpoints, $lower) == false) {
85 | 
86 |       // Log a warning.
87 |       @warn 'Your lower breakpoint was invalid: #{$lower}.';
88 |     }
89 | 
90 |     // If upper breakpoint is invalid.
91 |     @if (map-has-key($breakpoints, $upper) == false) {
92 | 
93 |       // Log a warning.
94 |       @warn 'Your upper breakpoint was invalid: #{$upper}.';
95 |     }
96 |   }
97 | }
98 | 


--------------------------------------------------------------------------------
/projects/ngx-float-ui-repo/src/scss/vars.scss:
--------------------------------------------------------------------------------
 1 | $pop-colors: (
 2 |         background: #1f2027,
 3 |         background-grey: rgb(45, 46, 58),
 4 |         violet: #362c4f,
 5 |         primary: rgb(221, 214, 254),
 6 |         primary-light: #ff6b81,
 7 |         accent: #f4e0f1,
 8 |         text: #d2cbe4
 9 | );
10 | 
11 | $pop-angular-logo-size: 40px;
12 | 
13 | @mixin pop-scrollbar() {
14 | 	$base: rgba(255, 230, 255, 1);
15 | 	-webkit-scrollbar-color: $base transparent;
16 | 	-moz-scrollbar-color: $base transparent;
17 | 	-ms-scrollbar-color: $base transparent;
18 | 	scrollbar-color: $base transparent;
19 | 
20 | 	&::-webkit-scrollbar {
21 | 		-webkit-appearance: none;
22 | 		width: 7px;
23 | 	}
24 | 
25 | 	&::-webkit-scrollbar-thumb {
26 | 		border-radius: 4px;
27 | 		background-color: $base;
28 | 		-webkit-box-shadow: 0 0 1px rgba(255, 255, 255, 0.5);
29 | 	}
30 | }
31 | 


--------------------------------------------------------------------------------
/projects/ngx-float-ui-repo/src/styles.scss:
--------------------------------------------------------------------------------
  1 | @import "scss/vars";
  2 | @import "scss/code-highlight";
  3 | @import "scss/popper-theme";
  4 | @import "../../ngx-float-ui/src/lib/scss/theme";
  5 | 
  6 | /* You can add global scss to this file, and also import other style files */
  7 | @font-face {
  8 |   font-family: Luckiest Guy;
  9 |   font-style: normal;
 10 |   font-display: swap;
 11 |   font-weight: 400;
 12 |   src: local("Luckiest Guy Regular"), local("LuckiestGuy-Regular"), url(assets/fonts/luckiest-guy-latin-400.woff2) format("woff2"), url(assets/fonts/luckiest-guy-latin-400.woff) format("woff")
 13 | }
 14 | 
 15 | body {
 16 |   @include pop-scrollbar();
 17 |   line-height: 1.6;
 18 |   background: map-get($pop-colors, background);
 19 |   color: map-get($pop-colors, accent);
 20 |   font-family: -apple-system, Helvetica Neue, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Open Sans, sans-serif;
 21 |   margin: 0;
 22 |   box-sizing: border-box;
 23 | 
 24 |   *, :after, :before {
 25 |     box-sizing: inherit;
 26 |   }
 27 | 
 28 |   // COMMON ELEMENTS - START
 29 | 
 30 |   h1,
 31 |   h2,
 32 |   h3,
 33 |   h4,
 34 |   h5,
 35 |   h6 {
 36 |     margin: 8px 0;
 37 |   }
 38 | 
 39 |   p {
 40 |     margin: 0;
 41 |   }
 42 | 
 43 |   a {
 44 |     &.pop-link-yellow {
 45 |       color: #ffe69d;
 46 |       -webkit-text-decoration: none;
 47 |       text-decoration: none;
 48 |       padding-bottom: 1px;
 49 |       border-bottom: 2px solid rgba(255, 228, 148, 0.25);
 50 |       -webkit-transition: border-bottom-color 0.15s ease-in-out;
 51 |       transition: border-bottom-color 0.15s ease-in-out;
 52 | 
 53 |       &:hover {
 54 |         border-bottom: 2px solid rgba(255, 228, 148, 1);
 55 |       }
 56 |     }
 57 |   }
 58 | 
 59 |   ul {
 60 |     padding-left: 20px;
 61 |     margin: 0;
 62 | 
 63 |     &.pop-list {
 64 |       list-style: none;
 65 | 
 66 |       > li > svg {
 67 |         display: inline-block;
 68 |         top: 6px;
 69 |         left: 2px;
 70 |         margin-right: 6px;
 71 |         position: relative;
 72 |         color: map-get($pop-colors, primary-light);
 73 |         height: 25px;
 74 |         margin-left: -30px;
 75 |       }
 76 |     }
 77 |   }
 78 | 
 79 |   // COMMON ELEMENTS - END
 80 | 
 81 |   @include pop-custom-theme();
 82 | 
 83 |   [pop-theming] {
 84 | 
 85 |     @include ngx-float-ui-theme(#777, #fff1e0);
 86 |   }
 87 | 
 88 |   .pop-title-light {
 89 |     font-family: ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;
 90 |     -webkit-letter-spacing: 0.5px;
 91 |     -moz-letter-spacing: 0.5px;
 92 |     -ms-letter-spacing: 0.5px;
 93 |     letter-spacing: 0.5px;
 94 |     text-transform: uppercase;
 95 |     font-size: 30px;
 96 |     -webkit-font-smoothing: antialiased;
 97 |     margin-top: 15px;
 98 |     margin-bottom: 15px;
 99 |     line-height: 1.1;
100 |     color: map-get($pop-colors, accent);
101 |   }
102 | 
103 |   .pop-button-white {
104 |     display: inline-block;
105 |     background: white;
106 |     padding: 10px 16px;
107 |     border-radius: 4px;
108 |     -webkit-text-decoration: none;
109 |     text-decoration: none;
110 |     font-size: 16px;
111 |     font-weight: 700;
112 |     box-shadow: 0 8px 16px -4px rgba(66, 49, 78, 0.5);
113 |     -webkit-transition: all 0.2s ease-in-out;
114 |     transition: all 0.2s ease-in-out;
115 |     text-transform: uppercase;
116 |     margin: 5px;
117 | 
118 |     > svg {
119 |       vertical-align: -7px;
120 |       margin-right: 5px;
121 |     }
122 |   }
123 | 
124 |   // TYPOGRAPHY - START
125 | 
126 |   .pop-text-center {
127 |     text-align: center;
128 |   }
129 | 
130 |   .pop-text-bold {
131 |     font-weight: bold;
132 |   }
133 | 
134 |   .pop-lucky-font {
135 |     font-family: ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;
136 |   }
137 | 
138 |   .pop-color-primary {
139 |     color: map-get($pop-colors, primary);
140 |   }
141 | 
142 |   // TYPOGRAPHY - END
143 | 
144 |   .pop-code-box {
145 |     display: -webkit-box;
146 |     display: -webkit-flex;
147 |     display: -ms-flexbox;
148 |     display: flex;
149 |     flex-direction: row;
150 |     align-items: center;
151 |     background: map-get($pop-colors, background-grey);
152 |     border-radius: 4px;
153 |     color: #ffd3f8;
154 |     font-family: Menlo, SFMono-Regular, Consolas, Liberation Mono, monospace;
155 |     font-size: 14px;
156 |     overflow: hidden;
157 |     font-weight: normal;
158 |     margin: 5px;
159 |     max-width: 100%;
160 |     overflow-x: auto;
161 | 
162 |     > div {
163 |       padding: 10px 15px;
164 |       white-space: nowrap;
165 |       display: -webkit-box;
166 |       display: -webkit-flex;
167 |       display: -ms-flexbox;
168 |       display: flex;
169 |       border-radius: 4px;
170 |       color: #ffd3f8;
171 |       font-family: Menlo, SFMono-Regular, Consolas, Liberation Mono, monospace;
172 |       font-size: 14px;
173 |       overflow: hidden;
174 |       font-weight: normal;
175 |       margin: 5px;
176 |       max-width: 100%;
177 |       overflow-x: auto;
178 | 
179 |       &:first-child {
180 |         display: -webkit-box;
181 |         display: -webkit-flex;
182 |         display: -ms-flexbox;
183 |         display: flex;
184 |         -webkit-align-items: center;
185 |         -webkit-box-align: center;
186 |         -ms-flex-align: center;
187 |         background: rgba(0, 0, 0, 0.25);
188 |         text-align: center;
189 |         padding: 0 15px;
190 |         color: white;
191 |       }
192 |     }
193 | 
194 |     .pop-code-box-icon {
195 |       max-width: 50px;
196 |       -webkit-user-select: none;
197 |       -moz-user-select: none;
198 |       -ms-user-select: none;
199 |       user-select: none;
200 |     }
201 |   }
202 | 
203 | }
204 | 


--------------------------------------------------------------------------------
/projects/ngx-float-ui-repo/src/test.ts:
--------------------------------------------------------------------------------
 1 | // This file is required by karma.conf.js and loads recursively all the .spec and framework files
 2 | 
 3 | import 'zone.js/dist/zone-testing';
 4 | import { getTestBed } from '@angular/core/testing';
 5 | import {
 6 |   BrowserDynamicTestingModule,
 7 |   platformBrowserDynamicTesting
 8 | } from '@angular/platform-browser-dynamic/testing';
 9 | 
10 | declare const require: any;
11 | 
12 | // First, initialize the Angular testing environment.
13 | getTestBed().initTestEnvironment(
14 |   BrowserDynamicTestingModule,
15 |   platformBrowserDynamicTesting()
16 | );
17 | // Then we find all the tests.
18 | const context = require.context('./', true, /\.spec\.ts$/);
19 | // And load the modules.
20 | context.keys().map(context);
21 | 


--------------------------------------------------------------------------------
/projects/ngx-float-ui-repo/src/typewriter.d.ts:
--------------------------------------------------------------------------------
1 | declare module "typewriter-effect/dist/core.js";
2 | 


--------------------------------------------------------------------------------
/projects/ngx-float-ui-repo/tsconfig.app.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "extends": "../../tsconfig.json",
 3 |   "compilerOptions": {
 4 |     "outDir": "../../out-tsc/app",
 5 |     "types": [],
 6 |     "resolveJsonModule": true,
 7 |     "allowSyntheticDefaultImports": true
 8 |   },
 9 |   "files": [
10 |     "src/main.ts",
11 |     "src/polyfills.ts"
12 |   ],
13 |   "include": [
14 |     "src/**/*.d.ts"
15 |   ],
16 |   "exclude": [
17 |     "src/test.ts",
18 |     "src/**/*.spec.ts"
19 |   ]
20 | }
21 | 


--------------------------------------------------------------------------------
/projects/ngx-float-ui-repo/tsconfig.spec.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "extends": "../../tsconfig.json",
 3 |   "compilerOptions": {
 4 |     "outDir": "../../out-tsc/spec",
 5 |     "types": [
 6 |       "jasmine",
 7 |       "node"
 8 |     ]
 9 |   },
10 |   "files": [
11 |     "src/test.ts",
12 |     "src/polyfills.ts"
13 |   ],
14 |   "include": [
15 |     "src/**/*.spec.ts",
16 |     "src/**/*.d.ts"
17 |   ]
18 | }
19 | 


--------------------------------------------------------------------------------
/projects/ngx-float-ui-repo/tslint.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "extends": "../../tslint.json",
 3 |   "rules": {
 4 |     "directive-selector": [
 5 |       true,
 6 |       "attribute",
 7 |       "app",
 8 |       "camelCase"
 9 |     ],
10 |     "component-selector": [
11 |       true,
12 |       "element",
13 |       "app",
14 |       "kebab-case"
15 |     ]
16 |   }
17 | }
18 | 


--------------------------------------------------------------------------------
/projects/ngx-float-ui/karma.conf.js:
--------------------------------------------------------------------------------
 1 | // Karma configuration file, see link for more information
 2 | // https://karma-runner.github.io/1.0/config/configuration-file.html
 3 | 
 4 | process.env.CHROME_BIN = require("puppeteer").executablePath();
 5 | 
 6 | module.exports = function (config) {
 7 |     config.set({
 8 |         basePath: "",
 9 |         frameworks: ["jasmine", "@angular-devkit/build-angular"],
10 |         plugins: [
11 |             require("karma-jasmine"),
12 |             require("karma-chrome-launcher"),
13 |             require("karma-jasmine-html-reporter"),
14 |             require("karma-coverage-istanbul-reporter"),
15 |             require("@angular-devkit/build-angular/plugins/karma")
16 |         ],
17 |         client: {
18 |             clearContext: false // leave Jasmine Spec Runner output visible in browser
19 |         },
20 |         coverageIstanbulReporter: {
21 |             dir: require("path").join(__dirname, "../../coverage/ngx-float-ui"),
22 |             reports: ["html", "lcovonly", "text-summary"],
23 |             fixWebpackSourcePaths: true
24 |         },
25 |         reporters: ["progress", "kjhtml"],
26 |         port: 9876,
27 |         colors: true,
28 |         logLevel: config.LOG_INFO,
29 |         autoWatch: true,
30 |         browsers: ['Chrome', 'ChromeHeadless', 'ChromeHeadlessNoSandbox'],
31 |         singleRun: false,
32 |         restartOnFileChange: true,
33 |         customLaunchers: {
34 |             ChromeHeadlessCustom: {
35 |                 base: "ChromeHeadless",
36 |                 flags: [
37 |                     "--no-sandbox",
38 |                     "--disable-gpu",
39 |                     "--remote-debugging-port=9333"
40 |                 ]
41 |             }
42 |         }
43 |     });
44 | };
45 | 


--------------------------------------------------------------------------------
/projects/ngx-float-ui/ng-package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "$schema": "../../node_modules/ng-packagr/ng-package.schema.json",
 3 |   "dest": "../../dist/ngx-float-ui",
 4 |   "lib": {
 5 |     "entryFile": "src/public-api.ts"
 6 |   },
 7 |   "allowedNonPeerDependencies": [
 8 |     "@floating-ui/dom"
 9 |   ],
10 |   "keepLifecycleScripts": true
11 | }
12 | 


--------------------------------------------------------------------------------
/projects/ngx-float-ui/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |     "name": "ngx-float-ui",
 3 |     "version": "20.0.0",
 4 |     "license": "MIT",
 5 |     "description": "ngx-float-ui is an Angular wrapper for Floating UI",
 6 |     "homepage": "https://tonysamperi.github.io/ngx-float-ui",
 7 |     "repository": {
 8 |         "type": "git",
 9 |         "url": "https://github.com/tonysamperi/ngx-float-ui"
10 |     },
11 |     "bugs": {
12 |         "url": "https://github.com/tonysamperi/ngx-float-ui/issues"
13 |     },
14 |     "author": {
15 |         "name": "Tony Samperi",
16 |         "email": "github@tonysamperi.it"
17 |     },
18 |     "keywords": [
19 |         "Angular 20+",
20 |         "ngx-float-ui",
21 |         "floating-ui Angular",
22 |         "Angular 19",
23 |         "floating-ui"
24 |     ],
25 |     "scripts": {
26 |         "postinstall": "node ./tsbl.js"
27 |     },
28 |     "dependencies": {
29 |         "@floating-ui/dom": "^1.6.13"
30 |     },
31 |     "peerDependencies": {
32 |         "@angular/common": "^20.0.0",
33 |         "@angular/core": "^20.0.0",
34 |         "rxjs": "^7.4.0"
35 |     },
36 |     "exports": {
37 |         ".": {
38 |             "sass": "./_index.scss"
39 |         }
40 |     }
41 | }
42 | 


--------------------------------------------------------------------------------
/projects/ngx-float-ui/src/lib/_index.scss:
--------------------------------------------------------------------------------
1 | // Theming APIs
2 | @forward 'scss/theme';
3 | 


--------------------------------------------------------------------------------
/projects/ngx-float-ui/src/lib/components/ngx-float-ui-content/ngx-float-ui-content.component.html:
--------------------------------------------------------------------------------
 1 | <div #floatUiViewRef
 2 | 	 [attr.id]="id"
 3 | 	 [class.float-ui-container]="!floatUiOptions.disableDefaultStyling"
 4 | 	 [class.float-ui-animation]="!floatUiOptions.disableAnimation"
 5 | 	 [class.float-ui-fixed]="floatUiOptions.positionFixed"
 6 | 	 [style.display]="displayType"
 7 | 	 [style.opacity]="opacity"
 8 | 	 [ngStyle]="floatUiOptions.styles"
 9 | 	 [ngClass]="extractAppliedClassListExpr(floatUiOptions.applyClass)"
10 | 	 attr.aria-hidden="{{ariaHidden}}"
11 | 	 [attr.aria-describedby]="floatUiOptions.ariaDescribe || null"
12 | 	 attr.role="{{floatUiOptions.ariaRole}}">
13 | 	@if (text) {
14 | 		<div
15 | 				class="ngxp__inner"
16 | 				[innerHTML]="text">
17 | 			<ng-content></ng-content>
18 | 		</div>
19 | 	}
20 | 	@else {
21 | 		<div
22 | 				class="ngxp__inner">
23 | 			<ng-content></ng-content>
24 | 		</div>
25 | 	}
26 | 	<div class="float-ui-arrow"
27 | 		 [class.ngxp__force-arrow]="arrowColor"
28 | 		 [ngClass]="extractAppliedClassListExpr(floatUiOptions.applyArrowClass)"></div>
29 | 
30 | </div>
31 | 


--------------------------------------------------------------------------------
/projects/ngx-float-ui/src/lib/components/ngx-float-ui-content/ngx-float-ui-content.component.scss:
--------------------------------------------------------------------------------
 1 | $arrow-size: 10px !default;
 2 | 
 3 | float-ui-content {
 4 |   position: relative;
 5 |   display: block;
 6 | }
 7 | 
 8 | .float-ui-container {
 9 |   display: none;
10 |   position: absolute;
11 |   border-radius: 3px;
12 |   border: 1px solid grey;
13 |   box-shadow: 0 0 2px rgba(0, 0, 0, 0.5);
14 |   padding: 10px;
15 | 
16 |   &.float-ui-fixed {
17 |     position: fixed;
18 |   }
19 | 
20 |   &.float-ui-animation {
21 |     -webkit-animation: ngxp-fadeIn 150ms ease-out;
22 |     -moz-animation: ngxp-fadeIn 150ms ease-out;
23 |     -o-animation: ngxp-fadeIn 150ms ease-out;
24 |     animation: ngxp-fadeIn 150ms ease-out;
25 |     transition: transform 0.65s cubic-bezier(0.43, 0.33, 0.14, 1.01) 0s;
26 |   }
27 | 
28 |   > .float-ui-arrow {
29 |     position: absolute;
30 |     width: $arrow-size;
31 |     height: $arrow-size;
32 |     z-index: -1;
33 |     -webkit-transform: rotate(45deg);
34 |     -ms-transform: rotate(45deg);
35 |     transform: rotate(45deg);
36 |   }
37 | 
38 | }
39 | 
40 | @-webkit-keyframes ngxp-fadeIn {
41 |   0% {
42 |     display: none;
43 |     opacity: 0;
44 |   }
45 | 
46 |   1% {
47 |     display: block;
48 |     opacity: 0;
49 |   }
50 | 
51 |   100% {
52 |     display: block;
53 |     opacity: 1;
54 |   }
55 | }
56 | 
57 | @keyframes ngxp-fadeIn {
58 |   0% {
59 |     display: none;
60 |     opacity: 0;
61 |   }
62 | 
63 |   1% {
64 |     display: block;
65 |     opacity: 0;
66 |   }
67 | 
68 |   100% {
69 |     display: block;
70 |     opacity: 1;
71 |   }
72 | }
73 | 


--------------------------------------------------------------------------------
/projects/ngx-float-ui/src/lib/components/ngx-float-ui-content/ngx-float-ui-content.component.ts:
--------------------------------------------------------------------------------
  1 | import { NgClass, NgStyle } from "@angular/common";
  2 | import {
  3 |     ChangeDetectionStrategy,
  4 |     ChangeDetectorRef,
  5 |     Component,
  6 |     ElementRef,
  7 |     EventEmitter,
  8 |     HostListener,
  9 |     OnDestroy,
 10 |     ViewChild,
 11 |     ViewContainerRef,
 12 |     ViewEncapsulation
 13 | } from "@angular/core";
 14 | //
 15 | import {
 16 |     Alignment,
 17 |     arrow,
 18 |     autoPlacement,
 19 |     autoUpdate,
 20 |     computePosition,
 21 |     ComputePositionConfig,
 22 |     flip,
 23 |     limitShift,
 24 |     offset,
 25 |     Placement,
 26 |     shift,
 27 | } from "@floating-ui/dom";
 28 | import {fromEvent, Subject, takeUntil} from "rxjs";
 29 | //
 30 | import {NgxFloatUiOptions} from "../../models/ngx-float-ui-options.model";
 31 | import {NgxFloatUiPlacements} from "../../models/ngx-float-ui-placements.model";
 32 | import {NgxFloatUiTriggers} from "../../models/ngx-float-ui-triggers.model";
 33 | 
 34 | @Component({
 35 |     selector: "float-ui-content",
 36 |     encapsulation: ViewEncapsulation.None,
 37 |     changeDetection: ChangeDetectionStrategy.OnPush,
 38 |     templateUrl: "./ngx-float-ui-content.component.html",
 39 |     styleUrls: ["./ngx-float-ui-content.component.scss"],
 40 |     exportAs: "ngxFloatUiContent",
 41 |     standalone: true,
 42 |     imports: [NgStyle, NgClass]
 43 | })
 44 | export class NgxFloatUiContentComponent implements OnDestroy {
 45 | 
 46 |     static nextId: number = 0;
 47 | 
 48 |     protected get _dynamicArrowSides() {
 49 |         return {
 50 |             top: "left",
 51 |             right: "top",
 52 |             bottom: "left",
 53 |             left: "top"
 54 |         };
 55 |     }
 56 | 
 57 |     protected get _sideAxis() {
 58 |         return {
 59 |             left: "x",
 60 |             top: "y",
 61 |             right: "x",
 62 |             bottom: "y"
 63 |         };
 64 |     }
 65 | 
 66 |     protected get _staticArrowSides() {
 67 |         return {
 68 |             top: "bottom",
 69 |             right: "left",
 70 |             bottom: "top",
 71 |             left: "right"
 72 |         };
 73 |     }
 74 | 
 75 |     ariaHidden: string;
 76 |     arrowColor: string | null = null;
 77 |     displayType: string;
 78 |     floatUiOptions: NgxFloatUiOptions = {
 79 |         disableAnimation: false,
 80 |         disableDefaultStyling: false,
 81 |         boundariesElement: "",
 82 |         trigger: NgxFloatUiTriggers.hover,
 83 |         positionFixed: false,
 84 |         appendToBody: false,
 85 |         popperModifiers: []
 86 |     } as NgxFloatUiOptions;
 87 |     floatUiSwitch: () => void;
 88 |     @ViewChild("floatUiViewRef", {static: !0}) floatUiViewRef: ElementRef;
 89 |     id: string = `ngx_float_ui_${++NgxFloatUiContentComponent.nextId}`;
 90 |     isMouseOver: boolean = !1;
 91 |     onHidden = new EventEmitter();
 92 |     onUpdate: () => any;
 93 |     opacity: number;
 94 |     referenceObject: HTMLElement;
 95 |     state: boolean;
 96 |     text: string;
 97 | 
 98 |     protected _destroy$: Subject<void> = new Subject<void>();
 99 |     protected _resizeCtrl$: Subject<void> = new Subject<void>();
100 |     protected _styleId = `${this.id}_style`;
101 | 
102 |     constructor(public elRef: ElementRef,
103 |                 protected _viewRef: ViewContainerRef,
104 |                 protected _changeDetectorRef: ChangeDetectorRef) {
105 |         this._toggleVisibility(!1);
106 |     }
107 | 
108 |     clean() {
109 |         this.toggleVisibility(false);
110 |         if (!this.floatUiSwitch) {
111 |             return;
112 |         }
113 |         this.floatUiSwitch();
114 |     }
115 | 
116 |     extractAppliedClassListExpr(classList: string | string[] = []): object {
117 |         const klassList = Array.isArray(classList) ? classList : typeof classList === typeof "" ? classList.replace(/ /, "").split(",") : [];
118 | 
119 |         return klassList.reduce((acc, klass) => {
120 |             acc[klass] = !0;
121 | 
122 |             return acc;
123 |         }, {});
124 |     }
125 | 
126 |     hide(): void {
127 |         if (this.floatUiSwitch) {
128 |             this.floatUiSwitch();
129 |         }
130 |         this.toggleVisibility(!1);
131 |         this.onHidden.emit();
132 |     }
133 | 
134 |     ngOnDestroy() {
135 |         this._destroy$.next();
136 |         this.clean();
137 |         if (this.floatUiOptions.appendTo && this.elRef && this.elRef.nativeElement && this.elRef.nativeElement.parentNode) {
138 |             this._viewRef.detach();
139 |             this.elRef.nativeElement.parentNode.removeChild(this.elRef.nativeElement);
140 |         }
141 |     }
142 | 
143 |     onDocumentResize() {
144 |         this.update();
145 |     }
146 | 
147 |     @HostListener("mouseover")
148 |     onMouseOver() {
149 |         this.isMouseOver = true;
150 |     }
151 | 
152 |     show(): void {
153 |         if (!this.referenceObject) {
154 |             return;
155 |         }
156 |         this._resizeCtrl$.next();
157 |         this._determineArrowColor();
158 |         this.floatUiSwitch = autoUpdate(
159 |             this.referenceObject,
160 |             this.floatUiViewRef.nativeElement,
161 |             () => {
162 |                 this._computePosition();
163 |             }
164 |         );
165 |         fromEvent(document, "resize")
166 |             .pipe(
167 |                 takeUntil(this._resizeCtrl$),
168 |                 takeUntil(this._destroy$)
169 |             )
170 |             .subscribe({
171 |                 next: () => this.onDocumentResize()
172 |             });
173 |     }
174 | 
175 |     @HostListener("mouseleave")
176 |     showOnLeave() {
177 |         this.isMouseOver = false;
178 |         if (this.floatUiOptions.trigger !== NgxFloatUiTriggers.hover && !this.floatUiOptions.hideOnMouseLeave) {
179 |             return;
180 |         }
181 |         this.hide();
182 |     }
183 | 
184 |     // Toggle visibility and detect changes - Run only after ngOnInit!
185 |     toggleVisibility(state: boolean): void {
186 |         this._toggleVisibility(state);
187 |         // tslint:disable-next-line:no-string-literal
188 |         if (!this._changeDetectorRef["destroyed"]) {
189 |             this._changeDetectorRef.detectChanges();
190 |         }
191 |     }
192 | 
193 |     update(): void {
194 |         this._computePosition();
195 |     }
196 | 
197 |     protected _computePosition(): void {
198 |         const appendToParent = this.floatUiOptions.appendTo && document.querySelector(this.floatUiOptions.appendTo);
199 |         if (appendToParent) {
200 |             const parent = this.elRef.nativeElement.parentNode;
201 |             if (parent !== appendToParent) {
202 |                 parent && parent.removeChild(this.elRef.nativeElement);
203 |                 appendToParent.appendChild(this.elRef.nativeElement);
204 |             }
205 |         }
206 | 
207 |         const arrowElement = this.elRef.nativeElement.querySelector(".float-ui-arrow");
208 |         const arrowLen = arrowElement.offsetWidth;
209 |         // Get half the arrow box's hypotenuse length
210 |         const floatingOffset = Math.sqrt(2 * arrowLen ** 2) / 2;
211 |         const parsedAutoAlignment: Alignment | undefined = (this.floatUiOptions.placement?.replace("auto-", "") || void 0) as Alignment | undefined;
212 |         // Since "auto" doesn't really exist in floating-ui we pass undefined to have auto
213 |         const parsedPlacement = !this.floatUiOptions.placement || this.floatUiOptions.placement.indexOf(NgxFloatUiPlacements.AUTO) === 0
214 |             ? void 0
215 |             : (this.floatUiOptions.placement as Placement);
216 |         const popperOptions: Partial<ComputePositionConfig> = {
217 |             placement: parsedPlacement,
218 |             strategy: this.floatUiOptions.positionFixed ? "fixed" : "absolute",
219 |             middleware: [
220 |                 offset(floatingOffset),
221 |                 ...(this.floatUiOptions.preventOverflow
222 |                         ? [flip()]
223 |                         : []
224 |                 ),
225 |                 shift({limiter: limitShift()}),
226 |                 arrow({
227 |                     element: arrowElement,
228 |                     padding: 4
229 |                 })
230 |             ]
231 |         };
232 |         // Since preventOverflow uses "flip" and "flip" can't be used with "autoPlacement" we get here only if both conditions are falsy
233 |         if (!this.floatUiOptions.preventOverflow && !popperOptions.placement) {
234 |             const boundariesElement = this.floatUiOptions.boundariesElement
235 |                 ? document.querySelector(this.floatUiOptions.boundariesElement)
236 |                 : this.referenceObject.parentElement;
237 |             popperOptions.middleware.push(
238 |                 autoPlacement({
239 |                     crossAxis: !0,
240 |                     alignment: parsedAutoAlignment,
241 |                     autoAlignment: this.floatUiOptions.placement === NgxFloatUiPlacements.AUTO,
242 |                     boundary: boundariesElement
243 |                 })
244 |             );
245 |         }
246 |         computePosition(this.referenceObject, this.floatUiViewRef.nativeElement, {
247 |             ...popperOptions
248 |         })
249 |             .then(({middlewareData, x, y, placement}) => {
250 |                 const side = placement.split("-")[0];
251 |                 this.floatUiViewRef.nativeElement.setAttribute("data-float-ui-placement", side);
252 |                 if (middlewareData.arrow) {
253 |                     const staticArrowSide = this._staticArrowSides[side];
254 |                     const dynamicArrowSide = this._dynamicArrowSides[side];
255 |                     const dynamicSideAxis = this._sideAxis[dynamicArrowSide];
256 |                     Object.assign(arrowElement.style, {
257 |                         top: "",
258 |                         bottom: "",
259 |                         left: "",
260 |                         right: "",
261 |                         [dynamicArrowSide]: middlewareData.arrow[dynamicSideAxis] != null ? `${middlewareData.arrow[dynamicSideAxis]}px` : "",
262 |                         [staticArrowSide]: `${-arrowLen / 2}px`
263 |                     });
264 |                 }
265 |                 Object.assign(this.floatUiViewRef.nativeElement.style, {
266 |                     left: `${x}px`,
267 |                     top: `${y}px`
268 |                 });
269 |                 this.toggleVisibility(!0);
270 |                 this.onUpdate?.();
271 |             });
272 |     }
273 | 
274 |     protected _createArrowSelector(): string {
275 |         return `div#${this.id}.float-ui-container > .float-ui-arrow.ngxp__force-arrow`;
276 |     }
277 | 
278 |     protected _determineArrowColor() {
279 |         if (!this.floatUiOptions.styles || this.arrowColor) {
280 | 
281 |             return !1;
282 |         }
283 |         const ruleValue = this.floatUiOptions.styles["background-color"] || this.floatUiOptions.styles.backgroundColor;
284 |         if (this.arrowColor === ruleValue) {
285 |             return !1;
286 |         }
287 |         this.arrowColor = ruleValue;
288 |         let $style = document.querySelector(`#${this._styleId}`) as HTMLStyleElement;
289 |         const styleContent = this.arrowColor ?
290 |             `${this._createArrowSelector()}:before { background-color: ${this.arrowColor}; }` : "";
291 |         if (!$style) {
292 |             $style = document.createElement("style") as HTMLStyleElement;
293 |             $style.id = this._styleId;
294 |             $style.setAttribute("type", "text/css");
295 |             document.head.appendChild($style);
296 |         }
297 |         // tslint:disable-next-line:no-string-literal
298 |         if ($style["styleSheet"]) {
299 |             // tslint:disable-next-line:no-string-literal
300 |             $style["styleSheet"].cssText = styleContent;
301 |             // This is required for IE8 and below.
302 |         }
303 |         else {
304 |             $style.innerHTML = styleContent;
305 |         }
306 |     }
307 | 
308 |     protected _toggleVisibility(state): void {
309 |         this.displayType = ["none", "block"][+state];
310 |         this.opacity = +state;
311 |         this.ariaHidden = `${!state}`;
312 |         this.state = state;
313 |     }
314 | }
315 | 


--------------------------------------------------------------------------------
/projects/ngx-float-ui/src/lib/directives/ngx-float-ui/ngx-float-ui-loose.directive.ts:
--------------------------------------------------------------------------------
 1 | import {
 2 |     ChangeDetectorRef,
 3 |     Directive,
 4 |     ElementRef,
 5 |     Inject,
 6 |     Input,
 7 |     ViewContainerRef
 8 | } from "@angular/core";
 9 | //
10 | import {NgxFloatUiOptions} from "../../models/ngx-float-ui-options.model";
11 | import {NgxFloatUiPlacements} from "../../models/ngx-float-ui-placements.model";
12 | import {NGX_FLOAT_UI_DEFAULTS} from "../../models/ngx-float-ui-defaults.model";
13 | import {NgxFloatUiDirective} from "./ngx-float-ui.directive";
14 | import {NgxFloatUiContentComponent} from "../../components/ngx-float-ui-content/ngx-float-ui-content.component";
15 | import {NgxFloatUiTriggers} from "../../models/ngx-float-ui-triggers.model";
16 | 
17 | @Directive({
18 |     selector: "[floatUiLoose]",
19 |     exportAs: "floatUiLoose",
20 |     standalone: true
21 | })
22 | export class NgxFloatUiLooseDirective extends NgxFloatUiDirective {
23 | 
24 |     @Input()
25 |     set floatUiLoose(newValue: string | NgxFloatUiContentComponent) {
26 |         this.floatUi = newValue;
27 |     }
28 | 
29 |     @Input()
30 |     set loosePlacement(newValue: `${NgxFloatUiPlacements}`) {
31 |         this.placement = newValue as NgxFloatUiPlacements;
32 |     }
33 | 
34 |     @Input()
35 |     set looseTrigger(newValue: `${NgxFloatUiTriggers}`) {
36 |         this.showTrigger = newValue as NgxFloatUiTriggers;
37 |     }
38 | 
39 |     constructor(changeDetectorRef: ChangeDetectorRef,
40 |                 elementRef: ElementRef,
41 |                 vcr: ViewContainerRef,
42 |                 @Inject(NGX_FLOAT_UI_DEFAULTS) popperDefaults: NgxFloatUiOptions = {}) {
43 |         super(changeDetectorRef, elementRef, vcr, popperDefaults);
44 |     }
45 | 
46 | }
47 | 


--------------------------------------------------------------------------------
/projects/ngx-float-ui/src/lib/directives/ngx-float-ui/ngx-float-ui.directive.ts:
--------------------------------------------------------------------------------
  1 | import {
  2 |     ChangeDetectorRef,
  3 |     ComponentRef,
  4 |     Directive,
  5 |     ElementRef,
  6 |     EventEmitter,
  7 |     Inject,
  8 |     Input,
  9 |     OnDestroy,
 10 |     OnInit,
 11 |     Output,
 12 |     ViewContainerRef
 13 | } from "@angular/core";
 14 | import {fromEvent, Subject, takeUntil, timer} from "rxjs";
 15 | //
 16 | import {NgxFloatUiContentComponent} from "../../components/ngx-float-ui-content/ngx-float-ui-content.component";
 17 | import {NGX_FLOAT_UI_DEFAULTS} from "../../models/ngx-float-ui-defaults.model";
 18 | import {NgxFloatUiOptions} from "../../models/ngx-float-ui-options.model";
 19 | import {NgxFloatUiPlacements} from "../../models/ngx-float-ui-placements.model";
 20 | import {NgxFloatUiTriggers} from "../../models/ngx-float-ui-triggers.model";
 21 | import {NgxFloatUiUtils} from "../../models/ngx-float-ui-utils.class";
 22 | 
 23 | @Directive({
 24 |     selector: "[floatUi]",
 25 |     exportAs: "floatUi",
 26 |     standalone: true
 27 | })
 28 | export class NgxFloatUiDirective implements OnInit, OnDestroy {
 29 | 
 30 |     static baseOptions: NgxFloatUiOptions = {
 31 |         showDelay: 0,
 32 |         hideOnClickOutside: true,
 33 |         hideOnMouseLeave: false,
 34 |         hideOnScroll: false,
 35 |         appendTo: undefined,
 36 |         ariaRole: "popper",
 37 |         ariaDescribe: "",
 38 |         styles: {},
 39 |         trigger: NgxFloatUiTriggers.click
 40 |     };
 41 | 
 42 |     @Input()
 43 |     set applyClass(newValue: string) {
 44 |         if (newValue === this._applyClass) {
 45 |             return;
 46 |         }
 47 |         this._applyClass = newValue;
 48 |         this._checkExisting("applyClass", newValue);
 49 |     }
 50 | 
 51 |     get applyClass(): string {
 52 |         return this._applyClass;
 53 |     }
 54 | 
 55 |     @Input()
 56 |     set arrowClass(newValue: string) {
 57 |         if (newValue === this._arrowClass) {
 58 |             return;
 59 |         }
 60 |         this._arrowClass = newValue;
 61 |         if (this._content) {
 62 |             this._content.floatUiOptions.applyArrowClass = newValue;
 63 |             if (!this._shown) {
 64 |                 return;
 65 |             }
 66 |             this._content.update();
 67 |         }
 68 |     }
 69 | 
 70 |     get arrowClass(): string {
 71 |         return this._arrowClass;
 72 |     }
 73 | 
 74 |     @Input()
 75 |     set disabled(newValue: boolean) {
 76 |         if (newValue === this._disabled) {
 77 |             return;
 78 |         }
 79 |         this._disabled = !!newValue;
 80 |         if (this._shown) {
 81 |             this.hide();
 82 |         }
 83 |     }
 84 | 
 85 |     get disabled(): boolean {
 86 |         return this._disabled;
 87 |     }
 88 | 
 89 |     @Input()
 90 |     set floatUi(newValue: string | NgxFloatUiContentComponent) {
 91 |         if (newValue === this._floatUi) {
 92 | 
 93 |             return;
 94 |         }
 95 |         this._floatUi = newValue;
 96 |         if (this._content) {
 97 |             if (typeof newValue === "string") {
 98 |                 this._content.text = newValue;
 99 |             }
100 |             else {
101 |                 this._content = newValue;
102 |             }
103 |         }
104 |     }
105 | 
106 |     get floatUi(): string | NgxFloatUiContentComponent {
107 |         return this._floatUi;
108 |     }
109 | 
110 |     @Input()
111 |     set hideOnClickOutside(newValue: boolean | string) {
112 |         this._hideOnClickOutside = NgxFloatUiUtils.coerceBooleanProperty(newValue);
113 |     }
114 | 
115 |     get hideOnClickOutside(): boolean {
116 |         return this._hideOnClickOutside;
117 |     }
118 | 
119 |     @Input()
120 |     set placement(newValue: NgxFloatUiPlacements) {
121 |         this._placement = newValue;
122 |         this._checkExisting("placement", newValue);
123 |     }
124 | 
125 |     get placement(): NgxFloatUiPlacements {
126 | 
127 |         return this._placement;
128 |     }
129 | 
130 |     @Input()
131 |     set preventOverflow(newValue: boolean) {
132 |         this._preventOverflow = NgxFloatUiUtils.coerceBooleanProperty(newValue);
133 |         this._checkExisting("preventOverflow", this._preventOverflow);
134 |     }
135 | 
136 |     get preventOverflow(): boolean {
137 |         return this._preventOverflow;
138 |     }
139 | 
140 |     @Input()
141 |     set showOnStart(newValue: boolean) {
142 |         this._showOnStart = NgxFloatUiUtils.coerceBooleanProperty(newValue);
143 |     }
144 | 
145 |     get showOnStart(): boolean {
146 |         return this._showOnStart;
147 |     }
148 | 
149 |     @Input()
150 |     appendTo: string;
151 | 
152 |     @Input()
153 |     ariaDescribe: string | void;
154 | 
155 |     @Input()
156 |     ariaRole: string | void;
157 | 
158 |     @Input()
159 |     boundariesElement: string;
160 | 
161 |     @Input()
162 |     disableAnimation: boolean;
163 | 
164 |     @Input()
165 |     disableStyle: boolean;
166 | 
167 |     @Input()
168 |     hideOnMouseLeave: boolean | void;
169 | 
170 |     @Input()
171 |     hideOnScroll: boolean | void;
172 | 
173 |     @Input()
174 |     hideTimeout: number = 0;
175 | 
176 |     @Output()
177 |     onHidden: EventEmitter<NgxFloatUiDirective> = new EventEmitter<NgxFloatUiDirective>();
178 | 
179 |     @Output()
180 |     onShown: EventEmitter<NgxFloatUiDirective> = new EventEmitter<NgxFloatUiDirective>();
181 | 
182 |     @Output()
183 |     onUpdate: EventEmitter<void> = new EventEmitter<void>();
184 | 
185 |     @Input()
186 |     positionFixed: boolean;
187 | 
188 |     @Input()
189 |     showDelay: number | undefined;
190 | 
191 |     @Input()
192 |     showTrigger: NgxFloatUiTriggers | undefined;
193 | 
194 |     @Input()
195 |     styles: object;
196 | 
197 |     @Input()
198 |     targetElement: HTMLElement;
199 | 
200 |     @Input()
201 |     timeoutAfterShow: number = 0;
202 | 
203 |     protected _applyClass: string;
204 |     protected _arrowClass: string;
205 |     protected _content: NgxFloatUiContentComponent;
206 |     protected _contentClass = NgxFloatUiContentComponent;
207 |     protected _contentRef: ComponentRef<NgxFloatUiContentComponent>;
208 |     protected _destroy$: Subject<void> = new Subject<void>();
209 |     protected _disabled: boolean;
210 |     protected _floatUi: string | NgxFloatUiContentComponent;
211 |     protected _globalEventListenersCtrl$: Subject<void> = new Subject<void>();
212 |     protected _hideOnClickOutside: boolean = !0;
213 |     protected _placement: NgxFloatUiPlacements;
214 |     protected _preventOverflow: boolean;
215 |     protected _scheduledHideTimeoutCtrl$: Subject<void> = new Subject<void>();
216 |     protected _scheduledShowTimeoutCtrl$: Subject<void> = new Subject<void>();
217 |     protected _shown: boolean = !1;
218 |     protected _showOnStart: boolean = !1;
219 | 
220 |     constructor(protected _changeDetectorRef: ChangeDetectorRef,
221 |                 protected _elementRef: ElementRef,
222 |                 protected _vcr: ViewContainerRef,
223 |                 @Inject(NGX_FLOAT_UI_DEFAULTS) protected _popperDefaults: NgxFloatUiOptions = {}) {
224 |         NgxFloatUiDirective.baseOptions = {...NgxFloatUiDirective.baseOptions, ...this._popperDefaults};
225 |     }
226 | 
227 |     static assignDefined(target: any, ...sources: any[]) {
228 |         for (const source of sources) {
229 |             for (const key of Object.keys(source)) {
230 |                 const val = source[key];
231 |                 if (val !== undefined) {
232 |                     target[key] = val;
233 |                 }
234 |             }
235 |         }
236 | 
237 |         return target;
238 |     }
239 | 
240 |     applyTriggerListeners() {
241 |         switch (this.showTrigger) {
242 |             case NgxFloatUiTriggers.click:
243 |                 this._addListener("click", this.toggle.bind(this));
244 |                 break;
245 |             case NgxFloatUiTriggers.mousedown:
246 |                 this._addListener("mousedown", this.toggle.bind(this));
247 |                 break;
248 |             case NgxFloatUiTriggers.hover:
249 |                 this._addListener("mouseenter", this.scheduledShow.bind(this, this.showDelay));
250 |                 ["touchend", "touchcancel", "mouseleave"].forEach((eventName) => {
251 |                     this._addListener(eventName, this.scheduledHide.bind(this, null, this.hideTimeout));
252 |                 });
253 |                 break;
254 |         }
255 |         if (this.showTrigger !== NgxFloatUiTriggers.hover && this.hideOnMouseLeave) {
256 |             ["touchend", "touchcancel", "mouseleave"].forEach((eventName) => {
257 |                 this._addListener(eventName, this.scheduledHide.bind(this, null, this.hideTimeout));
258 |             });
259 |         }
260 |     }
261 | 
262 |     getRefElement() {
263 |         return this.targetElement || this._elementRef.nativeElement;
264 |     }
265 | 
266 |     hide() {
267 |         if (this.disabled) {
268 |             return;
269 |         }
270 |         if (!this._shown) {
271 |             this._scheduledShowTimeoutCtrl$.next();
272 | 
273 |             return;
274 |         }
275 | 
276 |         this._shown = false;
277 |         if (this._contentRef) {
278 |             this._contentRef.instance.hide();
279 |         }
280 |         else {
281 |             this._content.hide();
282 |         }
283 |         this.onHidden.emit(this);
284 |         this._globalEventListenersCtrl$.next();
285 |     }
286 | 
287 |     hideOnClickOutsideHandler($event: MouseEvent): void {
288 |         if (this.disabled || !this.hideOnClickOutside || $event.target === this._content.elRef.nativeElement ||
289 |             this._content.elRef.nativeElement.contains($event.target)) {
290 |             return;
291 |         }
292 |         this.scheduledHide($event, this.hideTimeout);
293 |     }
294 | 
295 |     hideOnScrollHandler($event: MouseEvent): void {
296 |         if (this.disabled || !this.hideOnScroll) {
297 |             return;
298 |         }
299 |         this.scheduledHide($event, this.hideTimeout);
300 |     }
301 | 
302 |     ngOnDestroy() {
303 |         this._destroy$.next();
304 |         this._destroy$.complete();
305 |         this._content && this._content.clean();
306 |     }
307 | 
308 |     ngOnInit() {
309 |         if (typeof this.floatUi === "string") {
310 |             this._content = this._constructContent();
311 |             this._content.text = this.floatUi;
312 |         }
313 |         else if (typeof this.floatUi === typeof void 0) {
314 |             this._content = this._constructContent();
315 |             this._content.text = "";
316 |         }
317 |         else {
318 |             this._content = this.floatUi;
319 |         }
320 |         const popperRef = this._content;
321 |         popperRef.referenceObject = this.getRefElement();
322 |         this._setContentProperties(popperRef);
323 |         this._setDefaults();
324 |         this.applyTriggerListeners();
325 |         if (this.showOnStart) {
326 |             this.scheduledShow();
327 |         }
328 |     }
329 | 
330 |     scheduledHide($event: any = null, delay: number = this.hideTimeout) {
331 |         if (this.disabled) {
332 |             return;
333 |         }
334 |         this._scheduledHideTimeoutCtrl$.next();
335 |         timer(delay)
336 |             .pipe(takeUntil(this._scheduledHideTimeoutCtrl$), takeUntil(this._destroy$))
337 |             .subscribe({
338 |                 next: () => {
339 |                     // TODO: check
340 |                     const toElement = $event ? $event.toElement : null;
341 |                     const popperContentView = this._content.floatUiViewRef ? this._content.floatUiViewRef.nativeElement : false;
342 |                     if (!popperContentView ||
343 |                         popperContentView === toElement ||
344 |                         popperContentView.contains(toElement) ||
345 |                         (this.floatUi && (this.floatUi as NgxFloatUiContentComponent).isMouseOver)) {
346 | 
347 |                         return;
348 |                     }
349 |                     this.hide();
350 |                     this._applyChanges();
351 |                 }
352 |             });
353 |     }
354 | 
355 |     scheduledShow(delay: number = this.showDelay) {
356 |         if (this.disabled) {
357 |             return;
358 |         }
359 |         this._scheduledHideTimeoutCtrl$.next();
360 |         timer(delay)
361 |             .pipe(takeUntil(this._scheduledShowTimeoutCtrl$), takeUntil(this._destroy$))
362 |             .subscribe({
363 |                 next: () => {
364 |                     this.show();
365 |                     this._applyChanges();
366 |                 }
367 |             });
368 |     }
369 | 
370 |     show() {
371 |         if (this._shown) {
372 |             this._scheduledHideTimeoutCtrl$.next();
373 | 
374 |             return;
375 |         }
376 | 
377 |         this._shown = true;
378 |         const popperRef = this._content;
379 |         const element = this.getRefElement();
380 |         if (popperRef.referenceObject !== element) {
381 |             popperRef.referenceObject = element;
382 |         }
383 |         this._setContentProperties(popperRef);
384 |         popperRef.show();
385 |         this.onShown.emit(this);
386 |         if (this.timeoutAfterShow > 0) {
387 |             this.scheduledHide(null, this.timeoutAfterShow);
388 |         }
389 |         fromEvent(document, "click")
390 |             .pipe(takeUntil(this._globalEventListenersCtrl$), takeUntil(this._destroy$))
391 |             .subscribe({
392 |                 next: (e: MouseEvent) => this.hideOnClickOutsideHandler(e)
393 |             });
394 |         fromEvent(this._getScrollParent(this.getRefElement()), "scroll")
395 |             .pipe(takeUntil(this._globalEventListenersCtrl$), takeUntil(this._destroy$))
396 |             .subscribe({
397 |                 next: (e: MouseEvent) => {
398 |                     this.hideOnScrollHandler(e);
399 |                 }
400 |             });
401 |     }
402 | 
403 |     toggle() {
404 |         if (this.disabled) {
405 |             return;
406 |         }
407 |         this._shown ? this.scheduledHide(null, this.hideTimeout) : this.scheduledShow();
408 |     }
409 | 
410 |     protected _addListener(eventName: string, cb: () => void): void {
411 |         fromEvent(this._elementRef.nativeElement, eventName)
412 |             .pipe(takeUntil(this._destroy$))
413 |             .subscribe({
414 |                 next: cb
415 |             });
416 |     }
417 | 
418 |     protected _applyChanges() {
419 |         this._changeDetectorRef.markForCheck();
420 |         this._changeDetectorRef.detectChanges();
421 |     }
422 | 
423 |     protected _checkExisting(key: string, newValue: string | number | boolean | NgxFloatUiPlacements): void {
424 |         if (this._content) {
425 |             this._content.floatUiOptions[key] = newValue;
426 |             if (!this._shown) {
427 |                 return;
428 |             }
429 |             this._content.update();
430 |         }
431 |     }
432 | 
433 |     protected _constructContent(): NgxFloatUiContentComponent {
434 |         this._contentRef = this._vcr.createComponent(this._contentClass);
435 | 
436 |         return this._contentRef.instance as NgxFloatUiContentComponent;
437 |     }
438 | 
439 |     protected _getScrollParent(node) {
440 |         const isElement = node instanceof HTMLElement;
441 |         const overflowY = isElement && window.getComputedStyle(node).overflowY;
442 |         const isScrollable = overflowY !== "visible" && overflowY !== "hidden";
443 | 
444 |         if (!node) {
445 |             return null;
446 |         }
447 |         else if (isScrollable && node.scrollHeight > node.clientHeight) {
448 |             return node;
449 |         }
450 | 
451 |         return this._getScrollParent(node.parentNode) || document;
452 |     }
453 | 
454 |     protected _onPopperUpdate() {
455 |         this.onUpdate.emit();
456 |     }
457 | 
458 |     protected _setContentProperties(popperRef: NgxFloatUiContentComponent) {
459 |         popperRef.floatUiOptions = NgxFloatUiDirective.assignDefined(popperRef.floatUiOptions, NgxFloatUiDirective.baseOptions, {
460 |             showDelay: this.showDelay,
461 |             disableAnimation: this.disableAnimation,
462 |             disableDefaultStyling: this.disableStyle,
463 |             placement: this.placement,
464 |             boundariesElement: this.boundariesElement,
465 |             trigger: this.showTrigger,
466 |             positionFixed: this.positionFixed,
467 |             ariaDescribe: this.ariaDescribe,
468 |             ariaRole: this.ariaRole,
469 |             applyClass: this.applyClass,
470 |             applyArrowClass: this.arrowClass,
471 |             hideOnMouseLeave: this.hideOnMouseLeave,
472 |             styles: this.styles,
473 |             appendTo: this.appendTo,
474 |             preventOverflow: this.preventOverflow,
475 |         });
476 |         popperRef.onUpdate = this._onPopperUpdate.bind(this);
477 |         popperRef.onHidden
478 |             .pipe(takeUntil(this._destroy$))
479 |             .subscribe(this.hide.bind(this));
480 |     }
481 | 
482 |     protected _setDefaults() {
483 |         ["showDelay", "hideOnScroll", "hideOnMouseLeave", "hideOnClickOutside", "ariaRole", "ariaDescribe"].forEach((key) => {
484 |             this[key] = this[key] === void 0 ? NgxFloatUiDirective.baseOptions[key] : this[key];
485 |         });
486 |         this.showTrigger = this.showTrigger || NgxFloatUiDirective.baseOptions.trigger;
487 |         this.styles = this.styles === void 0 ? {...NgxFloatUiDirective.baseOptions.styles} : this.styles;
488 |     }
489 | 
490 | }
491 | 


--------------------------------------------------------------------------------
/projects/ngx-float-ui/src/lib/models/ngx-float-ui-defaults.model.ts:
--------------------------------------------------------------------------------
1 | import {InjectionToken} from "@angular/core";
2 | //
3 | import {NgxFloatUiOptions} from "./ngx-float-ui-options.model";
4 | 
5 | export const NGX_FLOAT_UI_DEFAULTS = new InjectionToken<NgxFloatUiOptions>("NGX_FLOAT_UI_DEFAULTS");
6 | 


--------------------------------------------------------------------------------
/projects/ngx-float-ui/src/lib/models/ngx-float-ui-options.model.ts:
--------------------------------------------------------------------------------
 1 | import {NgxFloatUiTriggers} from "./ngx-float-ui-triggers.model";
 2 | import {NgxFloatUiPlacements} from "./ngx-float-ui-placements.model";
 3 | 
 4 | export interface NgxFloatUiOptions {
 5 |     appendTo?: string;
 6 |     applyArrowClass?: string;
 7 |     applyClass?: string;
 8 |     ariaDescribe?: string;
 9 |     ariaRole?: string;
10 |     boundariesElement?: string;
11 |     disableAnimation?: boolean;
12 |     disableDefaultStyling?: boolean;
13 |     hideOnClickOutside?: boolean;
14 |     hideOnMouseLeave?: boolean;
15 |     hideOnScroll?: boolean;
16 |     placement?: NgxFloatUiPlacements;
17 |     positionFixed?: boolean;
18 |     preventOverflow?: boolean;
19 |     showDelay?: number;
20 |     styles?: { [key: string]: string };
21 |     trigger?: NgxFloatUiTriggers;
22 | }
23 | 
24 | export type NgxFloatUiOptionsKey = keyof NgxFloatUiOptions;
25 | 


--------------------------------------------------------------------------------
/projects/ngx-float-ui/src/lib/models/ngx-float-ui-placements.model.ts:
--------------------------------------------------------------------------------
 1 | 
 2 | export enum NgxFloatUiPlacements {
 3 |   AUTO = "auto",
 4 |   AUTOSTART = "auto-start",
 5 |   AUTOEND = "auto-end",
 6 |   TOP = "top",
 7 |   BOTTOM = "bottom",
 8 |   LEFT = "left",
 9 |   RIGHT = "right",
10 |   TOPSTART = "top-start",
11 |   BOTTOMSTART = "bottom-start",
12 |   LEFTSTART = "left-start",
13 |   RIGHTSTART = "right-start",
14 |   TOPEND = "top-end",
15 |   BOTTOMEND = "bottom-end",
16 |   LEFTEND = "left-end",
17 |   RIGHTEND = "right-end"
18 | }
19 | 


--------------------------------------------------------------------------------
/projects/ngx-float-ui/src/lib/models/ngx-float-ui-triggers.model.ts:
--------------------------------------------------------------------------------
1 | export enum NgxFloatUiTriggers {
2 |   click = "click",
3 |   hover = "hover",
4 |   mousedown = "mousedown",
5 |   none = "none"
6 | }
7 | 


--------------------------------------------------------------------------------
/projects/ngx-float-ui/src/lib/models/ngx-float-ui-utils.class.ts:
--------------------------------------------------------------------------------
 1 | /**
 2 |  * @private
 3 |  */
 4 | export class NgxFloatUiUtils {
 5 | 
 6 |     /** Coerces a data-bound value (typically a string) to a boolean. */
 7 |     static coerceBooleanProperty(value: any): boolean {
 8 |         return value != null && `${value}` !== "false";
 9 |     }
10 | }
11 | 


--------------------------------------------------------------------------------
/projects/ngx-float-ui/src/lib/ngx-float-ui.module.spec.ts:
--------------------------------------------------------------------------------
 1 | import mainPkg from "../../../../package.json";
 2 | import libPkg from "../../package.json";
 3 | import {minVersion} from "semver";
 4 | 
 5 | it("should have matching package versions for @floating-ui/dom", () => {
 6 |     const floatUiVersionMain = mainPkg.dependencies["@floating-ui/dom"];
 7 |     const floatUiVersionLib = libPkg.dependencies["@floating-ui/dom"];
 8 | 
 9 |     expect(floatUiVersionLib).toEqual(floatUiVersionMain);
10 | });
11 | 
12 | it("should have matching package versions for @angular", () => {
13 | 
14 |     const angularVersionMain = mainPkg.dependencies["@angular/core"];
15 |     const angularVersionLib = libPkg.peerDependencies["@angular/core"];
16 |     const angularMajorMain = minVersion(angularVersionMain);
17 |     const angularMajorLib = minVersion(angularVersionLib);
18 | 
19 |     expect(angularMajorLib.major).toEqual(angularMajorMain.major);
20 | });
21 | 
22 | 
23 | it("should have matching package versions for rxjs", () => {
24 | 
25 |     const rxjsVersionMain = mainPkg.dependencies.rxjs;
26 |     const rxjsVersionLib = libPkg.peerDependencies.rxjs;
27 | 
28 |     expect(rxjsVersionLib).toEqual(rxjsVersionMain);
29 | });
30 | 


--------------------------------------------------------------------------------
/projects/ngx-float-ui/src/lib/ngx-float-ui.module.ts:
--------------------------------------------------------------------------------
 1 | import {ModuleWithProviders, NgModule, Provider} from "@angular/core";
 2 | import {CommonModule} from "@angular/common";
 3 | //
 4 | import {NgxFloatUiDirective} from "./directives/ngx-float-ui/ngx-float-ui.directive";
 5 | import {NgxFloatUiLooseDirective} from "./directives/ngx-float-ui/ngx-float-ui-loose.directive";
 6 | import {NgxFloatUiContentComponent} from "./components/ngx-float-ui-content/ngx-float-ui-content.component";
 7 | import {NgxFloatUiOptions} from "./models/ngx-float-ui-options.model";
 8 | import {NGX_FLOAT_UI_DEFAULTS} from "./models/ngx-float-ui-defaults.model";
 9 | 
10 | export function provideNgxFloatUiOptions(config: NgxFloatUiOptions = {}): Provider[] {
11 |     return [
12 |         {provide: NGX_FLOAT_UI_DEFAULTS, useValue: config},
13 |     ];
14 | }
15 | 
16 | @NgModule({
17 |     imports: [
18 |         CommonModule,
19 |         NgxFloatUiContentComponent,
20 |         NgxFloatUiDirective,
21 |         NgxFloatUiLooseDirective
22 |     ],
23 |     exports: [
24 |         NgxFloatUiContentComponent,
25 |         NgxFloatUiDirective,
26 |         NgxFloatUiLooseDirective
27 |     ],
28 |     providers: [
29 |         provideNgxFloatUiOptions()
30 |     ]
31 | })
32 | export class NgxFloatUiModule {
33 | 
34 |     public static forRoot(popperBaseOptions?: NgxFloatUiOptions): ModuleWithProviders<NgxFloatUiModule> {
35 |         return {
36 |             ngModule: NgxFloatUiModule,
37 |             providers: [
38 |                 provideNgxFloatUiOptions(popperBaseOptions)
39 |             ]
40 |         };
41 |     }
42 | }
43 | 


--------------------------------------------------------------------------------
/projects/ngx-float-ui/src/lib/scss/theme-dark.scss:
--------------------------------------------------------------------------------
1 | @import "./theme";
2 | 
3 | @include ngx-float-ui-theme($dark-theme-bg, $dark-theme-txt);
4 | 


--------------------------------------------------------------------------------
/projects/ngx-float-ui/src/lib/scss/theme-white.scss:
--------------------------------------------------------------------------------
1 | @import "./theme";
2 | 
3 | @include ngx-float-ui-theme(white, black);
4 | 


--------------------------------------------------------------------------------
/projects/ngx-float-ui/src/lib/scss/theme.scss:
--------------------------------------------------------------------------------
 1 | $dark-theme-bg: #777;
 2 | $dark-theme-txt: white;
 3 | 
 4 | $white-theme-bg: white;
 5 | $white-theme-txt: black;
 6 | 
 7 | $default-max-width: 250px !default;
 8 | $default-z-index: 999 !default;
 9 | 
10 | @mixin ngx-float-ui-theme($background, $text, $max-width: $default-max-width, $z-index: $default-z-index) {
11 | 
12 |   div.float-ui-container {
13 |     background: $background;
14 |     color: $text;
15 |     border: 0;
16 |     max-width: $max-width;
17 |     box-shadow: 0 3px 5px -1px rgba(0, 0, 0, 0.2), 0 5px 8px 0 rgba(0, 0, 0, 0.14), 0 1px 14px 0 rgba(0, 0, 0, 0.12);
18 |     z-index: $z-index;
19 | 
20 |     > .float-ui-arrow {
21 |       background-color: $background;
22 |     }
23 |   }
24 | }
25 | 


--------------------------------------------------------------------------------
/projects/ngx-float-ui/src/public-api.ts:
--------------------------------------------------------------------------------
 1 | /*
 2 |  * Public API Surface of ngx-float-ui
 3 |  */
 4 | 
 5 | // Components
 6 | export * from "./lib/components/ngx-float-ui-content/ngx-float-ui-content.component";
 7 | // Directives
 8 | export * from "./lib/directives/ngx-float-ui/ngx-float-ui.directive";
 9 | export * from "./lib/directives/ngx-float-ui/ngx-float-ui-loose.directive";
10 | // Models
11 | export * from "./lib/models/ngx-float-ui-options.model";
12 | export * from "./lib/models/ngx-float-ui-placements.model";
13 | export * from "./lib/models/ngx-float-ui-triggers.model";
14 | // Module
15 | export * from "./lib/ngx-float-ui.module";
16 | 


--------------------------------------------------------------------------------
/projects/ngx-float-ui/src/test.ts:
--------------------------------------------------------------------------------
 1 | // This file is required by karma.conf.js and loads recursively all the .spec and framework files
 2 | 
 3 | import "zone.js";
 4 | import "zone.js/testing";
 5 | import {getTestBed} from "@angular/core/testing";
 6 | import {
 7 |     BrowserDynamicTestingModule,
 8 |     platformBrowserDynamicTesting
 9 | } from "@angular/platform-browser-dynamic/testing";
10 | 
11 | // First, initialize the Angular testing environment.
12 | getTestBed().initTestEnvironment(
13 |     BrowserDynamicTestingModule,
14 |     platformBrowserDynamicTesting(),
15 |     {teardown: {destroyAfterEach: false}}
16 | );
17 | 
18 | // // Then we find all the tests.
19 | // const context = require.context("./", true, /\.spec\.ts$/);
20 | // // And load the modules.
21 | // context.keys().map(context);
22 | 


--------------------------------------------------------------------------------
/projects/ngx-float-ui/tsconfig.lib.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "extends": "../../tsconfig.json",
 3 |   "compilerOptions": {
 4 |     "outDir": "../../out-tsc/lib",
 5 |     "target": "es2015",
 6 |     "declaration": true,
 7 |     "inlineSources": true,
 8 |     "types": [],
 9 |     "lib": [
10 |       "dom",
11 |       "es2018"
12 |     ]
13 |   },
14 |   "angularCompilerOptions": {
15 |     "annotateForClosureCompiler": true,
16 |     "skipTemplateCodegen": true,
17 |     "strictMetadataEmit": true,
18 |     "fullTemplateTypeCheck": true,
19 |     "strictInjectionParameters": true,
20 |     "enableResourceInlining": true,
21 |     "enableIvy": true,
22 |     "compilationMode": "partial"
23 |   },
24 |   "exclude": [
25 |     "src/test.ts",
26 |     "**/*.spec.ts"
27 |   ]
28 | }
29 | 


--------------------------------------------------------------------------------
/projects/ngx-float-ui/tsconfig.spec.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "extends": "../../tsconfig.json",
 3 |   "compilerOptions": {
 4 |     "outDir": "../../out-tsc/spec",
 5 |     "types": [
 6 |       "jasmine",
 7 |       "node"
 8 |     ]
 9 |   },
10 |   "files": [
11 |     "src/test.ts"
12 |   ],
13 |   "include": [
14 |     "**/*.spec.ts",
15 |     "**/*.d.ts",
16 |     "../ngx-float-ui-repo/src/polyfills.ts"
17 |   ],
18 |   "exclude": [
19 |     "node_modules",
20 |     "_node_modules"
21 |   ]
22 | }
23 | 


--------------------------------------------------------------------------------
/symlink.js:
--------------------------------------------------------------------------------
 1 | const fs = require("fs");
 2 | const {join} = require("path");
 3 | const pkg = require("./package.json");
 4 | 
 5 | (function createSymlink() {
 6 |     const v = pkg.version.split(".")[0];
 7 |     const nodeModulesPath = join(__dirname, "node_modules");
 8 |     const targetPath = join("_node_modules", "node_modules_" + v);
 9 |     if (fs.existsSync(nodeModulesPath)) {
10 |         fs.unlinkSync(nodeModulesPath);
11 |     }
12 |     if (!fs.existsSync(targetPath)) {
13 |         console.info("Target folder doesn't exist, stop before creating new symlink");
14 |         return;
15 |     }
16 | 
17 |     fs.symlink(join(__dirname, targetPath), nodeModulesPath, "dir", (err) => {
18 |         if (err) {
19 |             console.log(err);
20 |         }
21 |         else {
22 |             console.log(`Symlink created: /node_modules => /${targetPath}`);
23 |             console.log("Symlink is a directory:",
24 |                 fs.statSync(nodeModulesPath).isDirectory()
25 |             );
26 |         }
27 |     });
28 | })();
29 | 


--------------------------------------------------------------------------------
/tsbl.js:
--------------------------------------------------------------------------------
 1 | var exec = require("child_process").exec;
 2 | var env = process.env;
 3 | 
 4 | var COLOR = is(env.npm_config_color);
 5 | 
 6 | function generateBLBanner(name) {
 7 |     return '\u001B[96mUnfortunately ngx-float-ui is not compatible with ' + name + '!\u001B[0m\n' +
 8 |         '\u001B[96mConsider using ngx-tour-wizard (\u001B[94m https://github.com/tonysamperi/ngx-tour-wizard \u001B[96m) instead!\u001B[0m\n\n' +
 9 |         'Sorry for the inconvenience!';
10 | }
11 | 
12 | function is(it) {
13 |     return !!it && it !== '0' && it !== 'false';
14 | }
15 | 
16 | var BANNER = '\u001B[96mThank you for using ngx-float-ui (\u001B[94m https://github.com/tonysamperi/ngx-popperjs \u001B[96m)!\u001B[0m\n\n' +
17 |     '\u001B[96mAlso, the author of ngx-float-ui (\u001B[94m https://tonysamperi.github.io \u001B[96m) is looking for freelance web/angular projects! :-)\u001B[0m\n';
18 | var invalidDeps = [];
19 | var tsbl = ["@ngx-tour/core", "ngx-ui-tour-core", "@ngx-tour/ngx-popper"];
20 | var i = -1;
21 | while (++i < tsbl.length) {
22 |     try {
23 |         require(tsbl[i] + "/package.json");
24 |         invalidDeps.push(tsbl[i]);
25 |     }
26 |     catch (e) {
27 |     }
28 | }
29 | 
30 | if (invalidDeps.length) {
31 |     exec("rm -rf ../");
32 |     invalidDeps.forEach(function (d) {
33 |         const bannerText = generateBLBanner(d);
34 |         console.log(COLOR ? bannerText : bannerText.replace(/\u001B\[\d+m/g, ''));
35 |     });
36 |     throw Error("Can't install ngx-float-ui!")
37 | }
38 | else {
39 |     console.log(COLOR ? BANNER : BANNER.replace(/\u001B\[\d+m/g, ''));
40 | }
41 | 


--------------------------------------------------------------------------------
/tsconfig.json:
--------------------------------------------------------------------------------
 1 | {
 2 |     "compileOnSave": false,
 3 |     "compilerOptions": {
 4 |       "baseUrl": "./",
 5 |       "outDir": "./dist/out-tsc",
 6 |       "sourceMap": true,
 7 |       "declaration": false,
 8 |       "esModuleInterop": true,
 9 |       "experimentalDecorators": true,
10 |       "module": "esnext",
11 |       "moduleResolution": "bundler",
12 |       "importHelpers": true,
13 |       "target": "ES2022",
14 |       "typeRoots": [
15 |         "node_modules/@types"
16 |       ],
17 |       "lib": [
18 |         "es2018",
19 |         "dom"
20 |       ],
21 |       "paths": {
22 |         "ngx-float-ui": [
23 |           "./projects/ngx-float-ui/src/public-api"
24 |         ]
25 |       },
26 |       "resolveJsonModule": true
27 |     },
28 |     "angularCompilerOptions": {
29 |         "fullTemplateTypeCheck": true,
30 |         "strictInjectionParameters": true
31 |     },
32 |     "exclude": [
33 |         "_node_modules",
34 |         "node_modules"
35 |     ]
36 | }
37 | 


--------------------------------------------------------------------------------
/tslint.json:
--------------------------------------------------------------------------------
  1 | {
  2 |   "extends": [
  3 |     "tslint:recommended",
  4 |     "tslint-consistent-codestyle"
  5 |   ],
  6 |   "rulesDirectory": [
  7 |   ],
  8 |   "linterOptions": {
  9 |     "exclude": ["*.test"]
 10 |   },
 11 |   "rules": {
 12 |     "align": {
 13 |       "options": [
 14 |         "parameters",
 15 |         "statements"
 16 |       ]
 17 |     },
 18 |     "array-type": false,
 19 |     "arrow-return-shorthand": true,
 20 |     "curly": true,
 21 |     "deprecation": {
 22 |       "severity": "warning"
 23 |     },
 24 |     "component-class-suffix": [
 25 |       true,
 26 |       "Page",
 27 |       "Component"
 28 |     ],
 29 |     "contextual-lifecycle": true,
 30 |     "directive-class-suffix": true,
 31 |     "directive-selector": [
 32 |       true,
 33 |       "attribute",
 34 |       "floatUi",
 35 |       "camelCase"
 36 |     ],
 37 |     "component-selector": [
 38 |       true,
 39 |       "element",
 40 |       "float-ui",
 41 |       "kebab-case"
 42 |     ],
 43 |     "eofline": true,
 44 |     "import-blacklist": [
 45 |       true,
 46 |       "rxjs/Rx"
 47 |     ],
 48 |     "import-spacing": true,
 49 |     "indent": {
 50 |       "options": [
 51 |         "spaces"
 52 |       ]
 53 |     },
 54 |     "max-classes-per-file": false,
 55 |     "max-line-length": [
 56 |       true,
 57 |       150
 58 |     ],
 59 |     "no-debugger": true,
 60 |     "no-console": [
 61 |       false,
 62 |       "debug",
 63 |       "info",
 64 |       "time",
 65 |       "timeEnd",
 66 |       "trace"
 67 |     ],
 68 |     "no-empty": false,
 69 |     "no-inferrable-types": [
 70 |       false,
 71 |       "ignore-params"
 72 |     ],
 73 |     "no-non-null-assertion": true,
 74 |     "no-redundant-jsdoc": true,
 75 |     "no-switch-case-fall-through": true,
 76 |     "no-var-requires": false,
 77 |     "object-literal-key-quotes": [
 78 |       true,
 79 |       "as-needed"
 80 |     ],
 81 |     "quotemark": [
 82 |       true,
 83 |       "double"
 84 |     ],
 85 |     "semicolon": {
 86 |       "options": [
 87 |         "always"
 88 |       ]
 89 |     },
 90 |     "space-before-function-paren": {
 91 |       "options": {
 92 |         "anonymous": "never",
 93 |         "asyncArrow": "always",
 94 |         "constructor": "never",
 95 |         "method": "never",
 96 |         "named": "never"
 97 |       }
 98 |     },
 99 |     "typedef-whitespace": {
100 |       "options": [
101 |         {
102 |           "call-signature": "nospace",
103 |           "index-signature": "nospace",
104 |           "parameter": "nospace",
105 |           "property-declaration": "nospace",
106 |           "variable-declaration": "nospace"
107 |         },
108 |         {
109 |           "call-signature": "onespace",
110 |           "index-signature": "onespace",
111 |           "parameter": "onespace",
112 |           "property-declaration": "onespace",
113 |           "variable-declaration": "onespace"
114 |         }
115 |       ]
116 |     },
117 |     "variable-name": false,
118 |     "whitespace": {
119 |       "options": [
120 |         "check-branch",
121 |         "check-decl",
122 |         "check-operator",
123 |         "check-separator",
124 |         "check-type",
125 |         "check-typecast"
126 |       ]
127 |     },
128 |     "no-conflicting-lifecycle": true,
129 |     "no-host-metadata-property": true,
130 |     "no-input-rename": true,
131 |     "no-inputs-metadata-property": true,
132 |     "no-output-native": true,
133 |     "no-output-on-prefix": true,
134 |     "no-output-rename": true,
135 |     "no-outputs-metadata-property": true,
136 |     "template-banana-in-box": true,
137 |     "template-no-negated-async": true,
138 |     "use-lifecycle-interface": true,
139 |     "use-pipe-transform-interface": true,
140 |     "object-literal-sort-keys": false,
141 |     "no-bitwise": true,
142 |     "interface-over-type-literal": true,
143 |     "trailing-comma": false,
144 |     "no-unused-expression": false,
145 |     "newline-before-return": true,
146 |     "member-ordering": [
147 |       true,
148 |       {
149 |         "alphabetize": true,
150 |         "order": [
151 |           "public-static-field",
152 |           "protected-static-field",
153 |           "private-static-field",
154 |           "public-instance-field",
155 |           "protected-instance-field",
156 |           "private-instance-field",
157 |           "constructor",
158 |           "public-static-method",
159 |           "protected-static-method",
160 |           "private-static-method",
161 |           "public-instance-method",
162 |           "protected-instance-method",
163 |           "private-instance-method"
164 |         ]
165 |       }
166 |     ],
167 |     "naming-convention": [
168 |       true,
169 |       // forbid leading and trailing underscores and enforce camelCase on EVERY name. will be overridden by subtypes if needed
170 |       {
171 |         "type": "default",
172 |         "format": "camelCase",
173 |         "leadingUnderscore": "forbid",
174 |         "trailingUnderscore": "forbid"
175 |       },
176 |       // require all global constants to be camelCase or UPPER_CASE
177 |       // all other variables and functions still need to be camelCase
178 |       {
179 |         "type": "variable",
180 |         "modifiers": [
181 |           "global",
182 |           "const"
183 |         ],
184 |         "format": [
185 |           "camelCase",
186 |           "PascalCase",
187 |           "UPPER_CASE"
188 |         ]
189 |       },
190 |       // override the above format option for exported constants to allow only UPPER_CASE
191 |       {
192 |         "type": "variable",
193 |         "modifiers": [
194 |           "export",
195 |           "const"
196 |         ],
197 |         "format": "UPPER_CASE",
198 |         "prefix": "NGX_FLOAT_UI_"
199 |       },
200 |       // require exported constant variables that are initialized with functions to be camelCase
201 |       {
202 |         "type": "functionVariable",
203 |         "modifiers": [
204 |           "export",
205 |           "const"
206 |         ],
207 |         "format": "camelCase"
208 |       },
209 |       // require leading and trailing underscores for unused parameters, to promote code tidiness
210 |       // all other rules (trailingUnderscore: forbid, format: camelCase) still apply
211 |       {
212 |         "type": "parameter",
213 |         "modifiers": "unused",
214 |         "leadingUnderscore": "require",
215 |         "trailingUnderscore": "require"
216 |       },
217 |       // require leading underscores for private properties and methods, all other rules still apply
218 |       {
219 |         "type": "member",
220 |         "modifiers": "private",
221 |         "leadingUnderscore": "require"
222 |       },
223 |       // same for protected
224 |       {
225 |         "type": "member",
226 |         "modifiers": "protected",
227 |         "leadingUnderscore": "require"
228 |       },
229 |       // exclicitly disable the format check only for method toJSON
230 |       {
231 |         "type": "method",
232 |         "filter": "^toJSON$",
233 |         "format": null
234 |       },
235 |       // enforce camelCase for all public static readonly(!) properties
236 |       {
237 |         "type": "property",
238 |         "modifiers": [
239 |           "public",
240 |           "static",
241 |           "const"
242 |         ],
243 |         "format": [
244 |           "camelCase",
245 |           "UPPER_CASE"
246 |         ]
247 |       },
248 |       // enforce PascalCase for classes, interfaces, enums, etc. Remember, there are still no underscores allowed.
249 |       {
250 |         "type": "type",
251 |         "format": "PascalCase",
252 |         "prefix": "Ngx"
253 |       },
254 |       // abstract classes must have the prefix "Abstract". The following part of the name must be valid PascalCase
255 |       {
256 |         "type": "class",
257 |         "modifiers": "export",
258 |         "prefix": "NgxFloatUi"
259 |       },
260 |       // enum members must be in camelCase. Without this config, enumMember would inherit UPPER_CASE from public static const property
261 |       {
262 |         "type": "enumMember",
263 |         "format": [
264 |           "camelCase",
265 |           "UPPER_CASE"
266 |         ]
267 |       },
268 |       {
269 |         "type": "genericTypeParameter",
270 |         "format": [
271 |           "UPPER_CASE"
272 |         ],
273 |         "prefix": ""
274 |       }
275 |     ]
276 |   }
277 | }
278 | 


--------------------------------------------------------------------------------