@amiceli/papierjs 0.6.0 → 0.8.0

package/dist/types/components.d.ts

@@ -5,6 +5,8 @@
  * It contains typing information for all components that exist in this project.
  */
 import { HTMLStencilElement, JSXBase } from "./stencil-public-runtime";
+import { PushOptions } from "./components/notification/p-notification-handler/p-notification-handler";
+export { PushOptions } from "./components/notification/p-notification-handler/p-notification-handler";
 export namespace Components {
     interface PAccordion {
         "open": boolean;
@@ -58,11 +60,16 @@ export namespace Components {
     }
     interface PDropdownPreview {
     }
+    interface PIcon {
+        "color": string;
+        "icon": string;
+        "size": number;
+    }
     interface PInputText {
         "block"?: boolean;
         "dark"?: boolean;
         "disabled"?: boolean;
-        "hasError"?: boolean;
+        "error"?: string;
         "label"?: string;
         "placeholder"?: string;
         "required"?: boolean;
@@ -78,7 +85,19 @@ export namespace Components {
     interface PModalPreview {
         "title"?: boolean;
     }
+    interface PNotification {
+        "canclose": boolean;
+        "text": string;
+        "timestamp": string;
+        "type"?: string;
+    }
+    interface PNotificationHandler {
+        "pushNotification": (options: PushOptions) => Promise<void>;
+    }
+    interface PNotificationPreview {
+    }
     interface PProgressBar {
+        "auto"?: number;
         "dark"?: boolean;
         "striped"?: boolean;
         "type"?: ProgressBarColor;
@@ -149,6 +168,10 @@ export interface PModalCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLPModalElement;
 }
+export interface PNotificationCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLPNotificationElement;
+}
 export interface PSliderCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLPSliderElement;
@@ -249,8 +272,15 @@ declare global {
         prototype: HTMLPDropdownPreviewElement;
         new (): HTMLPDropdownPreviewElement;
     };
+    interface HTMLPIconElement extends Components.PIcon, HTMLStencilElement {
+    }
+    var HTMLPIconElement: {
+        prototype: HTMLPIconElement;
+        new (): HTMLPIconElement;
+    };
     interface HTMLPInputTextElementEventMap {
         "change": string;
+        "input": string;
     }
     interface HTMLPInputTextElement extends Components.PInputText, HTMLStencilElement {
         addEventListener<K extends keyof HTMLPInputTextElementEventMap>(type: K, listener: (this: HTMLPInputTextElement, ev: PInputTextCustomEvent<HTMLPInputTextElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
@@ -295,6 +325,35 @@ declare global {
         prototype: HTMLPModalPreviewElement;
         new (): HTMLPModalPreviewElement;
     };
+    interface HTMLPNotificationElementEventMap {
+        "close": string;
+    }
+    interface HTMLPNotificationElement extends Components.PNotification, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLPNotificationElementEventMap>(type: K, listener: (this: HTMLPNotificationElement, ev: PNotificationCustomEvent<HTMLPNotificationElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLPNotificationElementEventMap>(type: K, listener: (this: HTMLPNotificationElement, ev: PNotificationCustomEvent<HTMLPNotificationElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLPNotificationElement: {
+        prototype: HTMLPNotificationElement;
+        new (): HTMLPNotificationElement;
+    };
+    interface HTMLPNotificationHandlerElement extends Components.PNotificationHandler, HTMLStencilElement {
+    }
+    var HTMLPNotificationHandlerElement: {
+        prototype: HTMLPNotificationHandlerElement;
+        new (): HTMLPNotificationHandlerElement;
+    };
+    interface HTMLPNotificationPreviewElement extends Components.PNotificationPreview, HTMLStencilElement {
+    }
+    var HTMLPNotificationPreviewElement: {
+        prototype: HTMLPNotificationPreviewElement;
+        new (): HTMLPNotificationPreviewElement;
+    };
     interface HTMLPProgressBarElement extends Components.PProgressBar, HTMLStencilElement {
     }
     var HTMLPProgressBarElement: {
@@ -380,10 +439,14 @@ declare global {
         "p-dropdown": HTMLPDropdownElement;
         "p-dropdown-item": HTMLPDropdownItemElement;
         "p-dropdown-preview": HTMLPDropdownPreviewElement;
+        "p-icon": HTMLPIconElement;
         "p-input-text": HTMLPInputTextElement;
         "p-leaf": HTMLPLeafElement;
         "p-modal": HTMLPModalElement;
         "p-modal-preview": HTMLPModalPreviewElement;
+        "p-notification": HTMLPNotificationElement;
+        "p-notification-handler": HTMLPNotificationHandlerElement;
+        "p-notification-preview": HTMLPNotificationPreviewElement;
         "p-progress-bar": HTMLPProgressBarElement;
         "p-slider": HTMLPSliderElement;
         "p-switch": HTMLPSwitchElement;
@@ -449,13 +512,19 @@ declare namespace LocalJSX {
     }
     interface PDropdownPreview {
     }
+    interface PIcon {
+        "color"?: string;
+        "icon"?: string;
+        "size"?: number;
+    }
     interface PInputText {
         "block"?: boolean;
         "dark"?: boolean;
         "disabled"?: boolean;
-        "hasError"?: boolean;
+        "error"?: string;
         "label"?: string;
         "onChange"?: (event: PInputTextCustomEvent<string>) => void;
+        "onInput"?: (event: PInputTextCustomEvent<string>) => void;
         "placeholder"?: string;
         "required"?: boolean;
         "value"?: string;
@@ -469,7 +538,19 @@ declare namespace LocalJSX {
     interface PModalPreview {
         "title"?: boolean;
     }
+    interface PNotification {
+        "canclose"?: boolean;
+        "onClose"?: (event: PNotificationCustomEvent<string>) => void;
+        "text"?: string;
+        "timestamp"?: string;
+        "type"?: string;
+    }
+    interface PNotificationHandler {
+    }
+    interface PNotificationPreview {
+    }
     interface PProgressBar {
+        "auto"?: number;
         "dark"?: boolean;
         "striped"?: boolean;
         "type"?: ProgressBarColor;
@@ -532,10 +613,14 @@ declare namespace LocalJSX {
         "p-dropdown": PDropdown;
         "p-dropdown-item": PDropdownItem;
         "p-dropdown-preview": PDropdownPreview;
+        "p-icon": PIcon;
         "p-input-text": PInputText;
         "p-leaf": PLeaf;
         "p-modal": PModal;
         "p-modal-preview": PModalPreview;
+        "p-notification": PNotification;
+        "p-notification-handler": PNotificationHandler;
+        "p-notification-preview": PNotificationPreview;
         "p-progress-bar": PProgressBar;
         "p-slider": PSlider;
         "p-switch": PSwitch;
@@ -558,10 +643,14 @@ declare module "@stencil/core" {
             "p-dropdown": LocalJSX.PDropdown & JSXBase.HTMLAttributes<HTMLPDropdownElement>;
             "p-dropdown-item": LocalJSX.PDropdownItem & JSXBase.HTMLAttributes<HTMLPDropdownItemElement>;
             "p-dropdown-preview": LocalJSX.PDropdownPreview & JSXBase.HTMLAttributes<HTMLPDropdownPreviewElement>;
+            "p-icon": LocalJSX.PIcon & JSXBase.HTMLAttributes<HTMLPIconElement>;
             "p-input-text": LocalJSX.PInputText & JSXBase.HTMLAttributes<HTMLPInputTextElement>;
             "p-leaf": LocalJSX.PLeaf & JSXBase.HTMLAttributes<HTMLPLeafElement>;
             "p-modal": LocalJSX.PModal & JSXBase.HTMLAttributes<HTMLPModalElement>;
             "p-modal-preview": LocalJSX.PModalPreview & JSXBase.HTMLAttributes<HTMLPModalPreviewElement>;
+            "p-notification": LocalJSX.PNotification & JSXBase.HTMLAttributes<HTMLPNotificationElement>;
+            "p-notification-handler": LocalJSX.PNotificationHandler & JSXBase.HTMLAttributes<HTMLPNotificationHandlerElement>;
+            "p-notification-preview": LocalJSX.PNotificationPreview & JSXBase.HTMLAttributes<HTMLPNotificationPreviewElement>;
             "p-progress-bar": LocalJSX.PProgressBar & JSXBase.HTMLAttributes<HTMLPProgressBarElement>;
             "p-slider": LocalJSX.PSlider & JSXBase.HTMLAttributes<HTMLPSliderElement>;
             "p-switch": LocalJSX.PSwitch & JSXBase.HTMLAttributes<HTMLPSwitchElement>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@amiceli/papierjs",
-  "version": "0.6.0",
+  "version": "0.8.0",
   "description": "Papercss web components",
   "main": "dist/index.cjs.js",
   "module": "dist/index.js",
@@ -40,8 +40,9 @@
     "loader/"
   ],
   "scripts": {
-    "build": "stencil build",
-    "build:watch": "stencil build --watch",
+    "build:icon": "node scripts/copy-svg.js",
+    "build": "npm run build:icon && stencil build",
+    "build:watch": "npm run build:icon && stencil build --watch",
     "start": "stencil build --dev --watch --serve",
     "test": "stencil test --spec --e2e",
     "test.watch": "stencil test --spec --e2e --watchAll",
@@ -71,6 +72,7 @@
     "jest": "^29.7.0",
     "jest-cli": "^29.7.0",
     "lefthook": "^1.10.10",
+    "stencil-inline-svg": "^1.1.0",
     "storybook": "^8.5.8"
   },
   "optionalDependencies": {
@@ -79,6 +81,7 @@
   "license": "MIT",
   "dependencies": {
     "feather-icons": "^4.29.2",
-    "papercss": "^1.9.2"
+    "papercss": "^1.9.2",
+    "pixelarticons": "^1.8.1"
   }
 }

package/readme.md

@@ -23,16 +23,17 @@ Available components:
 - [X] Modals
 - [X] Switch / Switch Tile
 - [ ] NavBar
-- [ ] Tabs
+- [X] Tabs
 - [X] Popover as tooltip
+- [X] Icon (with [pixelarticons](https://github.com/halfmage/pixelarticons))
 
 Component features :
-- [X] dropdown since `v0.1.0`
+- [X] dropdown since
 - [X] `p-leaf` allow to use papercss style anywhere
-- [ ] notification
+- [X] notification
 - [ ] spinner
 - [ ] password
-- [X] accordion since `v0.4.0`
+- [X] accordion
 
 ## Using papercss