npmpackage.info

Gathering detailed insights and metrics for @advanced-rest-client/arc-fit-mixin

Other packages similar to @advanced-rest-client/arc-fit-mixin

@advanced-rest-client/arc-resizable-mixin

1.2.3

arc-resizable-mixin is a port of iron-fit-behavior that works with web components

Gathering detailed insights and metrics for @advanced-rest-client/arc-fit-mixin

@advanced-rest-client/arc-fit-mixin - 1.2.3 | npmpackage.info

@advanced-rest-client/arc-fit-mixin

⛔️ DEPRECATED. Use the `@anypoint-web-components/awc` module instead.

1.2.3

NOASSERTION

JavaScript

2.8

Installations

npm install @advanced-rest-client/arc-fit-mixin

Developer Guide

BETA

Typescript

No

Module System

CommonJS

Node Version

14.18.0

NPM Version

6.14.15 Pull Requests

Open

0

Total

20

Closed

18

Merged

2

Issues

Open

0

Total

0

Closed

0

Releases

v1.2.3

Updated on Oct 16, 2021

v1.2.2

Updated on Mar 12, 2021

View All 2 releases

Languages

JavaScript

JavaScript (100%)

Developer

advanced-rest-client

Download Statistics

Total Downloads

Last Day

Last Week

Last Month

Last Year

GitHub Statistics

NOASSERTION License

43 Commits

3 Branches

3 Contributors

Updated on Jan 28, 2023

Maintainers

View All 3 Contributors

Package Meta Information

Latest Version

1.2.3

Package Id

@advanced-rest-client/arc-fit-mixin@1.2.3

Size

10.80 kB

NPM Version

6.14.15

Node Version

14.18.0

Published on

Oct 16, 2021

Total Downloads

Cumulative downloads

Total Downloads

NaN

Last Day

NaN

Compared to previous day

Last Week

NaN

Compared to previous week

Last Month

NaN

Compared to previous month

Last Year

NaN

Compared to previous year

Weekly Downloads

Monthly Downloads

Yearly Downloads

Dependencies

@open-wc/dedupe-mixin

Dev Dependencies

@advanced-rest-client/arc-demo-helper @open-wc/eslint-config @open-wc/testing @web/dev-server @web/test-runner @web/test-runner-playwright eslint eslint-config-prettier husky lint-staged lit-element lit-html sinon typescript typescript-lit-html-plugin

DEPRECATED

Use the @anypoint-web-components/awc module instead.

This mixin is a port of iron-fit-behavior that works with LitElement.

ArcFitMixin fits an element in another element using max-height and max-width, and optionally centers it in the window or another element. The element will only be sized and/or positioned if it has not already been sized and/or positioned by CSS.

CSS properties	Action
`position` set	Element is not centered horizontally or vertically
`top` or `bottom` set	Element is not vertically centered
`left` or `right` set	Element is not horizontally centered
`max-height` set	Element respects `max-height`
`max-width` set	Element respects `max-width`

ArcFitMixin can position an element into another element using verticalAlign and horizontalAlign. This will override the element's css position.

1<div class="container">
2  <arc-fit-impl verticalalign="top" horizontalalign="auto">
3    Positioned into the container
4  </arc-fit-impl>
5</div>

Use noOverlap to position the element around another element without overlapping it.

1<div class="container">
2  <arc-fit-impl nooverlap verticalalign="auto" horizontalalign="auto">
3    Positioned around the container
4  </arc-fit-impl>
5</div>

Use horizontalOffset, verticalOffset to offset the element from its positionTarget; ArcFitMixin will collapse these in order to keep the element within fitInto boundaries, while preserving the element's CSS margin values.

1<div class="container">
2  <arc-fit-impl verticalalign="top" verticaloffset="20">
3    With vertical offset
4  </arc-fit-impl>
5</div>

Deprecation notice

The following attributes are supported for compatibility with older and Polymer elements but eventually will be removed and replaced wit the corresponding new attribute.

sizing-target > sizingtarget
fit-into > fitinto
no-overlap > nooverlap
position-target > positiontarget
horizontal-align > horizontalalign
vertical-align > verticalalign
dynamic-align > dynamicalign
horizontal-offset > horizontaloffset
vertical-offset > verticaloffset
auto-fit-on-attach > autofitonattach

Installation

1npm i @advanced-rest-client/arc-fit-mixin

Usage

