@instincthub/react-ui 0.0.4 → 0.0.5

package/dist/src/assets/css/readme/overflow.md

@@ -1,93 +0,0 @@
-# InstinctHub CSS Overflow Utilities
-
-This document outlines the custom overflow utilities for InstinctHub's CSS framework, designed to provide consistent overflow behavior across the platform.
-
-## General Overflow Utilities
-
-These utilities control the overflow behavior in both directions (horizontal and vertical).
-
-| Class | Description |
-|-------|-------------|
-| `.ihub-overflow-auto` | Adds scrollbars only when content overflows |
-| `.ihub-overflow-hidden` | Clips content that overflows the element's box |
-| `.ihub-overflow-visible` | Content is not clipped when it overflows |
-| `.ihub-overflow-scroll` | Always displays scrollbars, even when content doesn't overflow |
-
-## Axis-Specific Overflow
-
-These utilities allow you to control overflow behavior on a specific axis.
-
-### Horizontal Overflow
-
-| Class | Description |
-|-------|-------------|
-| `.ihub-overflow-x-auto` | Adds horizontal scrollbar only when content overflows horizontally |
-| `.ihub-overflow-x-hidden` | Clips content that overflows horizontally |
-| `.ihub-overflow-x-scroll` | Always displays horizontal scrollbar |
-
-### Vertical Overflow
-
-| Class | Description |
-|-------|-------------|
-| `.ihub-overflow-y-auto` | Adds vertical scrollbar only when content overflows vertically |
-| `.ihub-overflow-y-hidden` | Clips content that overflows vertically |
-| `.ihub-overflow-y-scroll` | Always displays vertical scrollbar |
-
-## Scrollbar Styling
-
-Custom scrollbar styling for elements with overflow.
-
-| Class | Description |
-|-------|-------------|
-| `.ihub-scrollbar-thin` | Displays thin scrollbars (4px) with InstinctHub brand colors |
-| `.ihub-scrollbar-hidden` | Hides scrollbars while maintaining scroll functionality |
-
-## Usage Examples
-
-### Basic Container with Auto Overflow
-
-```html
-<div class="ihub-overflow-auto" style="max-height: 300px">
-  <!-- Content that might overflow -->
-</div>
-```
-
-### Horizontal Scrolling Container
-
-```html
-<div class="ihub-overflow-x-auto ihub-overflow-y-hidden">
-  <!-- Horizontally scrollable content -->
-</div>
-```
-
-### Custom Scrollbar Styling
-
-```html
-<div class="ihub-overflow-auto ihub-scrollbar-thin">
-  <!-- Content with custom-styled scrollbars -->
-</div>
-```
-
-### Hidden Scrollbars
-
-```html
-<div class="ihub-overflow-auto ihub-scrollbar-hidden">
-  <!-- Content with functional but invisible scrollbars -->
-</div>
-```
-
-## Implementation Notes
-
-- These utilities use CSS variables from InstinctHub's main theme
-- Compatible with all modern browsers
-- For Internet Explorer support, use polyfills or fallbacks
-- Follows the `ihub-` prefix convention for InstinctHub's component library
-
-## Integration with Existing Components
-
-When using these utilities with existing InstinctHub components, follow these guidelines:
-
-1. Apply overflow utilities to container elements rather than directly to components
-2. Use `ihub-overflow-hidden` on parent containers to prevent layout shifts
-3. For long content areas like course descriptions or lesson content, use `ihub-overflow-y-auto` with a defined height
-4. When creating horizontally scrolling galleries or carousels, use `ihub-overflow-x-auto ihub-overflow-y-hidden`

package/dist/src/assets/css/readme/width-height-padding.md

