toaststrap - npm Package Compare versions

		@@ -1,13 +0,10 @@
		import { POSITION, TYPES } from "./prefrences";
		import ToastFactory from "./ToastFactory";
		import { OptionsType } from "./types";
		import Toaststrap from "./Toaststrap";
		import type { OptionsType } from "./types";
		import "./assets/styles.scss";
		declare global {
		interface Window {
		toastsrap: (options: OptionsType) => ToastFactory;
		toastsrap_type: any;
		toastsrap_position: any;
		toaststrap: (options: OptionsType) => Toaststrap;
		toaststrap_position: any;
		toaststrap_type: any;
		}
		}
		declare const initialize: (options: OptionsType) => ToastFactory;
		export { initialize, POSITION, TYPES };

lib/cjs/browser.js

		@@ -17,19 +17,21 @@ "use strict";
		Object.defineProperty(exports, "__esModule", { value: true });
		exports.TYPES = exports.POSITION = exports.initialize = void 0;
		var prefrences_1 = require("./prefrences");
		Object.defineProperty(exports, "POSITION", { enumerable: true, get: function () { return prefrences_1.POSITION; } });
		Object.defineProperty(exports, "TYPES", { enumerable: true, get: function () { return prefrences_1.TYPES; } });
		var ToastFactory_1 = __importDefault(require("./ToastFactory"));
		var sound_wav_1 = __importDefault(require("./assets/sound.wav"));
		var Toaststrap_1 = __importDefault(require("./Toaststrap"));
		var preferences_1 = require("./preferences");
		require("./assets/styles.scss");
		// Types
		window.toastsrap_type = prefrences_1.TYPES;
		window.toastsrap_position = prefrences_1.POSITION;
		var initialize = window.toastsrap = function (options) {
		if (!options.soundSource \|\| options.soundSource.length === 0) {
		options.soundSource = sound_wav_1.default;
		var typecheck_1 = __importDefault(require("./typecheck"));
		/**
		*
		* @param {OptionsType} options
		*/
		var initialize = function (options) {
		// Type checks.
		if (Object.keys(options).length) {
		(0, typecheck_1.default)(options);
		}
		return new ToastFactory_1.default(__assign({}, options));
		return new Toaststrap_1.default(__assign({}, options));
		};
		exports.initialize = initialize;
		// Window
		window.toaststrap = initialize;
		window.toaststrap_position = preferences_1.POSITIONS;
		window.toaststrap_type = preferences_1.TYPES;
		//# sourceMappingURL=browser.js.map

lib/cjs/helpers.d.ts

		declare const hasClass: (element: Element, className: string) => boolean;
		declare const getHumanTime: (datetime: string) => string;
		/**
		* Quick fix of boolean
		* @see https://stackoverflow.com/questions/44024193/typescript-string-to-boolean
		*/
		declare const toBoolean: (value?: string \| boolean \| undefined) => boolean;
		export { hasClass, getHumanTime, toBoolean };
		export { hasClass };

lib/cjs/helpers.js

		"use strict";
		var __importDefault = (this && this.__importDefault) \|\| function (mod) {
		return (mod && mod.__esModule) ? mod : { "default": mod };
		};
		Object.defineProperty(exports, "__esModule", { value: true });
		exports.toBoolean = exports.getHumanTime = exports.hasClass = void 0;
		var dayjs_1 = __importDefault(require("dayjs"));
		exports.hasClass = void 0;
		var hasClass = function (element, className) {
		@@ -12,29 +8,2 @@ return element.classList.contains(className);
		exports.hasClass = hasClass;
		var getHumanTime = function (datetime) {
		return (0, dayjs_1.default)(datetime).fromNow();
		};
		exports.getHumanTime = getHumanTime;
		/**
		* Quick fix of boolean
		* @see https://stackoverflow.com/questions/44024193/typescript-string-to-boolean
		*/
		var toBoolean = function (value) {
		if (typeof value === "boolean") {
		return value;
		}
		if (!value) {
		//Could also throw an exception up to you
		return false;
		}
		switch (value.toLocaleLowerCase()) {
		case "true":
		case "1":
		case "on":
		case "yes":
		return true;
		default:
		return false;
		}
		};
		exports.toBoolean = toBoolean;
		//# sourceMappingURL=helpers.js.map

lib/cjs/index.d.ts

		@@ -1,6 +0,12 @@
		import ToastFactory from "./ToastFactory";
		import Toaststrap from "./Toaststrap";
		import { OptionsType } from "./types";
		import { POSITION, TYPES } from "./prefrences";
		export declare const ToastType: typeof TYPES;
		export declare const ToastPosition: typeof POSITION;
		export default function (options: OptionsType): ToastFactory;
		import { POSITIONS, TYPES } from "./preferences";
		export { POSITIONS as ToastPositions, TYPES as ToastTypes };
		/**
		* A simple, lightweight library for showing Bootstrap 5 toasts.
		*
		* @version 1.0.2
		*
		* @packageDocumentation
		*/
		export default function (options: OptionsType): Toaststrap;

lib/cjs/index.js

		@@ -6,11 +6,18 @@ "use strict";
		Object.defineProperty(exports, "__esModule", { value: true });
		exports.ToastPosition = exports.ToastType = void 0;
		var ToastFactory_1 = __importDefault(require("./ToastFactory"));
		var prefrences_1 = require("./prefrences");
		exports.ToastType = prefrences_1.TYPES;
		exports.ToastPosition = prefrences_1.POSITION;
		exports.ToastTypes = exports.ToastPositions = void 0;
		var Toaststrap_1 = __importDefault(require("./Toaststrap"));
		var preferences_1 = require("./preferences");
		Object.defineProperty(exports, "ToastPositions", { enumerable: true, get: function () { return preferences_1.POSITIONS; } });
		Object.defineProperty(exports, "ToastTypes", { enumerable: true, get: function () { return preferences_1.TYPES; } });
		/**
		* A simple, lightweight library for showing Bootstrap 5 toasts.
		*
		* @version 1.0.2
		*
		* @packageDocumentation
		*/
		function default_1(options) {
		return new ToastFactory_1.default(options);
		return new Toaststrap_1.default(options);
		}
		exports.default = default_1;
		//# sourceMappingURL=index.js.map

lib/esm/browser.d.ts

		@@ -1,13 +0,10 @@
		import { POSITION, TYPES } from "./prefrences";
		import ToastFactory from "./ToastFactory";
		import { OptionsType } from "./types";
		import Toaststrap from "./Toaststrap";
		import type { OptionsType } from "./types";
		import "./assets/styles.scss";
		declare global {
		interface Window {
		toastsrap: (options: OptionsType) => ToastFactory;
		toastsrap_type: any;
		toastsrap_position: any;
		toaststrap: (options: OptionsType) => Toaststrap;
		toaststrap_position: any;
		toaststrap_type: any;
		}
		}
		declare const initialize: (options: OptionsType) => ToastFactory;
		export { initialize, POSITION, TYPES };

lib/esm/browser.js

		@@ -12,16 +12,21 @@ var __assign = (this && this.__assign) \|\| function () {
		};
		import { POSITION, TYPES } from "./prefrences";
		import ToastFactory from "./ToastFactory";
		import notificationSound from "./assets/sound.wav";
		import Toaststrap from "./Toaststrap";
		import { POSITIONS, TYPES } from "./preferences";
		import "./assets/styles.scss";
		// Types
		window.toastsrap_type = TYPES;
		window.toastsrap_position = POSITION;
		var initialize = window.toastsrap = function (options) {
		if (!options.soundSource \|\| options.soundSource.length === 0) {
		options.soundSource = notificationSound;
		import filters from "./typecheck";
		/**
		*
		* @param {OptionsType} options
		*/
		var initialize = function (options) {
		// Type checks.
		if (Object.keys(options).length) {
		filters(options);
		}
		return new ToastFactory(__assign({}, options));
		return new Toaststrap(__assign({}, options));
		};
		export { initialize, POSITION, TYPES };
		// Window
		window.toaststrap = initialize;
		window.toaststrap_position = POSITIONS;
		window.toaststrap_type = TYPES;
		//# sourceMappingURL=browser.js.map

lib/esm/helpers.d.ts

		declare const hasClass: (element: Element, className: string) => boolean;
		declare const getHumanTime: (datetime: string) => string;
		/**
		* Quick fix of boolean
		* @see https://stackoverflow.com/questions/44024193/typescript-string-to-boolean
		*/
		declare const toBoolean: (value?: string \| boolean \| undefined) => boolean;
		export { hasClass, getHumanTime, toBoolean };
		export { hasClass };

lib/esm/helpers.js

		@@ -1,31 +0,5 @@
		import dayjs from "dayjs";
		var hasClass = function (element, className) {
		return element.classList.contains(className);
		};
		var getHumanTime = function (datetime) {
		return dayjs(datetime).fromNow();
		};
		/**
		* Quick fix of boolean
		* @see https://stackoverflow.com/questions/44024193/typescript-string-to-boolean
		*/
		var toBoolean = function (value) {
		if (typeof value === "boolean") {
		return value;
		}
		if (!value) {
		//Could also throw an exception up to you
		return false;
		}
		switch (value.toLocaleLowerCase()) {
		case "true":
		case "1":
		case "on":
		case "yes":
		return true;
		default:
		return false;
		}
		};
		export { hasClass, getHumanTime, toBoolean };
		export { hasClass };
		//# sourceMappingURL=helpers.js.map

lib/esm/index.d.ts

		@@ -1,6 +0,12 @@
		import ToastFactory from "./ToastFactory";
		import Toaststrap from "./Toaststrap";
		import { OptionsType } from "./types";
		import { POSITION, TYPES } from "./prefrences";
		export declare const ToastType: typeof TYPES;
		export declare const ToastPosition: typeof POSITION;
		export default function (options: OptionsType): ToastFactory;
		import { POSITIONS, TYPES } from "./preferences";
		export { POSITIONS as ToastPositions, TYPES as ToastTypes };
		/**
		* A simple, lightweight library for showing Bootstrap 5 toasts.
		*
		* @version 1.0.2
		*
		* @packageDocumentation
		*/
		export default function (options: OptionsType): Toaststrap;

lib/esm/index.js

		@@ -1,8 +0,14 @@
		import ToastFactory from "./ToastFactory";
		import { POSITION, TYPES } from "./prefrences";
		export var ToastType = TYPES;
		export var ToastPosition = POSITION;
		import Toaststrap from "./Toaststrap";
		import { POSITIONS, TYPES } from "./preferences";
		export { POSITIONS as ToastPositions, TYPES as ToastTypes };
		/**
		* A simple, lightweight library for showing Bootstrap 5 toasts.
		*
		* @version 1.0.2
		*
		* @packageDocumentation
		*/
		export default function (options) {
		return new ToastFactory(options);
		return new Toaststrap(options);
		}
		//# sourceMappingURL=index.js.map

package.json

		{
		"name": "toaststrap",
		"version": "1.0.0-beta-1",
		"description": "A javaScript library for simple, lightweight toast popups. Uses Bootstrap 5 styles.",
		"version": "1.1.0",
		"description": "A simple, lightweight JavaScript library for showing Bootstrap 5 toast popups.",
		"main": "./lib/cjs/index.js",
		@@ -9,22 +9,21 @@ "module": "./lib/esm/index.js",
		"scripts": {
		"dev": "webpack --watch --mode development",
		"production": "npm run build:esm && npm run build:cjs && npm run build:bundle",
		"dev": "yarn build:esm && yarn build:cjs && yarn build:bundle-dev",
		"prod": "npm run build:esm && npm run build:cjs && npm run build:bundle",
		"build:esm": "tsc",
		"build:cjs": "tsc --module commonjs --outDir ./lib/cjs",
		"build:bundle": "webpack --mode production",
		"build:bundle-dev": "webpack --mode development"
		"build:bundle-dev": "webpack --watch --mode development",
		"test": "jest",
		"coverage": "jest --coverage"
		},
		"keywords": [
		"bootstrap",
		"5",
		"toast",
		"toast",
		"toaster",
		"bootstrap5-toaster",
		"bs5-toaster",
		"bootstrap",
		"bootstrap",
		"5",
		"bootstrap5",
		"toaststrap"
		"bootstrap5-toastsr",
		"bs5-toast",
		"bs5-toastr",
		"toast-bootstrap",
		"toast-bs5",
		"toastjs",
		"toast-js",
		"javascript",
		"ts-toast"
		],
		@@ -42,14 +41,16 @@ "author": "Nawaf Khalifah",
		},
		"fnding": [
		{
		"type": "ko-fi",
		"url": "https://ko-fi.com/nawafinity"
		}
		],
		"devDependencies": {
		"@rollup/plugin-commonjs": "^21.0.1",
		"@rollup/plugin-node-resolve": "^13.0.6",
		"@rollup/plugin-typescript": "^8.3.0",
		"@types/node": "^16.11.9",
		"@types/uuid": "^8.3.1",
		"browserify": "^17.0.0",
		"css-loader": "^6.5.0",
		"file-loader": "^6.2.0",
		"jsdoc-plugin-typescript": "^2.0.6",
		"mini-css-extract-plugin": "^2.4.3",
		"prettier": "2.4.1",
		"rollup-plugin-node-resolve": "^5.2.0",
		"rollup-plugin-polyfill-node": "^0.7.0",
		"sass": "^1.43.4",
		@@ -65,9 +66,12 @@ "sass-loader": "^12.3.0",
		"dependencies": {
		"@types/jest": "^27.0.3",
		"dayjs": "^1.10.7",
		"moment": "^2.29.1",
		"jest": "^27.3.1",
		"ts-jest": "^27.0.7",
		"uuid": "^8.3.2"
		},
		"files": [
		"/lib"
		"/lib",
		"/bundle"
		]
		}
		}

133

README.md

		@@ -1,121 +0,66 @@
		<p align="center">
		<img width="200" src="docs/logo.png">
		</p>

		<h1 align="center">Toastsrap</h1>
		<p align="center">
		<img width="200" src="./docs/logo.svg" alt="Toaststrap v1.1.0">
		</p>

		<div align="center">
		<h1 align="center">Toaststrap</h1>

		Toaststrap is a javascript library for simple, lightweight toast popups. It uses bootstrap 5 styles.
		<div align="center">

		Toaststrap is a simple, lightweight JavaScript library for showing Bootstrap 5 toast popups.

		</div>
		[العربية](./README-ar.md)
		[Changelog](./CHANGELOG.md)

		<div align="center">

		[العربية](./README-ar.md)

		<!-- BADGES/ -->
		<span class="badge-npmversion"><a href="https://npmjs.org/package/toaststrap" title="View this project on NPM"><img src="https://img.shields.io/npm/v/toaststrap.svg" alt="NPM version" /></a></span>
		<span class="badge-npmdownloads"><a href="https://npmjs.org/package/toaststrap" title="View this project on NPM"><img src="https://img.shields.io/npm/dm/toaststrap.svg" alt="NPM downloads" /></a></span>
		<span class="badge-npmdownloads"><a href="https://npmjs.org/package/toaststrap" title="View this project on NPM"><img src="https://img.shields.io/npm/dw/toaststrap.svg" alt="NPM downloads" /></a></span>
		<br class="badge-separator" />
		<span class="badge-githubsponsors"><a href="https://github.com/sponsors/nawafscript" title="Donate to this project using GitHub Sponsors"><img src="https://img.shields.io/badge/github-donate-blue.svg" alt="GitHub Sponsors donate button" /></a></span>
		<span class="badge-githubsponsors"><a href="https://ko-fi.com/nawafinity" title="Donate to this project using GitHub Sponsors"><img src="https://img.shields.io/badge/Ko--fi-donate-%23ff69b4" alt="GitHub Sponsors donate button" /></a></span>
		<!-- /BADGES -->
		</div>




		## Preview

		I created this library for everyone who use Bootstrap5 and want to show some beautiful notifications for his users.
		I created this library for everyone who uses Bootstrap 5 and wants to show some beautiful notifications for his users.

		## Features
		- [x] Pure JavaScript without jQuery.
		- [x] 🇸🇦 RTL support.
		- [x] Easy to initialize and use.
		- [x] 🆙 Support sound.
		- [x] Quick and efficient.
		- [x] 🎨 Customizable.
		- [x] 🆙 Maintainable and up-to-date.

		- ✅ Pure JavaScript without jQuery.
		- 🇸🇦 RTL support.
		- ✅ Support hooks.
		- ✅ Easy to initialize and use.
		- 🔉 Support sound.
		- 🌈 Quick and efficient.
		- 🎨 Customizable.
		- 🆙 up-to-date.


		## Documentation

		## Using in browser
		1. Download dist folder from this repository.
		2. Be sure you are using the latest bootstrap 5.
		Check the [Documentation](https://nawafscript.github.io/toaststrap/docs) to get you started!

		### Example
		```html
		<!DOCTYPE html>
		## Demo

		<!-- To use RTL, add dir="rtl" attribute to <html> tag. -->
		<html>
		<head>
		<link href="bootstrap/bootstrap.min.css" rel="stylesheet" media="all "/>
		<link href="toastsrap/toastsrap.css" rel="stylesheet" media="all "/>
		</head>
		Have fun with Toaststrap's [Initializer](https://nawafscript.github.io/toaststrap/Initializer)!

		<body>
		## Contribute
		Show your ❤️ and support by giving a ⭐. Any suggestions are welcome!

		<script src="toastsrap/toastsrap.js"></script>
		<script>
		var toast = Toastsrap.initialize({
		title: 'Greeting',
		text: 'Hello World',
		type: window.toastsrap_type.INFO,
		position: window.toastsrap_position.BOTTOM_START
		});

		toast.show();
		</script>
		</body>
		</html>
		```

		## Using with react
		```shell
		npm install toaststrap
		```

		### Example
		```javascript
		import Toast, {ToastType, ToastPosition} from 'toastsrap';
		## Sponsor
		<a href="https://ko-fi.com/nawafinity" target="_blank">
		<img src="docs/sponsor.png" />
		</a>

		// Load Styles
		import 'toastsrap/dist/bootstrap5-toast.css'

		const MyToastComponent = () => {
		const handleOnClick = () => {
		const toast = Toast.initialize({
		title: 'Greeting!',
		text: 'Hello World',
		position: ToastPosition.TOP_END,
		type: ToastType.PRIMARY
		})

		toast.show()
		}
		return (<button onClick={handleOnClick}>Click Me</button>)
		}
		```
		## Bugs and feature requests
		Found a bug or have a feature request? [Please open a new issue](https://github.com/nawafscript/toaststrap/issues)

		## Setup development environment
		## License

		1. Clone the project
		```shell
		git clone https://github.com/nawafscript/toastsrap.git
		```
		2. Install packages
		```shell
		npm install
		```
		3. Start development server
		```shell
		npm run dev
		```


		## Be a sponsor
		<a href="https://ko-fi.com/nawafinity" target="_blank">
		<img src="docs/sponsor.png" />
		</a>


		## Bugs and feature requests
		Found a bug or have a feature request? [Please open a new issue](https://github.com/nawafscript/toaststrap/issues)
		Licensed under MIT

lib/cjs/prefrences.d.ts

lib/cjs/prefrences.js

lib/cjs/prefrences.js.map

lib/cjs/support/body.d.ts

lib/cjs/support/body.js

lib/cjs/support/body.js.map

lib/cjs/support/container.d.ts

lib/cjs/support/container.js

lib/cjs/support/container.js.map

lib/cjs/support/header.d.ts

lib/cjs/support/header.js

lib/cjs/support/header.js.map

lib/cjs/support/progress.d.ts

lib/cjs/support/progress.js

lib/cjs/support/progress.js.map

lib/cjs/support/sound.d.ts

lib/cjs/support/sound.js

lib/cjs/support/sound.js.map

lib/cjs/ToastFactory.d.ts

lib/cjs/ToastFactory.js

lib/cjs/ToastFactory.js.map

lib/cjs/types.d.ts

lib/cjs/types.js

lib/cjs/types.js.map

lib/esm/prefrences.d.ts

lib/esm/prefrences.js

lib/esm/prefrences.js.map

lib/esm/support/body.d.ts

lib/esm/support/body.js

lib/esm/support/body.js.map

lib/esm/support/container.d.ts

lib/esm/support/container.js

lib/esm/support/container.js.map

lib/esm/support/header.d.ts

lib/esm/support/header.js

lib/esm/support/header.js.map

lib/esm/support/progress.d.ts

lib/esm/support/progress.js

lib/esm/support/progress.js.map

lib/esm/support/sound.d.ts

lib/esm/support/sound.js

lib/esm/support/sound.js.map

lib/esm/ToastFactory.d.ts

lib/esm/ToastFactory.js

lib/esm/ToastFactory.js.map

lib/esm/types.d.ts

lib/esm/types.js

lib/esm/types.js.map

lib/cjs/browser.js.map