@knighttower/adaptive - npm Package Compare versions

Comparing version 2.0.0 to 2.0.1

package.json

 {
     "name": "@knighttower/adaptive",
-    "version": "2.0.0",
+    "version": "2.0.1",
     "type": "module",
@@ -17,2 +17,3 @@ "main": "index.cjs.js",
         "src",
+        "examples",
         "index.js",
@@ -19,0 +20,0 @@ "index.cjs.js"

README.md

@@ -18,4 +18,2 @@ (This docs still under construction, see "example" and "test" folders for extensive examples of usage)
 
-[![npm version](https://badge.fury.io/js/%40knighttower%2Fadaptive.svg)](https://badge.fury.io/js/%40knighttower%2Fadaptive)
-
 [![NPM published](https://github.com/knighttower/adaptive.js/actions/workflows/main.yml/badge.svg)](https://github.com/knighttower/adaptive.js/actions/workflows/main.yml) [![pages-build-deployment](https://github.com/knighttower/adaptive.js/actions/workflows/pages/pages-build-deployment/badge.svg?branch=development)](https://github.com/knighttower/adaptive.js/actions/workflows/pages/pages-build-deployment) [![release version](https://github.com/knighttower/adaptive.js/actions/workflows/auto-release.yml/badge.svg)](https://github.com/knighttower/adaptive.js/actions/workflows/auto-release.yml)
@@ -27,2 +25,3 @@
 -   [Usage](#usage)
+-   [API](#api)
 -   [Implementation](#implementation)
@@ -117,7 +116,156 @@ -   [Features and examples](#features)
 
-<br/>
-<br/>
+<br/> <br/>
 
-## Implementation examples <a name="implementation"></a>
+## API <a name="api"></a>
 
+### `getMinMaxQueries()`
+
+**Returns**: `Object`  
+**Description**: Returns all available min-max queries.
+
+#### Example
+
+```javascript
+const minMaxQueries = Adaptive.getMinMaxQueries();
+```
+
+---
+
+### `getExpQueries()`
+
+**Returns**: `Object`  
+**Description**: Returns all available expression queries.
+
+#### Example
+
+```javascript
+const expQueries = Adaptive.getExpQueries();
+```
+
+---
+
+### `registerElement(elementOrSelector: String | Object, data: Object)`
+
+**Parameters**:
+
+-   `elementOrSelector` (String | Object): Element or selector string.
+-   `data` (Object): Optional, used mostly for Vue.
+
+**Returns**: `Void`  
+**Description**: Registers an element for adaptive behavior.
+
+#### Example
+
+```javascript
+Adaptive.registerElement('#myElement', { directive: 'someValue' });
+```
+
+---
+
+### `addQueryMinMax(id: String, min: Number, max: Number)`
+
+**Parameters**:
+
+-   `id` (String): Identifier for the query.
+-   `min` (Number): Minimum value.
+-   `max` (Number): Maximum value.
+
+**Returns**: `Void`  
+**Description**: Registers a custom min-max query.
+
+#### Example
+
+```javascript
+Adaptive.addQueryMinMax('custom', 200, 400);
+```
+
+---
+
+### `addQueryExpression(id: String, query: String)`
+
+**Parameters**:
+
+-   `id` (String): Identifier for the query.
+-   `query` (String): Media query string.
+
+**Returns**: `Void`  
+**Description**: Registers a custom expression query.
+
+#### Example
+
+```javascript
+Adaptive.addQueryExpression('custom', 'screen and (max-width: 500em)');
+```
+
+---
+
+### `if(breakdownId: String, callback: Function | Array): Object`
+
+**Parameters**:
+
+-   `breakdownId` (String): Identifier like "tablet" or "mobile", etc.
+-   `callback` (Function | Array): Function/Method or Array with object and property to set.
+
+**Returns**: `Object`: Proxy  
+**Description**: Executes callback based on the media query match.
+
+#### Example
+
+```javascript
+Adaptive.if('mobile', [object, 'propertyId']) || Adaptive.if('mobile', () => {});
+```
+
+---
+
+### `init()`
+
+**Returns**: `Void`  
+**Description**: Initializes or re-initializes after the DOM has loaded.
+
+#### Example
+
+```javascript
+Adaptive.init();
+```
+
+---
+
+### `useVue(Vue: Object, hybrid: Boolean)`
+
+**Parameters**:
+
+-   `Vue` (Object): Vue instance.
+-   `hybrid` (Boolean): Allow support for both static and dynamic elements.
+
+**Returns**: `Vue`  
+**Description**: Configures the library for use with Vue.
+
+#### Example
+
+```javascript
+Adaptive.useVue(VueInstance, true);
+```
+
+---
+
+### `useReact(React: Object, hybrid: Boolean)`
+
+**Parameters**:
+
+-   `React` (Object): React instance.
+-   `hybrid` (Boolean): Allow support for both static and dynamic elements.
+
+**Returns**: `Void`  
+**Description**: Configures the library for use with React.
+
+#### Example
+
+```javascript
+Adaptive.useReact(ReactInstance, true);
+```
+
+<br/><br/>
+
+# Implementation examples <a name="implementation"></a>
+
 -   **Simple String** - It just teleports, does not specify breakpoints and location
@@ -124,0 +272,0 @@ `data-teleport="#hello"`

Fixed alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

1482768

increased by43.92%

Number of package files

40

increased by66.67%

Lines of code

36826

increased by33.98%

Number of lines in readme file

774

increased by23.64%

Number of medium supply chain risk alerts

0

decreased by-100%

No dependency changes