@@ -1,342 +0,0 @@
-# InstinctHub CSS Utilities Documentation
-
-This documentation covers the custom CSS utilities for width, height, and padding created specifically for InstinctHub's front-end framework.
-
-## Table of Contents
-
-1. [Width Utilities](#width-utilities)
-2. [Height Utilities](#height-utilities)
-3. [Padding Utilities](#padding-utilities)
-4. [Responsive Utilities](#responsive-utilities)
-5. [Usage Examples](#usage-examples)
-
-## Width Utilities
-
-Width utilities control the horizontal space an element occupies.
-
-### Fixed Widths
-
-Fixed width utilities set a specific pixel width to an element.
-
-| Class         | Description         |
-| ------------- | ------------------- |
-| `.ihub-w-1`   | Sets width to 1px   |
-| `.ihub-w-2`   | Sets width to 2px   |
-| `.ihub-w-4`   | Sets width to 4px   |
-| `.ihub-w-8`   | Sets width to 8px   |
-| `.ihub-w-16`  | Sets width to 16px  |
-| `.ihub-w-24`  | Sets width to 24px  |
-| `.ihub-w-32`  | Sets width to 32px  |
-| `.ihub-w-48`  | Sets width to 48px  |
-| `.ihub-w-64`  | Sets width to 64px  |
-| `.ihub-w-80`  | Sets width to 80px  |
-| `.ihub-w-96`  | Sets width to 96px  |
-| `.ihub-w-128` | Sets width to 128px |
-| `.ihub-w-200` | Sets width to 200px |
-| `.ihub-w-250` | Sets width to 250px |
-| `.ihub-w-300` | Sets width to 300px |
-| `.ihub-w-350` | Sets width to 350px |
-| `.ihub-w-400` | Sets width to 400px |
-| `.ihub-w-500` | Sets width to 500px |
-| `.ihub-w-600` | Sets width to 600px |
-| `.ihub-w-700` | Sets width to 700px |
-| `.ihub-w-800` | Sets width to 800px |
-
-### Percentage Widths
-
-Percentage-based width utilities set a width relative to the parent element.
-
-| Class          | Description              |
-| -------------- | ------------------------ |
-| `.ihub-w-25`   | Sets width to 25%        |
-| `.ihub-w-33`   | Sets width to 33.333333% |
-| `.ihub-w-50`   | Sets width to 50%        |
-| `.ihub-w-75`   | Sets width to 75%        |
-| `.ihub-w-100`  | Sets width to 100%       |
-| `.ihub-w-auto` | Sets width to auto       |
-
-### Maximum Widths
-
-Maximum width utilities constrain an element's width to a maximum value.
-
-| Class              | Description                  |
-| ------------------ | ---------------------------- |
-| `.ihub-max-w-300`  | Sets max-width to 300px      |
-| `.ihub-max-w-400`  | Sets max-width to 400px      |
-| `.ihub-max-w-500`  | Sets max-width to 500px      |
-| `.ihub-max-w-600`  | Sets max-width to 600px      |
-| `.ihub-max-w-700`  | Sets max-width to 700px      |
-| `.ihub-max-w-800`  | Sets max-width to 800px      |
-| `.ihub-max-w-900`  | Sets max-width to 900px      |
-| `.ihub-max-w-1000` | Sets max-width to 1000px     |
-| `.ihub-max-w-1200` | Sets max-width to 1200px     |
-| `.ihub-max-w-1400` | Sets max-width to 1400px     |
-| `.ihub-max-w-1600` | Sets max-width to 1600px     |
-| `.ihub-max-w-full` | Sets max-width to 100%       |
-| `.ihub-max-w-none` | Removes max-width constraint |
-
-## Height Utilities
-
-Height utilities control the vertical space an element occupies.
-
-### Fixed Heights
-
-Fixed height utilities set a specific pixel height to an element.
-
-| Class         | Description          |
-| ------------- | -------------------- |
-| `.ihub-h-1`   | Sets height to 1px   |
-| `.ihub-h-2`   | Sets height to 2px   |
-| `.ihub-h-4`   | Sets height to 4px   |
-| `.ihub-h-8`   | Sets height to 8px   |
-| `.ihub-h-16`  | Sets height to 16px  |
-| `.ihub-h-24`  | Sets height to 24px  |
-| `.ihub-h-32`  | Sets height to 32px  |
-| `.ihub-h-48`  | Sets height to 48px  |
-| `.ihub-h-64`  | Sets height to 64px  |
-| `.ihub-h-80`  | Sets height to 80px  |
-| `.ihub-h-96`  | Sets height to 96px  |
-| `.ihub-h-128` | Sets height to 128px |
-| `.ihub-h-200` | Sets height to 200px |
-| `.ihub-h-300` | Sets height to 300px |
-| `.ihub-h-400` | Sets height to 400px |
-| `.ihub-h-500` | Sets height to 500px |
-| `.ihub-h-600` | Sets height to 600px |
-
-### Percentage Heights
-
-Percentage-based height utilities set a height relative to the parent element.
-
-| Class            | Description                                 |
-| ---------------- | ------------------------------------------- |
-| `.ihub-h-25`     | Sets height to 25%                          |
-| `.ihub-h-33`     | Sets height to 33.333333%                   |
-| `.ihub-h-50`     | Sets height to 50%                          |
-| `.ihub-h-75`     | Sets height to 75%                          |
-| `.ihub-h-100`    | Sets height to 100%                         |
-| `.ihub-h-auto`   | Sets height to auto                         |
-| `.ihub-h-screen` | Sets height to 100vh (full viewport height) |
-
-### Maximum Heights
-
-Maximum height utilities constrain an element's height to a maximum value.
-
-| Class                | Description                   |
-| -------------------- | ----------------------------- |
-| `.ihub-max-h-200`    | Sets max-height to 200px      |
-| `.ihub-max-h-300`    | Sets max-height to 300px      |
-| `.ihub-max-h-400`    | Sets max-height to 400px      |
-| `.ihub-max-h-500`    | Sets max-height to 500px      |
-| `.ihub-max-h-600`    | Sets max-height to 600px      |
-| `.ihub-max-h-full`   | Sets max-height to 100%       |
-| `.ihub-max-h-screen` | Sets max-height to 100vh      |
-| `.ihub-max-h-none`   | Removes max-height constraint |
-
-### Minimum Heights
-
-Minimum height utilities set a minimum height for an element.
-
-| Class                | Description              |
-| -------------------- | ------------------------ |
-| `.ihub-min-h-0`      | Sets min-height to 0     |
-| `.ihub-min-h-100`    | Sets min-height to 100px |
-| `.ihub-min-h-200`    | Sets min-height to 200px |
-| `.ihub-min-h-300`    | Sets min-height to 300px |
-| `.ihub-min-h-400`    | Sets min-height to 400px |
-| `.ihub-min-h-500`    | Sets min-height to 500px |
-| `.ihub-min-h-full`   | Sets min-height to 100%  |
-| `.ihub-min-h-screen` | Sets min-height to 100vh |
-
-## Padding Utilities
-
-Padding utilities control the space between an element's content and its border.
-
-### All-Side Padding
-
-These utilities apply padding to all sides of an element.
-
-| Class        | Description           |
-| ------------ | --------------------- |
-| `.ihub-p-0`  | Sets padding to 0     |
-| `.ihub-p-1`  | Sets padding to 4px   |
-| `.ihub-p-2`  | Sets padding to 8px   |
-| `.ihub-p-3`  | Sets padding to 12px  |
-| `.ihub-p-4`  | Sets padding to 16px  |
-| `.ihub-p-5`  | Sets padding to 20px  |
-| `.ihub-p-6`  | Sets padding to 24px  |
-| `.ihub-p-8`  | Sets padding to 32px  |
-| `.ihub-p-10` | Sets padding to 40px  |
-| `.ihub-p-12` | Sets padding to 48px  |
-| `.ihub-p-16` | Sets padding to 64px  |
-| `.ihub-p-20` | Sets padding to 80px  |
-| `.ihub-p-24` | Sets padding to 96px  |
-| `.ihub-p-32` | Sets padding to 128px |
-
-### Directional Padding
-
-These utilities apply padding to specific sides of an element.
-
-#### Top Padding
-
-| Class                              | Description                        |
-| ---------------------------------- | ---------------------------------- |
-| `.ihub-pt-0`                       | Sets padding-top to 0              |
-| `.ihub-pt-1` through `.ihub-pt-32` | Sets padding-top from 4px to 128px |
-
-#### Right Padding
-
-| Class                              | Description                          |
-| ---------------------------------- | ------------------------------------ |
-| `.ihub-pr-0`                       | Sets padding-right to 0              |
-| `.ihub-pr-1` through `.ihub-pr-32` | Sets padding-right from 4px to 128px |
-
-#### Bottom Padding
-
-| Class                              | Description                           |
-| ---------------------------------- | ------------------------------------- |
-| `.ihub-pb-0`                       | Sets padding-bottom to 0              |
-| `.ihub-pb-1` through `.ihub-pb-32` | Sets padding-bottom from 4px to 128px |
-
-#### Left Padding
-
-| Class                              | Description                         |
-| ---------------------------------- | ----------------------------------- |
-| `.ihub-pl-0`                       | Sets padding-left to 0              |
-| `.ihub-pl-1` through `.ihub-pl-32` | Sets padding-left from 4px to 128px |
-
-### Horizontal & Vertical Padding
-
-These utilities apply padding to horizontal (left and right) or vertical (top and bottom) sides simultaneously.
-
-#### Horizontal Padding
-
-| Class                              | Description                               |
-| ---------------------------------- | ----------------------------------------- |
-| `.ihub-px-0`                       | Sets horizontal padding to 0              |
-| `.ihub-px-1` through `.ihub-px-32` | Sets horizontal padding from 4px to 128px |
-
-#### Vertical Padding
-
-| Class                              | Description                             |
-| ---------------------------------- | --------------------------------------- |
-| `.ihub-py-0`                       | Sets vertical padding to 0              |
-| `.ihub-py-1` through `.ihub-py-32` | Sets vertical padding from 4px to 128px |
-
-## Responsive Utilities
-
-These utilities apply different styles based on screen size.
-
-### Small Screen Utilities (max-width: 768px)
-
-| Class             | Description                                      |
-| ----------------- | ------------------------------------------------ |
-| `.ihub-sm-w-100`  | Sets width to 100% on small screens              |
-| `.ihub-sm-h-auto` | Sets height to auto on small screens             |
-| `.ihub-sm-p-2`    | Sets padding to 8px on small screens             |
-| `.ihub-sm-p-3`    | Sets padding to 12px on small screens            |
-| `.ihub-sm-p-4`    | Sets padding to 16px on small screens            |
-| `.ihub-sm-py-2`   | Sets vertical padding to 8px on small screens    |
-| `.ihub-sm-py-3`   | Sets vertical padding to 12px on small screens   |
-| `.ihub-sm-px-2`   | Sets horizontal padding to 8px on small screens  |
-| `.ihub-sm-px-3`   | Sets horizontal padding to 12px on small screens |
-
-### Medium Screen Utilities (769px - 1024px)
-
-| Class            | Description                                       |
-| ---------------- | ------------------------------------------------- |
-| `.ihub-md-w-50`  | Sets width to 50% on medium screens               |
-| `.ihub-md-w-75`  | Sets width to 75% on medium screens               |
-| `.ihub-md-w-100` | Sets width to 100% on medium screens              |
-| `.ihub-md-p-4`   | Sets padding to 16px on medium screens            |
-| `.ihub-md-p-5`   | Sets padding to 20px on medium screens            |
-| `.ihub-md-py-4`  | Sets vertical padding to 16px on medium screens   |
-| `.ihub-md-py-5`  | Sets vertical padding to 20px on medium screens   |
-| `.ihub-md-px-4`  | Sets horizontal padding to 16px on medium screens |
-| `.ihub-md-px-5`  | Sets horizontal padding to 20px on medium screens |
-
-### Large Screen Utilities (min-width: 1025px)
-
-| Class           | Description                                      |
-| --------------- | ------------------------------------------------ |
-| `.ihub-lg-w-25` | Sets width to 25% on large screens               |
-| `.ihub-lg-w-33` | Sets width to 33.333333% on large screens        |
-| `.ihub-lg-w-50` | Sets width to 50% on large screens               |
-| `.ihub-lg-w-75` | Sets width to 75% on large screens               |
-| `.ihub-lg-p-6`  | Sets padding to 24px on large screens            |
-| `.ihub-lg-p-8`  | Sets padding to 32px on large screens            |
-| `.ihub-lg-py-6` | Sets vertical padding to 24px on large screens   |
-| `.ihub-lg-py-8` | Sets vertical padding to 32px on large screens   |
-| `.ihub-lg-px-6` | Sets horizontal padding to 24px on large screens |
-| `.ihub-lg-px-8` | Sets horizontal padding to 32px on large screens |
-
-## Usage Examples
-
-### Basic Layout Structure
-
-```html
-<div class="ihub-w-100 ihub-max-w-1200 ihub-p-4 ihub-md-p-6 ihub-lg-p-8">
-  <div class="ihub-w-100 ihub-lg-w-50 ihub-p-3">
-    <!-- Content here -->
-  </div>
-</div>
-```
-
-### Card Component
-
-```html
-<div class="ihub-w-300 ihub-sm-w-100 ihub-md-w-50 ihub-p-4 ihub-max-h-500">
-  <div class="ihub-w-100 ihub-h-200">
-    <img src="image.jpg" alt="Card image" class="ihub-w-100 ihub-h-100" />
-  </div>
-  <div class="ihub-py-3 ihub-px-2">
-    <h3>Card Title</h3>
-    <p>Card description goes here</p>
-  </div>
-</div>
-```
-
-### Full-Height Layout
-
-```html
-<div class="ihub-w-100 ihub-h-screen">
-  <header class="ihub-w-100 ihub-h-64 ihub-px-4 ihub-py-2">
-    <!-- Header content -->
-  </header>
-  <main class="ihub-w-100 ihub-min-h-400 ihub-p-4">
-    <!-- Main content -->
-  </main>
-  <footer class="ihub-w-100 ihub-h-80 ihub-py-4 ihub-px-4">
-    <!-- Footer content -->
-  </footer>
-</div>
-```
-
-### Responsive Grid
-
-```html
-<div class="ihub-w-100 ihub-p-2 ihub-md-p-4">
-  <div class="ihub-w-100 ihub-lg-w-33 ihub-p-2">Column 1</div>
-  <div class="ihub-w-100 ihub-lg-w-33 ihub-p-2">Column 2</div>
-  <div class="ihub-w-100 ihub-lg-w-33 ihub-p-2">Column 3</div>
-</div>
-```
-
-### Dashboard Widget
-
-```html
-<div class="ihub-w-350 ihub-sm-w-100 ihub-md-w-50 ihub-p-4 ihub-max-h-300">
-  <div class="ihub-w-100 ihub-h-200 ihub-p-3">
-    <!-- Widget content -->
-  </div>
-  <div class="ihub-p-2">
-    <button class="ihub-w-100 ihub-p-2">View Details</button>
-  </div>
-</div>
-```
-
-## Implementation Notes
-
-- These utilities use a 4px base scale for consistency
-- Use responsive utilities to create mobile-first designs
-- Combine width and height utilities with `display: flex` for advanced layouts
-- When nesting elements with percentage-based widths, remember that percentages are relative to the parent container

package/dist/src/components/forms/SubmitBtn.js

@@ -1,2 +0,0 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("react/jsx-runtime");function e(t){return t&&"object"==typeof t&&"default"in t?t:{default:t}}var s=e(require("@mui/icons-material/ChevronRight"));exports.default=function(e){return t.jsx("div",{className:"ihub-react-button ihub-no-icon",children:t.jsxs("button",{type:"submit",id:"SubmitBtn",className:"ihub-submit-btn ihub-important-btn ihub-anime-button-chevron",disabled:!(0!==e.status&&!e.disableds),children:[0===e.status&&t.jsx("svg",{className:"ihub-bt-spinner",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 512 512",children:t.jsx("path",{d:"M304 48c0 26.51-21.49 48-48 48s-48-21.49-48-48 21.49-48 48-48 48 21.49 48 48zm-48 368c-26.51 0-48 21.49-48 48s21.49 48 48 48 48-21.49 48-48-21.49-48-48-48zm208-208c-26.51 0-48 21.49-48 48s21.49 48 48 48 48-21.49 48-48-21.49-48-48-48zM96 256c0-26.51-21.49-48-48-48S0 229.49 0 256s21.49 48 48 48 48-21.49 48-48zm12.922 99.078c-26.51 0-48 21.49-48 48s21.49 48 48 48 48-21.49 48-48c0-26.509-21.491-48-48-48zm294.156 0c-26.51 0-48 21.49-48 48s21.49 48 48 48 48-21.49 48-48c0-26.509-21.49-48-48-48zM108.922 60.922c-26.51 0-48 21.49-48 48s21.49 48 48 48 48-21.49 48-48-21.491-48-48-48z"})}),t.jsx("span",{children:e.labels}),t.jsx(s.default,{style:{color:"#ffffff"},id:"animate",width:"16",height:"16"})]})})};
-//# sourceMappingURL=SubmitBtn.js.map

package/dist/src/components/forms/SubmitBtn.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"SubmitBtn.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/src/components/lib/modals.js

@@ -1,2 +0,0 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var n=function(n){if(!n||n.length<3)return!1;return/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(n)},e=function(){var n=arguments.length>0&&void 0!==arguments[0]?arguments[0]:"",e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:200,t=200===e||201===e?"Awesome! The update was made.":500===e?"Sorry, the server can't process your request":"Hmmm..., Something went wrong. Try again",o=200===e||201===e?'<svg viewBox="0 0 24 24" style="color: var(--ViridianGreen); width:24px; height:24px;"><path fill="currentColor" d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-2 15l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z"/></svg>':'<svg viewBox="0 0 24 24" style="color: var(--Danger); width:24px; height:24px;"><path fill="currentColor" d="M12 2C6.47 2 2 6.47 2 12s4.47 10 10 10 10-4.47 10-10S17.53 2 12 2zm5 13.59L15.59 17 12 13.41 8.41 17 7 15.59 10.59 12 7 8.41 8.41 7 12 10.59 15.59 7 17 8.41 13.41 12 17 15.59z"/></svg>',i=document.getElementById("openToast");i||((i=document.createElement("div")).id="openToast");var a='\n    <div class="toast-wrapper">\n      <div class="slide-in-top">\n        <div class="align-text">\n          <div class="valid_btn">\n            '.concat(o,'\n            <p class="').concat(200===e||201===e?"isDone":"isError",'">\n              ').concat(n||t,'\n            </p>\n          </div>\n        </div>\n        <svg width="800px" height="800px" viewBox="-0.5 0 25 25" fill="none" xmlns="http://www.w3.org/2000/svg" \n          class="close-btn" onclick="window.cleanupToast()">\n          <path d="M3 21.32L21 3.32001" stroke="var(--Gunmetal)" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>\n          <path d="M3 3.32001L21 21.32" stroke="var(--Gunmetal)" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>\n        </svg>\n      </div>\n    </div>\n  ');i.innerHTML=a,document.body.appendChild(i),window.cleanupToast=function(){var n;null===(n=i)||void 0===n||n.remove()},setTimeout((function(){window.cleanupToast()}),1e4)};exports.getUserEmailInputModal=function(t){return new Promise((function(o){var i,a=document.getElementById("confirmModal");a||((a=document.createElement("div")).id="confirmModal");var d='\n      <section id="myModal" class="modal">\n        <div class="modal-content">\n          <svg width="800px" height="800px" viewBox="-0.5 0 25 25" fill="none" xmlns="http://www.w3.org/2000/svg" \n            class="ih_get_user_email_modal_close_btn" onclick="window.handleCleanUpInput()">\n            <path d="M3 21.32L21 3.32001" stroke="var(--Gunmetal)" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>\n            <path d="M3 3.32001L21 21.32" stroke="var(--Gunmetal)" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>\n          </svg>\n          <h4>Enrol for '.concat(t,'</h4>\n          <p>Enter a valid Email Address</p>\n          <input type="email" name="email" id="userInput" oninput="window.handleInput(this)" />\n          <div class="action_btn">\n            <button type="button" disabled id="proceedBtn" class="delete_btn important-btn" onclick="window.handleConfirm()">Proceed</button>\n          </div>\n        </div>\n      </section>\n    ');a.innerHTML=d,document.body.appendChild(a);var l=document.getElementById("proceedBtn");window.handleInput=function(e){n(e.value)?(l&&(l.disabled=!1),i=e.value):(l&&(l.disabled=!0),i=void 0)};var r=function(){var n;null===(n=a)||void 0===n||n.remove()};window.handleConfirm=function(){n(i)?(r(),o(i)):e("You need to enter a valid email!",400)},window.handleCleanUpInput=function(){r(),o(void 0)}}))},exports.openConfirmModal=function(n){var e=arguments.length>1&&void 0!==arguments[1]&&arguments[1];return new Promise((function(t){var o=document.getElementById("confirmModal");o||((o=document.createElement("div")).id="confirmModal");var i='\n      <section id="myModal" class="modal">\n        <div class="modal-content">\n          <span class="close" onclick="window.handleCancel()">×</span>\n          <p class="'.concat(e?"something_bad_flagged":"something_bad",'">\n            ').concat(e?"Unexpected things will happen if you don’t read this!":"You are about to submit!","\n          </p>\n          <p>").concat(n||"Carefully read the instructions before making a decision. Ready? Hit the continue button!",'</p>\n          <div class="mt-4">\n            <button type="button" class="danger-btn d-inline-block" onclick="window.handleCancel()">Cancel</button>\n            <button type="button" class="important-btn confirm-btn" onclick="window.handleConfirm()">Ok</button>\n          </div>\n        </div>\n      </section>\n    ');o.innerHTML=i,document.body.appendChild(o);var a=function(){var n;null===(n=o)||void 0===n||n.remove()};window.handleCancel=function(){a(),t(!1),console.log("")},window.handleConfirm=function(){a(),t(!0)},o.addEventListener("click",(function(n){var e=n.target;"myModal"!==e.id&&"confirmModal"!==e.id||a()}))}))},exports.openToast=e;
-//# sourceMappingURL=modals.js.map

package/dist/src/components/lib/modals.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"modals.js","sources":["../../../../src/components/lib/modals.ts"],"sourcesContent":["// Type for status codes\r\ntype StatusCode = 200 | 201 | 400 | 500 | number;\r\n\r\n// Utility function to validate email\r\nconst isValidEmail = (input: string | undefined): boolean => {\r\n  if (!input || input.length < 3) {\r\n    return false;\r\n  }\r\n  const emailRegex = /^[^\\s@]+@[^\\s@]+\\.[^\\s@]+$/;\r\n  return emailRegex.test(input);\r\n};\r\n\r\n// Declare global window interface extensions for event handlers\r\ndeclare global {\r\n  interface Window {\r\n    handleCancel: () => void;\r\n    handleConfirm: () => void;\r\n    cleanupToast: () => void;\r\n    handleInput: (e: HTMLInputElement) => void;\r\n    handleCleanUpInput: () => void;\r\n  }\r\n}\r\n\r\n// Open a confirmation modal\r\nexport const openConfirmModal = (\r\n  message: string,\r\n  flag: boolean = false\r\n): Promise<boolean> => {\r\n  return new Promise((resolve) => {\r\n    let modalContainer = document.getElementById(\r\n      \"confirmModal\"\r\n    ) as HTMLDivElement | null;\r\n    if (!modalContainer) {\r\n      modalContainer = document.createElement(\"div\");\r\n      modalContainer.id = \"confirmModal\";\r\n    }\r\n\r\n    const modalContent = `\r\n      <section id=\"myModal\" class=\"modal\">\r\n        <div class=\"modal-content\">\r\n          <span class=\"close\" onclick=\"window.handleCancel()\">×</span>\r\n          <p class=\"${flag ? \"something_bad_flagged\" : \"something_bad\"}\">\r\n            ${\r\n              flag\r\n                ? \"Unexpected things will happen if you don’t read this!\"\r\n                : \"You are about to submit!\"\r\n            }\r\n          </p>\r\n          <p>${\r\n            message ||\r\n            \"Carefully read the instructions before making a decision. Ready? Hit the continue button!\"\r\n          }</p>\r\n          <div class=\"mt-4\">\r\n            <button type=\"button\" class=\"danger-btn d-inline-block\" onclick=\"window.handleCancel()\">Cancel</button>\r\n            <button type=\"button\" class=\"important-btn confirm-btn\" onclick=\"window.handleConfirm()\">Ok</button>\r\n          </div>\r\n        </div>\r\n      </section>\r\n    `;\r\n\r\n    modalContainer.innerHTML = modalContent;\r\n    document.body.appendChild(modalContainer);\r\n\r\n    const cleanup = () => {\r\n      modalContainer?.remove();\r\n    };\r\n\r\n    window.handleCancel = () => {\r\n      cleanup();\r\n      resolve(false);\r\n      console.log(\"\");\r\n    };\r\n\r\n    window.handleConfirm = () => {\r\n      cleanup();\r\n      resolve(true);\r\n    };\r\n\r\n    modalContainer.addEventListener(\"click\", (e: MouseEvent) => {\r\n      const target = e.target as HTMLElement;\r\n      if (target.id === \"myModal\" || target.id === \"confirmModal\") {\r\n        cleanup();\r\n      }\r\n    });\r\n  });\r\n};\r\n\r\n// Open a toast notification\r\nexport const openToast = (\r\n  message: string = \"\",\r\n  status: StatusCode = 200\r\n): void => {\r\n  const msg =\r\n    status === 200 || status === 201\r\n      ? \"Awesome! The update was made.\"\r\n      : status === 500\r\n      ? \"Sorry, the server can't process your request\"\r\n      : \"Hmmm..., Something went wrong. Try again\";\r\n\r\n  const iconSvg =\r\n    status === 200 || status === 201\r\n      ? '<svg viewBox=\"0 0 24 24\" style=\"color: var(--ViridianGreen); width:24px; height:24px;\"><path fill=\"currentColor\" d=\"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-2 15l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z\"/></svg>'\r\n      : '<svg viewBox=\"0 0 24 24\" style=\"color: var(--Danger); width:24px; height:24px;\"><path fill=\"currentColor\" d=\"M12 2C6.47 2 2 6.47 2 12s4.47 10 10 10 10-4.47 10-10S17.53 2 12 2zm5 13.59L15.59 17 12 13.41 8.41 17 7 15.59 10.59 12 7 8.41 8.41 7 12 10.59 15.59 7 17 8.41 13.41 12 17 15.59z\"/></svg>';\r\n\r\n  let modalContainer = document.getElementById(\r\n    \"openToast\"\r\n  ) as HTMLDivElement | null;\r\n  if (!modalContainer) {\r\n    modalContainer = document.createElement(\"div\");\r\n    modalContainer.id = \"openToast\";\r\n  }\r\n\r\n  const modalContent = `\r\n    <div class=\"toast-wrapper\">\r\n      <div class=\"slide-in-top\">\r\n        <div class=\"align-text\">\r\n          <div class=\"valid_btn\">\r\n            ${iconSvg}\r\n            <p class=\"${\r\n              status === 200 || status === 201 ? \"isDone\" : \"isError\"\r\n            }\">\r\n              ${message || msg}\r\n            </p>\r\n          </div>\r\n        </div>\r\n        <svg width=\"800px\" height=\"800px\" viewBox=\"-0.5 0 25 25\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" \r\n          class=\"close-btn\" onclick=\"window.cleanupToast()\">\r\n          <path d=\"M3 21.32L21 3.32001\" stroke=\"var(--Gunmetal)\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n          <path d=\"M3 3.32001L21 21.32\" stroke=\"var(--Gunmetal)\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n        </svg>\r\n      </div>\r\n    </div>\r\n  `;\r\n\r\n  modalContainer.innerHTML = modalContent;\r\n  document.body.appendChild(modalContainer);\r\n\r\n  window.cleanupToast = () => {\r\n    modalContainer?.remove();\r\n  };\r\n\r\n  setTimeout(() => {\r\n    window.cleanupToast();\r\n  }, 10000);\r\n};\r\n\r\n// Open a modal to get user email input\r\nexport const getUserEmailInputModal = (\r\n  title: string\r\n): Promise<string | undefined> => {\r\n  return new Promise((resolve) => {\r\n    let modalContainer = document.getElementById(\r\n      \"confirmModal\"\r\n    ) as HTMLDivElement | null;\r\n    if (!modalContainer) {\r\n      modalContainer = document.createElement(\"div\");\r\n      modalContainer.id = \"confirmModal\";\r\n    }\r\n    let emailValue: string | undefined;\r\n\r\n    const modalContent = `\r\n      <section id=\"myModal\" class=\"modal\">\r\n        <div class=\"modal-content\">\r\n          <svg width=\"800px\" height=\"800px\" viewBox=\"-0.5 0 25 25\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" \r\n            class=\"ih_get_user_email_modal_close_btn\" onclick=\"window.handleCleanUpInput()\">\r\n            <path d=\"M3 21.32L21 3.32001\" stroke=\"var(--Gunmetal)\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n            <path d=\"M3 3.32001L21 21.32\" stroke=\"var(--Gunmetal)\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n          </svg>\r\n          <h4>Enrol for ${title}</h4>\r\n          <p>Enter a valid Email Address</p>\r\n          <input type=\"email\" name=\"email\" id=\"userInput\" oninput=\"window.handleInput(this)\" />\r\n          <div class=\"action_btn\">\r\n            <button type=\"button\" disabled id=\"proceedBtn\" class=\"delete_btn important-btn\" onclick=\"window.handleConfirm()\">Proceed</button>\r\n          </div>\r\n        </div>\r\n      </section>\r\n    `;\r\n\r\n    modalContainer.innerHTML = modalContent;\r\n    document.body.appendChild(modalContainer);\r\n\r\n    const proceedBtn = document.getElementById(\r\n      \"proceedBtn\"\r\n    ) as HTMLButtonElement | null;\r\n\r\n    window.handleInput = (e: HTMLInputElement) => {\r\n      if (isValidEmail(e.value)) {\r\n        if (proceedBtn) proceedBtn.disabled = false;\r\n        emailValue = e.value;\r\n      } else {\r\n        if (proceedBtn) proceedBtn.disabled = true;\r\n        emailValue = undefined;\r\n      }\r\n    };\r\n\r\n    const cleanup = () => {\r\n      modalContainer?.remove();\r\n    };\r\n\r\n    window.handleConfirm = () => {\r\n      if (isValidEmail(emailValue)) {\r\n        cleanup();\r\n        resolve(emailValue);\r\n      } else {\r\n        openToast(\"You need to enter a valid email!\", 400);\r\n      }\r\n    };\r\n\r\n    window.handleCleanUpInput = () => {\r\n      cleanup();\r\n      resolve(undefined);\r\n    };\r\n  });\r\n};\r\n"],"names":["isValidEmail","input","length","test","openToast","message","arguments","undefined","status","msg","iconSvg","modalContainer","document","getElementById","createElement","id","modalContent","concat","innerHTML","body","appendChild","window","cleanupToast","_modalContainer2","remove","setTimeout","title","Promise","resolve","emailValue","proceedBtn","handleInput","e","value","disabled","cleanup","_modalContainer3","handleConfirm","handleCleanUpInput","flag","_modalContainer","handleCancel","console","log","addEventListener","target"],"mappings":"oEAIA,IAAMA,EAAe,SAACC,GACpB,IAAKA,GAASA,EAAMC,OAAS,EAC3B,OAAO,EAGT,MADmB,6BACDC,KAAKF,EACzB,EA8EaG,EAAY,WAGf,IAFRC,EAAkBC,UAAAJ,OAAA,QAAAK,IAAAD,UAAA,GAAAA,UAAA,GAAA,GAClBE,EAAAF,UAAAJ,OAAA,QAAAK,IAAAD,UAAA,GAAAA,UAAA,GAAqB,IAEfG,EACO,MAAXD,GAA6B,MAAXA,EACd,gCACW,MAAXA,EACA,+CACA,2CAEAE,EACO,MAAXF,GAA6B,MAAXA,EACd,qPACA,wSAEFG,EAAiBC,SAASC,eAC5B,aAEGF,KACHA,EAAiBC,SAASE,cAAc,QACzBC,GAAK,aAGtB,IAAMC,EAAYC,yJAAAA,OAKNP,8BAAOO,OAEI,MAAXT,GAA6B,MAAXA,EAAiB,SAAW,UAChDS,sBAAAA,OACIZ,GAAWI,EAWxB,kiBAEDE,EAAeO,UAAYF,EAC3BJ,SAASO,KAAKC,YAAYT,GAE1BU,OAAOC,aAAe,WAAK,IAAAC,EACXA,QAAdA,EAAAZ,aAAcY,GAAdA,EAAgBC,UAGlBC,YAAW,WACTJ,OAAOC,cACR,GAAE,IACL,iCAGsC,SACpCI,GAEA,OAAO,IAAIC,SAAQ,SAACC,GAClB,IAOIC,EAPAlB,EAAiBC,SAASC,eAC5B,gBAEGF,KACHA,EAAiBC,SAASE,cAAc,QACzBC,GAAK,gBAItB,IAAMC,EAAY,kmBAAAC,OAQIS,EAQrB,qYAEDf,EAAeO,UAAYF,EAC3BJ,SAASO,KAAKC,YAAYT,GAE1B,IAAMmB,EAAalB,SAASC,eAC1B,cAGFQ,OAAOU,YAAc,SAACC,GAChBhC,EAAagC,EAAEC,QACbH,IAAYA,EAAWI,UAAW,GACtCL,EAAaG,EAAEC,QAEXH,IAAYA,EAAWI,UAAW,GACtCL,OAAatB,IAIjB,IAAM4B,EAAU,WAAK,IAAAC,EACLA,QAAdA,EAAAzB,aAAcyB,GAAdA,EAAgBZ,UAGlBH,OAAOgB,cAAgB,WACjBrC,EAAa6B,IACfM,IACAP,EAAQC,IAERzB,EAAU,mCAAoC,MAIlDiB,OAAOiB,mBAAqB,WAC1BH,IACAP,OAAQrB,GAEZ,GACF,2BA7LgC,SAC9BF,GAEoB,IADpBkC,EAAAjC,UAAAJ,OAAA,QAAAK,IAAAD,UAAA,IAAAA,UAAA,GAEA,OAAO,IAAIqB,SAAQ,SAACC,GAClB,IAAIjB,EAAiBC,SAASC,eAC5B,gBAEGF,KACHA,EAAiBC,SAASE,cAAc,QACzBC,GAAK,gBAGtB,IAAMC,oLAAYC,OAIAsB,EAAO,wBAA0B,gBAAetB,oBAAAA,OAExDsB,EACI,wDACA,2BACN,mCAAAtB,OAGAZ,GACA,4FAQP,uUAEDM,EAAeO,UAAYF,EAC3BJ,SAASO,KAAKC,YAAYT,GAE1B,IAAMwB,EAAU,WAAK,IAAAK,EACLA,QAAdA,EAAA7B,aAAc6B,GAAdA,EAAgBhB,UAGlBH,OAAOoB,aAAe,WACpBN,IACAP,GAAQ,GACRc,QAAQC,IAAI,KAGdtB,OAAOgB,cAAgB,WACrBF,IACAP,GAAQ,IAGVjB,EAAeiC,iBAAiB,SAAS,SAACZ,GACxC,IAAMa,EAASb,EAAEa,OACC,YAAdA,EAAO9B,IAAkC,iBAAd8B,EAAO9B,IACpCoB,GAEJ,GACF,GACF"}

package/dist/src/components/status/TimeTracker.js

@@ -1,2 +0,0 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../_virtual/_rollupPluginBabelHelpers.js"),t=require("react"),r=require("../lib/helpFunction.js");exports.default=function(n){var s=n.channel_username,u=n.IPAdress,a=n.session,c=n.selectIPAdress,i=n.useDispatch,o=n.useSelector,l=i(),d=o(c),f=t.useRef(new Date),v=t.useRef(null),p=t.useState(),m=e.slicedToArray(p,2),h=m[0],b=m[1],g=s,w=function(){var e;b(null===(e=document)||void 0===e?void 0:e.visibilityState),"hidden"===document.visibilityState?v.current=new Date:(f.current=new Date,v.current=null)},S=function(){v.current=new Date};return t.useEffect((function(){return f.current=new Date,document.addEventListener("visibilitychange",w),document.addEventListener("idle",S),function(){document.removeEventListener("visibilitychange",w),document.removeEventListener("idle",S)}}),[]),t.useEffect((function(){if(null==d||!d.ip_address){var t=function(){var t=e.asyncToGenerator(e.regeneratorRuntime().mark((function t(){var r,n;return e.regeneratorRuntime().wrap((function(e){for(;;)switch(e.prev=e.next){case 0:return e.prev=0,e.next=3,fetch("/api/user-ip-address");case 3:if((r=e.sent).ok){e.next=6;break}throw new Error("HTTP error! Status: ".concat(r.status));case 6:return e.next=8,r.json();case 8:n=e.sent,l(u.actions.set(n)),e.next=15;break;case 12:e.prev=12,e.t0=e.catch(0),console.error("Error fetching IP address:",e.t0);case 15:case"end":return e.stop()}}),t,null,[[0,12]])})));return function(){return t.apply(this,arguments)}}();t()}}),[l,null==d?void 0:d.ip_address]),t.useEffect((function(){var t=function(){var t=e.asyncToGenerator(e.regeneratorRuntime().mark((function t(){var n,s,u,c,i,o,l;return e.regeneratorRuntime().wrap((function(t){for(;;)switch(t.prev=t.next){case 0:if(!f.current||!v.current){t.next=23;break}if(s=Math.round((v.current.getTime()-f.current.getTime())/1e3),u=e.objectSpread2(e.objectSpread2({},d),{},{seconds:s,url:window.location.href,datetime_start:f.current.toISOString(),datetime_end:v.current.toISOString(),user:(null==a||null===(n=a.user)||void 0===n||null===(n=n.name)||void 0===n?void 0:n.id)||""}),t.prev=3,c=JSON.stringify(u),i=r.reqOptions("POST",c,null,"json"),g){t.next=9;break}return console.warn("Cannot send time data: handle is undefined"),t.abrupt("return");case 9:return t.next=11,fetch("".concat(r.API_HOST_URL,"history/").concat(g,"/timespent/"),i);case 11:if(201===(o=t.sent).status?console.log("Time spent sent to server successfully!"):console.error("Server responded with status: ".concat(o.status)),!r.IN_DEV_MODE){t.next=18;break}return t.next=16,o.json();case 16:l=t.sent,console.log(l);case 18:t.next=23;break;case 20:t.prev=20,t.t0=t.catch(3),console.error("Couldn't send time data:",t.t0);case 23:case"end":return t.stop()}}),t,null,[[3,20]])})));return function(){return t.apply(this,arguments)}}();t()}),[v.current,f.current,h,a,d,g]),null};
-//# sourceMappingURL=TimeTracker.js.map

package/dist/src/components/status/TimeTracker.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"TimeTracker.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/src/index-types.js

@@ -1,2 +0,0 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});exports.__keepIndexTypes=!0;
-//# sourceMappingURL=index-types.js.map

package/dist/src/index-types.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index-types.js","sources":["../../src/index-types.ts"],"sourcesContent":["import type { S3UploadResponseType } from \"./components/forms/uploads/IhubFileUploader\";\r\n\r\nexport { S3UploadResponseType };\r\n\r\nexport const __keepIndexTypes = true; // Prevents removal\r\n"],"names":[],"mappings":"8FAIgC"}

package/dist/src/types/components/forms/SubmitBtn.d.ts

@@ -1,7 +0,0 @@
-interface SubmitBtnProps {
-    labels: string;
-    status?: number;
-    disableds?: boolean;
-}
-declare function SubmitBtn(props: SubmitBtnProps): import("react/jsx-runtime").JSX.Element;
-export default SubmitBtn;

package/dist/src/types/components/status/TimeTracker.d.ts

@@ -1,16 +0,0 @@
-/// <reference types="react" />
-import { SessionUser } from "../theme/signout/SessionExpiresLogout";
-interface IPAddressData {
-    ip_address?: string;
-    [key: string]: any;
-}
-interface TimeTrackerProps {
-    channel_username?: string;
-    IPAdress: IPAddressData;
-    session: SessionUser;
-    selectIPAdress: any;
-    useDispatch: any;
-    useSelector: any;
-}
-declare const TimeTracker: React.FC<TimeTrackerProps>;
-export default TimeTracker;

package/dist/src/types/index-types.d.ts

@@ -1,3 +0,0 @@
-import type { S3UploadResponseType } from "./components/forms/uploads/IhubFileUploader";
-export { S3UploadResponseType };
-export declare const __keepIndexTypes = true;

package/dist/src/types/styles.d.ts

@@ -1,2 +0,0 @@
-import "./assets/css/styles.css";
-export declare const __styles__ = true;