{"_id":"@abdallah_ashour1/test","_rev":"5-074f68517ed20f31cc4f6e5ab763434d","name":"@abdallah_ashour1/test","dist-tags":{"latest":"1.0.4"},"versions":{"1.0.0":{"name":"@abdallah_ashour1/test","version":"1.0.0","_id":"@abdallah_ashour1/test@1.0.0","maintainers":[{"name":"abdallah_ashour1","email":"abdallah2001ashour@gmail.com"}],"dist":{"shasum":"d1746002acaa23d1ccd6c04847c78befe3407750","tarball":"https://registry.npmjs.org/@abdallah_ashour1/test/-/test-1.0.0.tgz","fileCount":28,"integrity":"sha512-3OokRvi7z6FEFHOFdHZ7Jnw3S2lJcC98bv61cN4s4n7wjGbosimbBg46oAz3fOgv4kbOGPNcmqDowSr6wHOOyg==","signatures":[{"sig":"MEQCIEeBn2OP63ne9o1Nuhs0RV7cKBSncteLRYG3bJ1OfHltAiB5Gqhj+JpW4I9H2GnlWOltGTYuybdE95kyg2JiusdgMQ==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":791757},"module":"fesm2022/abdallah_ashour1-test.mjs","exports":{".":{"types":"./index.d.ts","default":"./fesm2022/abdallah_ashour1-test.mjs"},"./package.json":{"default":"./package.json"}},"typings":"index.d.ts","_npmUser":{"name":"abdallah_ashour1","email":"abdallah2001ashour@gmail.com"},"_npmVersion":"10.8.1","description":"This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 19.2.15.","directories":{},"sideEffects":false,"_nodeVersion":"20.16.0","dependencies":{"tslib":"^2.3.0"},"_hasShrinkwrap":false,"peerDependencies":{"@angular/core":"^19.2.14","@angular/common":"^19.2.14"},"_npmOperationalInternal":{"tmp":"tmp/test_1.0.0_1759042254612_0.5816968153475248","host":"s3://npm-registry-packages-npm-production"}},"1.0.1":{"name":"@abdallah_ashour1/test","version":"1.0.1","_id":"@abdallah_ashour1/test@1.0.1","maintainers":[{"name":"abdallah_ashour1","email":"abdallah2001ashour@gmail.com"}],"dist":{"shasum":"a1ec795afe4bb7e8655eae3c785f82edd622615e","tarball":"https://registry.npmjs.org/@abdallah_ashour1/test/-/test-1.0.1.tgz","fileCount":29,"integrity":"sha512-fpPfKJQKV3ltox+316izx49pYtt86BtTnrrEXn2buhA7OwScdwFuVVeayQSBfkYs0Xq9fDucgWOTZwEyTQ4p4A==","signatures":[{"sig":"MEUCIQDd75l45e6SL691pvJT+2gzsc+QkEmT5bbyk1ZyFM+PYQIgXXRfn354Df3Zl8J6B/hbtcNxizMwNVlfqI52ZMaRmuQ=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":815675},"module":"fesm2022/abdallah_ashour1-test.mjs","exports":{".":{"types":"./index.d.ts","default":"./fesm2022/abdallah_ashour1-test.mjs"},"./package.json":{"default":"./package.json"}},"typings":"index.d.ts","_npmUser":{"name":"abdallah_ashour1","email":"abdallah2001ashour@gmail.com"},"_npmVersion":"10.8.1","description":"This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 19.2.15.","directories":{},"sideEffects":false,"_nodeVersion":"20.16.0","dependencies":{"tslib":"^2.3.0"},"_hasShrinkwrap":false,"peerDependencies":{"@angular/core":"^19.2.14","@angular/common":"^19.2.14"},"_npmOperationalInternal":{"tmp":"tmp/test_1.0.1_1759046812338_0.7033569897296934","host":"s3://npm-registry-packages-npm-production"}},"1.0.2":{"name":"@abdallah_ashour1/test","version":"1.0.2","_id":"@abdallah_ashour1/test@1.0.2","maintainers":[{"name":"abdallah_ashour1","email":"abdallah2001ashour@gmail.com"}],"dist":{"shasum":"16ac6747e060ec7ab6ef1e6f19cca07b4f076323","tarball":"https://registry.npmjs.org/@abdallah_ashour1/test/-/test-1.0.2.tgz","fileCount":29,"integrity":"sha512-Bqp9ftxoSpMDFFk2T2kmkdvGB47JfQx2XaOdLkiJzelK2r1dRyCsu6sD+wEcOLfvlj8kbiHzD6N+v16rgjeM8A==","signatures":[{"sig":"MEUCIGfb2VWi6Td+wwpi9WPoXKOd8fopeP5pqZeX4ZRmCFe4AiEAhG8E516E57EUMq2fVb44ApRUhv/4dsXS0dZ1K2jSWKo=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":815687},"module":"fesm2022/abdallah_ashour1-test.mjs","exports":{".":{"types":"./index.d.ts","default":"./fesm2022/abdallah_ashour1-test.mjs"},"./package.json":{"default":"./package.json"}},"typings":"index.d.ts","_npmUser":{"name":"abdallah_ashour1","email":"abdallah2001ashour@gmail.com"},"_npmVersion":"10.8.1","description":"This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 19.2.15.","directories":{},"sideEffects":false,"_nodeVersion":"20.16.0","dependencies":{"tslib":"^2.3.0"},"_hasShrinkwrap":false,"peerDependencies":{"@angular/core":"^19.2.14","@angular/common":"^19.2.14"},"_npmOperationalInternal":{"tmp":"tmp/test_1.0.2_1759049358730_0.18703629695423296","host":"s3://npm-registry-packages-npm-production"}},"1.0.3":{"name":"@abdallah_ashour1/test","version":"1.0.3","_id":"@abdallah_ashour1/test@1.0.3","maintainers":[{"name":"abdallah_ashour1","email":"abdallah2001ashour@gmail.com"}],"dist":{"shasum":"a1e4712fa1921c4dc0b288f21b4b0de28f85dead","tarball":"https://registry.npmjs.org/@abdallah_ashour1/test/-/test-1.0.3.tgz","fileCount":29,"integrity":"sha512-EAnELD+PoqBMZ9Un/sHQEGNCTB7el52v0mHm8GhCclfs++J8BfBZsJ4Oeqhhcm/RIl0oi1o6ix72wVa4gN0lzw==","signatures":[{"sig":"MEUCIEOdnZPSNsFpKzPrakiO+7VoPQmMBe2iv+vviwaI4cV+AiEAg/U8SmhqrcmwyWucVuTTBl+lCiO983NXfwTxj250GJ0=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":815687},"module":"fesm2022/abdallah_ashour1-test.mjs","exports":{".":{"types":"./index.d.ts","default":"./fesm2022/abdallah_ashour1-test.mjs"},"./package.json":{"default":"./package.json"}},"typings":"index.d.ts","_npmUser":{"name":"abdallah_ashour1","email":"abdallah2001ashour@gmail.com"},"_npmVersion":"10.8.1","description":"This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 19.2.15.","directories":{},"sideEffects":false,"_nodeVersion":"20.16.0","dependencies":{"tslib":"^2.3.0"},"_hasShrinkwrap":false,"peerDependencies":{"@angular/core":"^19.2.14","@angular/common":"^19.2.14"},"_npmOperationalInternal":{"tmp":"tmp/test_1.0.3_1759050155338_0.0015025365329448537","host":"s3://npm-registry-packages-npm-production"}},"1.0.4":{"name":"@abdallah_ashour1/test","version":"1.0.4","peerDependencies":{"@angular/common":"^19.2.14","@angular/core":"^19.2.14"},"dependencies":{"tslib":"^2.3.0"},"sideEffects":false,"module":"fesm2022/abdallah_ashour1-test.mjs","typings":"index.d.ts","exports":{"./package.json":{"default":"./package.json"},".":{"types":"./index.d.ts","default":"./fesm2022/abdallah_ashour1-test.mjs"}},"_id":"@abdallah_ashour1/test@1.0.4","description":"This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 19.2.15.","_nodeVersion":"20.16.0","_npmVersion":"10.8.1","dist":{"integrity":"sha512-s43Wo8mg3zxhEc09fksAlftdGfs/SewyqZfExCO4chr/EMlXIs2wFgrdid0vBXs0+tiJopJmXAZnluRXyFjSHA==","shasum":"60ffaef98cbfffe7a6c32fc3a11e4bd6dc1fbdca","tarball":"https://registry.npmjs.org/@abdallah_ashour1/test/-/test-1.0.4.tgz","fileCount":29,"unpackedSize":816264,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEYCIQCf/b5Fkk1skd//D5kPIzNBktB2erqkGA8KG9zfVvprngIhAMzEVFIJNi6O1bovvMMMzXyzx6ntszNP/Icnb3w5Tarv"}]},"_npmUser":{"name":"abdallah_ashour1","email":"abdallah2001ashour@gmail.com"},"directories":{},"maintainers":[{"name":"abdallah_ashour1","email":"abdallah2001ashour@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/test_1.0.4_1759052414555_0.9098814888299034"},"_hasShrinkwrap":false}},"time":{"created":"2025-09-28T06:50:54.504Z","modified":"2025-09-28T09:40:15.020Z","1.0.0":"2025-09-28T06:50:54.807Z","1.0.1":"2025-09-28T08:06:52.554Z","1.0.2":"2025-09-28T08:49:18.933Z","1.0.3":"2025-09-28T09:02:35.550Z","1.0.4":"2025-09-28T09:40:14.842Z"},"description":"This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 19.2.15.","maintainers":[{"name":"abdallah_ashour1","email":"abdallah2001ashour@gmail.com"}],"readme":"# SharedUI\r\n\r\nThis library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 19.2.15.\r\n\r\n## Code scaffolding\r\n\r\nRun `ng generate component component-name --project SharedUI` to generate a new component. \r\nYou can also use `ng generate directive|pipe|service|class|guard|interface|enum|module --project SharedUI`.\r\n> Note: Don't forget to add `--project SharedUI` or else it will be added to the default project in your `angular.json` file. \r\n\r\n## Build\r\n\r\nRun `ng build SharedUI` to build the project. The build artifacts will be stored in the `dist/` directory.\r\n\r\n## Publishing\r\n\r\nAfter building your library with `ng build SharedUI`, go to the dist folder `cd dist/shared-ui` and run `npm publish`.\r\n\r\n## Running unit tests\r\n\r\nRun `ng test SharedUI` to execute the unit tests via [Karma](https://karma-runner.github.io).\r\n\r\n## Further help\r\n\r\nTo get more help on the Angular CLI use `ng help` or go check out the [Angular CLI Overview and Command Reference](https://angular.dev/tools/cli) page.\r\n\r\n## Sky Components UI\r\n\r\nThis package is generic shared components with default theme used in Sky software company, you can find in first installation the below components:\r\n\r\n1. Alert Toast.\r\n2. Card view.\r\n3. Confirmation Popup\r\n4. Errors popup\r\n5. Footer/ Popup action buttons and error label\r\n6. Pager control\r\n7. Tab control\r\n8. Session Expiry popup.\r\n9. Uploader Documents control\r\n\r\n## Installation\r\nUse npm to install this package by command: `@skysoftware-co/sky-components-ui`\r\n\r\n## Alert Toast Component\r\n\r\n### Usage\r\n```html\r\n<sky-alert-toast></sky-alert-toast>\r\n```\r\n\r\nThis component is used to show alert toast messages with different alert types:\r\n1. success \r\n2. error\r\n3. warning\r\n4. Unset\r\n\r\n### Input Properties\r\n| Input | Type | Default Value | Description |\r\n|-------|------|---------------|-------------|\r\n| `toastTimer` | number | `10000` | Timer duration for toast display |\r\n| `width` | string | `'100%'` | Width of the toast |\r\n| `heigth` | string | `'50px'` | Height of the toast |\r\n| `maxWidth` | string | `'80%'` | Maximum width |\r\n| `minWidth` | string | `'39%'` | Minimum width |\r\n\r\n### Output Events\r\n- `notifyMessage` - Handle notification message events\r\n\r\n## Card View Component\r\n\r\n### Usage\r\n```html\r\n<sky-card-view></sky-card-view>\r\n```\r\n\r\nThis component displays cards with different content by passing specific templates and can show pager based on input.\r\n\r\n### Input Properties\r\n| Input | Type | Default Value | Description |\r\n|-------|------|---------------|-------------|\r\n| `showPager` | boolean | `true` | Show or hide pager |\r\n| `showOneCardPerRow` | boolean | `false` | Display one card per row |\r\n| `showTwoCardPerRow` | boolean | `false` | Display two cards per row |\r\n| `showThreeCardPerRow` | boolean | `false` | Display three cards per row |\r\n| `activeMinHeight` | boolean | `false` | Override minimum height of container |\r\n| `items` | any[] | - | Data source for the component |\r\n| `totalItems` | number | - | Total number of items for pager |\r\n| `cardTemplate` | TemplateRef<any> | - | Template for each card |\r\n| `isDragable` | boolean | `false` | Enable drag and drop for cards |\r\n| `isDisabled` | boolean | `false` | Disable the card |\r\n| `emptyStyle` | SkyEmptyStyle | `{ dataText: 'NoDataToDisplay', fontAwesomeIcon: undefined }` | Empty state styling |\r\n| `removeCardYaxisMargin` | boolean | `false` | Remove Y-axis margin |\r\n| `removeCardXaxisMargin` | boolean | `false` | Remove X-axis margin |\r\n| `removeContainerPadding` | boolean | `false` | Remove container padding |\r\n| `removeCardBorder` | boolean | `false` | Remove card border |\r\n| `removeCardShadow` | boolean | `false` | Remove card shadow |\r\n| `showTopBorder` | boolean | `false` | Show top border |\r\n| `useContainer` | boolean | `true` | Use container wrapper |\r\n| `useCardBody` | boolean | `true` | Use card body wrapper |\r\n| `itemsPerPageLabel` | string | `'Page Size'` | Label for page size options |\r\n\r\n### Output Events\r\n- `pageChange: EventEmitter<PageEvent>` - Page change event\r\n- `dragDrop: EventEmitter<any>` - Drag and drop event\r\n- `onScrollStart: EventEmitter` - Scroll start event\r\n- `onScrollStop: EventEmitter` - Scroll stop event\r\n\r\n## Confirmation Popup Component\r\n\r\n### Usage\r\n```html\r\n<sky-confirmation-popup></sky-confirmation-popup>\r\n```\r\n\r\nCommon component for delete popups, warning popups, or action popups with message and footer actions.\r\n\r\n### Input Properties\r\n| Input | Type | Default Value | Description |\r\n|-------|------|---------------|-------------|\r\n| `popupVisible` | boolean | `false` | Show/hide confirmation popup |\r\n| `shadingColor` | string | `'rgba(0,0,0,0.4)'` | Popup shadow color |\r\n| `popupTitle` | string | `''` | Popup header title |\r\n| `showCloseButton` | boolean | `false` | Show/hide close button in header |\r\n| `isPageLoading` | boolean | `false` | Loading state |\r\n| `confirmationMessage` | string | `''` | Confirmation body message |\r\n| `confirmationButtonText` | string | `'Continue'` | Main action button text |\r\n| `cancelButtonText` | string | `'Discard'` | Secondary action button text |\r\n| `errorLabel` | string | `'Error'` | Error label text |\r\n| `errorMessage` | signal | `signal('')` | Error message content |\r\n| `confirmationMessageClass` | string \\| object | `'text-wrap sky-text-dark-gray sky-card-text-sm'` | Confirmation message CSS classes |\r\n| `confirmationButtonClass` | string \\| object | `'sky-btn-width fw-medium sky-fs-14'` | Confirm button CSS classes |\r\n| `closeButtonClass` | string \\| object | `'sky-btn-width fw-medium sky-fs-14'` | Close button CSS classes |\r\n| `errorMessageContainerClass` | string \\| object | `'flex-grow-1 mt-2 text-white bg-danger p-2 rounded text-wrap w-100'` | Error container CSS classes |\r\n| `confirmationButtonHeight` | string \\| object | `'30'` | Confirmation button height |\r\n| `closeButtonHeight` | string \\| object | `'30'` | Close button height |\r\n| `height` | string \\| number | `'auto'` | Popup height |\r\n| `minWidth` | string \\| number | `'200'` | Minimum popup width |\r\n| `maxWidth` | string \\| number | `'700'` | Maximum popup width |\r\n| `width` | string \\| number | `'auto'` | Popup width |\r\n| `confirmationButtonType` | ButtonType | `'default'` | Confirmation button type |\r\n| `cancelButtonType` | ButtonType | `'normal'` | Cancel button type |\r\n| `confirmationTemplate` | TemplateRef<any> | - | Confirmation template |\r\n| `confirmationContentTemplate` | TemplateRef<any> | - | Confirmation content template |\r\n\r\n### Output Events\r\n- `onConfirmed: EventEmitter<any>` - Confirm button click event\r\n- `onClosed: EventEmitter<any>` - Close button click event\r\n- `onShowing: EventEmitter<any>` - Popup showing event\r\n\r\n## Errors Popup Component\r\n\r\n### Usage\r\n```html\r\n<sky-errors-popup></sky-errors-popup>\r\n```\r\n\r\nComponent to show error popup with error message and danger icon in header.\r\n\r\n### Input Properties\r\n| Input | Type | Default Value | Description |\r\n|-------|------|---------------|-------------|\r\n| `popupVisable` | boolean | `false` | Show/hide popup |\r\n| `popupHeight` | string | `'auto'` | Popup height |\r\n| `popupWidth` | string | `'600'` | Popup width |\r\n| `showTitle` | boolean | `false` | Show/hide title |\r\n| `shadingColor` | string | `'rgba(0,0,0,0.4)'` | Shadow color |\r\n| `errorsList` | string[] | `[]` | List of errors to display |\r\n| `errorLabel` | string | `'Errors'` | Error label text |\r\n| `showCloseButton` | boolean | `true` | Show/hide close button |\r\n| `secondaryButtonText` | string | `'Dismiss'` | Secondary button text |\r\n\r\n### Output Events\r\n- `onClosePopupClick: EventEmitter` - Close popup click event\r\n\r\n## Pager Control Component\r\n\r\n### Usage\r\n```html\r\n<sky-pager-control></sky-pager-control>\r\n```\r\n\r\nCommon pager control component with Angular Material built-in component and default theme color.\r\n\r\n### Input Properties\r\n| Input | Type | Default Value | Description |\r\n|-------|------|---------------|-------------|\r\n| `showPager` | boolean | `true` | Show/hide pager |\r\n| `totalItems` | number | - | Total items count |\r\n| `showFirstLastButtons` | boolean | `false` | Show first/last page buttons |\r\n| `hidePageSize` | boolean | `false` | Hide page size dropdown |\r\n| `useContainer` | boolean | `true` | Use container wrapper |\r\n| `itemsPerPageLabel` | string | `'Page Size'` | Items per page label |\r\n| `defaultPageSize` | number | `20` | Default page size |\r\n| `pageSizeOptions` | number[] | `[10, 20, 50, 100, 200, 500]` | Page size options |\r\n\r\n### Output Events\r\n- `pageChange: EventEmitter<PageEvent>` - Page change event\r\n\r\n## Tab Control Component\r\n\r\n### Usage\r\n```html\r\n<sky-tab-control></sky-tab-control>\r\n```\r\n\r\nCommon tab control component with tab text, icon, and count display.\r\n\r\n### Input Properties\r\n| Input | Type | Default Value | Description |\r\n|-------|------|---------------|-------------|\r\n| `tabItems` | SkyTabItem[] | `[]` | Tab items data source |\r\n| `hideTab` | boolean | `false` | Hide specific tab based on condition |\r\n| `backgroundUnSelectdButtonClass` | string | `'sky-bg-gray'` | Unselected tab background class |\r\n| `backgroundSelectedButtonClass` | string | `'sky-btn-light'` | Selected tab background class |\r\n\r\n### Output Events\r\n- `onTabClicked: EventEmitter<number>` - Tab click event\r\n\r\n## Upload Document Component\r\n\r\n### Usage\r\n```html\r\n<sky-upload-document></sky-upload-document>\r\n```\r\n\r\nComponent for uploading documents or viewing existing documents with view/download functionality.\r\n\r\n### Input Properties\r\n| Input | Type | Default Value | Description |\r\n|-------|------|---------------|-------------|\r\n| `labelText` | string | `''` | Document label caption |\r\n| `readOnly` | boolean | `false` | View files without upload capability |\r\n| `showMediumSize` | boolean | `false` | Show medium size display |\r\n| `hideUploader` | boolean | `false` | Show/hide uploader control |\r\n| `handleFailedUploadedMessage` | boolean | `false` | Override failed upload message |\r\n| `progressVisible` | boolean | `false` | Show progress bar during upload |\r\n| `uploaderVisible` | boolean | `false` | Show/hide uploader area |\r\n| `multipleDocument` | boolean | `false` | Allow multiple file upload |\r\n| `AttachmentsSources` | string[] | `[]` | List of attachment base64 strings |\r\n| `Attachments` | SkyAttachments[] | `[]` | List of attachment contracts |\r\n| `labelTextClass` | string \\| object | `'sky-fs-14 fw-medium sky-text-dark-gray'` | Label text CSS classes |\r\n| `labelTextContainerClass` | string \\| object | `'d-flex align-items-center mt-4'` | Label container CSS classes |\r\n| `imageContainerClass` | string \\| object | Dynamic based on size | Image container CSS classes |\r\n| `dropzoneClass` | object | Dynamic based on size | Dropzone CSS classes |\r\n| `imagWidth` | string \\| object | `'230px'` | Image width |\r\n| `imagHeight` | string \\| object | `'171px'` | Image height |\r\n| `progressBarWidth` | string | `'30%'` | Progress bar width |\r\n| `mainText` | string | `'Upload a file'` | Main upload text |\r\n| `extraText` | string | `'or drag and drop'` | Additional upload text |\r\n| `duplicateUploadErrorMessage` | string | `'Document file already uploaded'` | Duplicate file error message |\r\n| `supportTypeErrprMessage` | string | `'The selected file type is not allowed please choose a file with supported type'` | Unsupported type error |\r\n| `sizeErrorMessage` | string | `'The selected file exceeds the maximum size limit of 4MB please choose A smaller file'` | Size limit error message |\r\n| `maxFileSizeText` | string | `'up to 4MB'` | Max file size text |\r\n| `emptyText` | string | `'No data to display'` | Empty state text |\r\n| `allowedFileTypes` | string[] | `['application/pdf', 'image/jpeg', 'image/png', 'image/gif', 'image/jpg']` | Allowed file types |\r\n| `maxFileSize` | number | `4 * 1024 * 1024` | Maximum file size in bytes |\r\n| `minProgressBar` | number | `0` | Minimum progress bar percentage |\r\n| `maxProgressBar` | number | `100` | Maximum progress bar percentage |\r\n\r\n### Output Events\r\n- `onUploadFailed: EventEmitter<string>` - Upload failed event\r\n- `onClearUploadMessage: EventEmitter<string>` - Clear upload message event\r\n- `onFileUploaded: EventEmitter<any>` - File uploaded event\r\n- `onDeleteAttachment: EventEmitter<any>` - Delete attachment event\r\n- `onViewAttachment: EventEmitter<any>` - View attachment event\r\n- `onDownloadAttachment: EventEmitter<any>` - Download attachment event\r\n\r\n## Footer/Popup Action Component\r\n\r\n### Usage\r\n```html\r\n<sky-footer-actions></sky-footer-actions>\r\n```\r\n\r\nCommon component for popup footer or screen footer with three button actions:\r\n1. Primary button (Save, Continue)\r\n2. Secondary button (Don't save, Discard)\r\n3. Extra primary button (Save and new)\r\n\r\n### Input Properties\r\n| Input | Type | Default Value | Description |\r\n|-------|------|---------------|-------------|\r\n| `primaryButtonText` | string | `'Save'` | Primary button text |\r\n| `extraButtonText` | string | `'Save and new'` | Extra button text |\r\n| `secondaryButtonText` | string | `'Cancel'` | Secondary button text |\r\n| `primaryButtonWidth` | string | `'auto'` | Primary button width |\r\n| `secondaryButtonWidth` | string | `'auto'` | Secondary button width |\r\n| `extraButtonWidth` | string | `'auto'` | Extra button width |\r\n| `isFillRowWidth` | boolean | `false` | Fill row width |\r\n| `primaryButtonHeight` | string | `'30'` | Primary button height |\r\n| `secondaryButtonHeight` | string | `'30'` | Secondary button height |\r\n| `extraButtonHeight` | string | `'30'` | Extra button height |\r\n| `showPrimaryButton` | boolean | `true` | Show primary button |\r\n| `showSecondaryButton` | boolean | `true` | Show secondary button |\r\n| `showExtraButton` | boolean | `false` | Show extra button |\r\n| `primaryButtonType` | ButtonType | `'default'` | Primary button type |\r\n| `secondaryButtonType` | ButtonType | `'normal'` | Secondary button type |\r\n| `extraButtonType` | ButtonType | `'normal'` | Extra button type |\r\n| `disabledPrimaryButton` | boolean | `false` | Disable primary button |\r\n| `disabledSecondaryButton` | boolean | `false` | Disable secondary button |\r\n| `disabledExtraButton` | boolean | `false` | Disable extra button |\r\n| `primarySubmitBehavior` | boolean | `true` | Primary button submit behavior |\r\n| `secondarySubmitBehavior` | boolean | `false` | Secondary button submit behavior |\r\n| `extraSubmitBehavior` | boolean | `false` | Extra button submit behavior |\r\n| `primaryButtonClass` | string \\| object | `''` | Primary button CSS classes |\r\n| `secondaryButtonClass` | string \\| object | `''` | Secondary button CSS classes |\r\n| `extraButtonClass` | string \\| object | `''` | Extra button CSS classes |\r\n| `formValidationGroup` | any | - | Form validation group |\r\n| `validatePrimaryAction` | boolean | `true` | Validate primary action |\r\n| `validateExtraAction` | boolean | `true` | Validate extra action |\r\n| `isLoading` | boolean | `false` | Loading state |\r\n| `loadingText` | string | `'Saving'` | Loading text |\r\n| `disabled` | boolean | `false` | Disabled state |\r\n| `EditMode` | SkyActionMode | `SkyActionMode.None` | Edit mode type |\r\n| `showErrorLabel` | boolean | `true` | Show error label |\r\n| `errorMessage` | signal | `signal('')` | Error message |\r\n| `errorLabel` | string | `'Error'` | Error label text |\r\n| `successMessage` | signal | `signal('')` | Success message |\r\n| `closeButtonClass` | string \\| object | `'sky-text-2xs text-white mx-2 sky-btn-close btn-close-white'` | Close button CSS classes |\r\n\r\n### Output Events\r\n- `PrimaryButtonClick: EventEmitter<any>` - Primary button click event\r\n- `SecondaryButtonClick: EventEmitter<any>` - Secondary button click event\r\n- `ExtraButtonClick: EventEmitter<any>` - Extra button click event\r\n\r\n## Session Expiry Popup Component\r\n\r\n### Usage\r\n```html\r\n<sky-session-expiry-popup></sky-session-expiry-popup>\r\n```\r\n\r\nThis component shows a session expiry warning popup when the session is about to end or has expired. By default, it appears 5 minutes before expiration. You can customize the timing and functionality using the inputs below.\r\n\r\n### Input Properties\r\n| Input | Type | Default Value | Description |\r\n|-------|------|---------------|-------------|\r\n| `modalIcon` | any | `faTriangleExclamation` | Icon for the popup header |\r\n| `showModal` | boolean | `false` | Show popup as modal with background shadow |\r\n| `isExpired` | boolean | `false` | Override if session is expired to control warning message |\r\n| `timeLeft` | string | `'00:00'` | Override time remaining until session expires |\r\n| `timeLabel` | string | `'Minutes'` | Override time unit label (Minutes, Seconds, etc.) |\r\n| `logoutLabel` | string | `'Logout'` | Text for logout button |\r\n| `extendLabel` | string | `'Extend'` | Text for extend session button |\r\n| `backToLoginLabel` | string | `'Back to Login'` | Text for back to login button |\r\n| `mainHeaderText` | string | `'Your session is about to expire within'` | Header text when session is expiring |\r\n| `expiredHeaderText` | string | `'Your session Has been expired'` | Header text when session has expired |\r\n| `loginMessage` | string | `'You need to login again'` | Message for expired sessions |\r\n| `backToLoginButtonClass` | string \\| object | `'btn sky-btn-primary me-3 text-white'` | CSS classes for back to login button |\r\n| `extendButtonClass` | string \\| object | `'btn sky-btn-primary me-3 text-white'` | CSS classes for extend button |\r\n| `logoutButtonClass` | string \\| object | `'btn sky-btn-light text-dark'` | CSS classes for logout button |\r\n","readmeFilename":"README.md"}