Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
adwaveui - npm Package Compare versions
Comparing version 0.0.2 to 0.0.3
| { | ||
| "name": "adwaveui", | ||
| "version": "0.0.2", | ||
| "version": "0.0.3", | ||
| "main": "./dist/esm/index.js", | ||
@@ -28,12 +28,24 @@ "types": "./dist/types/index.d.ts", | ||
| }, | ||
| "keywords": [], | ||
| "keywords": [ | ||
| "adwaita", | ||
| "libadwaita", | ||
| "gnome", | ||
| "gtk", | ||
| "ui", | ||
| "css", | ||
| "web components", | ||
| "input", | ||
| "selector", | ||
| "slider", | ||
| "switch" | ||
| ], | ||
| "repository": { | ||
| "type": "git", | ||
| "url": "" | ||
| "url": "https://github.com/ncpa0/ADWaveUI" | ||
| }, | ||
| "description": "", | ||
| "description": "Interactive Web Components inspired by the Gtk Adwaita theme.", | ||
| "license": "MIT", | ||
| "author": { | ||
| "name": "Szymon Bretner", | ||
| "email": "" | ||
| "email": "szymonb21@gmail.com" | ||
| }, | ||
@@ -44,20 +56,21 @@ "scripts": { | ||
| "test:tsc": "tsc --noEmit", | ||
| "build": "node ./scripts/build.mjs" | ||
| "build": "node ./scripts/build.mjs", | ||
| "prepare": "husky install" | ||
| }, | ||
| "packageManager": "yarn@1.22.19", | ||
| "devDependencies": { | ||
| "@ncpa0cpl/nodepack": "^2.3.0", | ||
| "@ncpa0cpl/nodepack": "^2.3.2", | ||
| "csso": "^5.0.5", | ||
| "esbuild": "^0.19.2", | ||
| "git-hook-tasks": "ncpa0cpl/git-hook-tasks", | ||
| "esbuild": "^0.20.0", | ||
| "git-hook-tasks": "git+https://github.com/ncpa0cpl/git-hook-tasks#0.0.1", | ||
| "husky": "^8.0.3", | ||
| "prettier": "^3.0.2", | ||
| "prettier-plugin-jsdoc": "^1.0.1", | ||
| "typescript": "^5.2.2" | ||
| "prettier": "^3.2.5", | ||
| "prettier-plugin-jsdoc": "^1.3.0", | ||
| "typescript": "^5.3.3" | ||
| }, | ||
| "dependencies": { | ||
| "adwavecss": "^0.0.4", | ||
| "jsxte": "^3.1.6", | ||
| "jsxte-wc": "^1.1.5" | ||
| "jsxte": "^3.3.0", | ||
| "jsxte-wc": "^1.1.5", | ||
| "adwavecss": ">0.0.4" | ||
| } | ||
| } |
108
README.md
| <p align="center"> | ||
| <h1 align="center">ADWave UI</h1> | ||
| <p align="center"> | ||
| Web Components inspired by the Gtk's Adwaita theme. | ||
| </p> | ||
| <p align="center"> | ||
| <a href="https://ncpa0.github.io/adwave-docs/"> | ||
@@ -9,1 +12,106 @@ Examples | ||
| </p> | ||
| ## Components | ||
| 1. [Input](#input) | ||
| 2. [Selector](#selector) | ||
| 3. [Slider](#slider) | ||
| 4. [Switch](#switch) | ||
| ## Input | ||
| ```html | ||
| <adw-input | ||
| placeholder="Put in your name" | ||
| ></adw-input> | ||
| ``` | ||
| ### Properties | ||
| | Property | Description | Default | | ||
| |-------------------------|-----------------------------------------------------------------------------|---------| | ||
| | `disabled` | If the input is disabled or not. | "false" | | ||
| | `form` | The form the input belongs to. | | | ||
| | `maxlength` | The maximum length of the input. | | | ||
| | `minlength` | The minimum length of the input. | | | ||
| | `name` | The name of the input, used when submitting a form. | | | ||
| | `placeholder` | Text displayed when the input is empty. | | | ||
| | `suggestions` | List of suggested strings to display when the input is focused. | | | ||
| | `suggestionsorientation`| Determines whether the list of suggestions appears above or below the input field. `up` or `down`. | "down" | | ||
| | `suggestionsshowall` | Set to "true" to always display all the suggestions. | "false" | | ||
| | `fuzzy` | When set to "true" the suggestions will be filtered using a fuzzy search algorithm as the user types. By default filtering is done using a simple string match. | | | ||
| | `type` | The type of the input. (text, password, email, etc.) | "text" | | ||
| | `value` | The current value of the input. | | | ||
| ## Selector | ||
| ```html | ||
| <adw-selector placeholder="Select option"> | ||
| <adw-option value="1" selected="true"> | ||
| Option 1 | ||
| </adw-option> | ||
| <adw-option value="2"> | ||
| Option 2 | ||
| </adw-option> | ||
| <adw-option value="3"> | ||
| Option 3 | ||
| </adw-option> | ||
| </adw-selector> | ||
| ``` | ||
| ### Properties | ||
| | Property | Description | Default | | ||
| |-------------------------|-----------------------------------------------------------------------------|---------| | ||
| | `disabled` | If the selector is disabled or not. | "false" | | ||
| | `form` | The form the selector belongs to. | | | ||
| | `name` | The name of the selector, used when submitting a form. | | | ||
| | `orientation` | Determines whether the list of options appears above or below the selector. `up` or `down`. | "down" | | ||
| | `placeholder` | Text displayed when no option is selected. | | | ||
| ### adw-option properties | ||
| | Property | Description | Default | | ||
| |-------------------------|-----------------------------------------------------------------------------|---------| | ||
| | `selected` | If the option is selected or not. | "false" | | ||
| | `value` | The value of the option. | | | ||
| ## Slider | ||
| ```html | ||
| <adw-slider | ||
| min="0" | ||
| max="100" | ||
| value="50" | ||
| ></adw-slider> | ||
| ``` | ||
| ### Properties | ||
| | Property | Description | Default | | ||
| |-------------------------|-----------------------------------------------------------------------------|---------| | ||
| | `disabled` | If the slider is disabled or not. | "false" | | ||
| | `form` | The form the slider belongs to. | | | ||
| | `max` | The maximum value on the slider. | 100 | | ||
| | `min` | The minimum value on the slider. | 0 | | ||
| | `name` | The name of the slider, used when submitting a form. | | | ||
| | `precision` | The number of decimal places to round the value to. | 4 | | ||
| | `step` | The amount to increment or decrement the value by when moving the slider. | 1 | | ||
| | `value` | The current value of the slider. | | | ||
| ## Switch | ||
| ```html | ||
| <adw-switch | ||
| active="true" | ||
| ></adw-switch> | ||
| ``` | ||
| ### Properties | ||
| | Property | Description | Default | | ||
| |-------------------------|-----------------------------------------------------------------------------|---------| | ||
| | `disabled` | If the switch is disabled or not. | | | ||
| | `form` | The form the switch belongs to. | | | ||
| | `name` | The name of the switch, used when submitting a form. | | | ||
| | `active` | If the switch is active or not. | "false" | |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
No repository
Supply chain riskPackage does not have a linked source code repository. Without this field, a package will have no reference to the location of the source code use to generate the package.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
- increased by5.96%
102385
- Number of lines in readme file
- increased by1188.89%
116
- Number of low supply chain risk alerts
- decreased by-100%
0
Worsened metrics
- Number of package files
- decreased by-2.56%
38
- Lines of code
- decreased by-0.58%
2418
Dependency changes
+ Addedadwavecss@0.1.1(transitive)
- Removedadwavecss@0.0.4(transitive)
Updatedadwavecss@>0.0.4
Updatedjsxte@^3.3.0