1import { LitElement } from 'lit-element';
2import { ArcFitMixin } from '@advanced-rest-client/arc-fit-mixin';
3
4class ArcFitImpl extends ArcFitMixin(LitElement) {
5  static get properties() {
6    return {
7      myProp: { type: Object, attribute: 'my-prop' },
8    };
9  }
10}

Testing

1npm run test

Testing with Sauce Labs

1npm run test:sl

Demo

1npm start

No vulnerabilities found.

10

Dangerous-Workflow

Determines if the project's GitHub Action workflows avoid dangerous patterns.

10

Binary-Artifacts

Determines if the project has generated executable (binary) artifacts in the source repository.

9

License

Determines if the project has defined a license.

1

Pinned-Dependencies

Determines if the project has declared and pinned the dependencies of its build process.

Reason

dependency not pinned by hash detected -- score normalized to 1

Details

Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/deployment.yml:24: update your workflow using https://app.stepsecurity.io/secureworkflow/arc-archive/arc-fit-mixin/deployment.yml/master?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/deployment.yml:25: update your workflow using https://app.stepsecurity.io/secureworkflow/arc-archive/arc-fit-mixin/deployment.yml/master?enable=pin
Warn: third-party GitHubAction not pinned by hash: .github/workflows/deployment.yml:28: update your workflow using https://app.stepsecurity.io/secureworkflow/arc-archive/arc-fit-mixin/deployment.yml/master?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/deployment.yml:29: update your workflow using https://app.stepsecurity.io/secureworkflow/arc-archive/arc-fit-mixin/deployment.yml/master?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/deployment.yml:43: update your workflow using https://app.stepsecurity.io/secureworkflow/arc-archive/arc-fit-mixin/deployment.yml/master?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/deployment.yml:44: update your workflow using https://app.stepsecurity.io/secureworkflow/arc-archive/arc-fit-mixin/deployment.yml/master?enable=pin
Warn: third-party GitHubAction not pinned by hash: .github/workflows/deployment.yml:47: update your workflow using https://app.stepsecurity.io/secureworkflow/arc-archive/arc-fit-mixin/deployment.yml/master?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/deployment.yml:48: update your workflow using https://app.stepsecurity.io/secureworkflow/arc-archive/arc-fit-mixin/deployment.yml/master?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/deployment.yml:67: update your workflow using https://app.stepsecurity.io/secureworkflow/arc-archive/arc-fit-mixin/deployment.yml/master?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/deployment.yml:70: update your workflow using https://app.stepsecurity.io/secureworkflow/arc-archive/arc-fit-mixin/deployment.yml/master?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/deployment.yml:74: update your workflow using https://app.stepsecurity.io/secureworkflow/arc-archive/arc-fit-mixin/deployment.yml/master?enable=pin
Warn: third-party GitHubAction not pinned by hash: .github/workflows/deployment.yml:82: update your workflow using https://app.stepsecurity.io/secureworkflow/arc-archive/arc-fit-mixin/deployment.yml/master?enable=pin
Warn: third-party GitHubAction not pinned by hash: .github/workflows/deployment.yml:85: update your workflow using https://app.stepsecurity.io/secureworkflow/arc-archive/arc-fit-mixin/deployment.yml/master?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/deployment.yml:89: update your workflow using https://app.stepsecurity.io/secureworkflow/arc-archive/arc-fit-mixin/deployment.yml/master?enable=pin
Warn: npmCommand not pinned by hash: .github/workflows/deployment.yml:81
Info: 0 out of 10 GitHub-owned GitHubAction dependencies pinned
Info: 0 out of 4 third-party GitHubAction dependencies pinned
Info: 1 out of 2 npmCommand dependencies pinned

0

Maintained

Determines if the project is "actively maintained".

0

Code-Review

Determines if the project requires human code review before pull requests (aka merge requests) are merged.

0

Token-Permissions

Determines if the project's workflows follow the principle of least privilege.

0

CII-Best-Practices

Determines if the project has an OpenSSF (formerly CII) Best Practices Badge.

0

Fuzzing

Determines if the project uses fuzzing.

0

Security-Policy

Determines if the project has published a security policy.

0

SAST

Determines if the project uses static code analysis.

0

Vulnerabilities

Determines if the project has open, known unfixed vulnerabilities.

Score

2.8

/10

Last Scanned on 2025-07-07

The Open Source Security Foundation is a cross-industry collaboration to improve the security of open source software (OSS). The Scorecard provides security health metrics for open source projects.

Learn More