tp-react-elements 3.0.15 → 3.0.17

package/dist/_virtual/index.esm12.js

@@ -1,3 +1,3 @@
-var Month = {};
+var DateInput = {};
 
-export { Month as __exports };
+export { DateInput as __exports };

package/dist/_virtual/index.esm13.js

@@ -1,3 +1,3 @@
-var DateInput = {};
+var InputRangeField = {};
 
-export { DateInput as __exports };
+export { InputRangeField as __exports };

package/dist/_virtual/index.esm14.js

@@ -1,3 +1,3 @@
-var InputRangeField = {};
+var Month = {};
 
-export { InputRangeField as __exports };
+export { Month as __exports };

package/dist/_virtual/index.esm4.js

@@ -1,3 +1,3 @@
-var Calendar = {};
+var DefinedRange = {};
 
-export { Calendar as __exports };
+export { DefinedRange as __exports };

package/dist/_virtual/index.esm5.js

@@ -1,3 +1,3 @@
-var DateRangePicker = {};
+var DateRange = {};
 
-export { DateRangePicker as __exports };
+export { DateRange as __exports };

package/dist/_virtual/index.esm6.js

@@ -1,3 +1,3 @@
-var DateRange = {};
+var Calendar = {};
 
-export { DateRange as __exports };
+export { Calendar as __exports };

package/dist/_virtual/index.esm7.js

@@ -1,3 +1,3 @@
-var DefinedRange = {};
+var DateRangePicker = {};
 
-export { DefinedRange as __exports };
+export { DateRangePicker as __exports };

package/dist/components/DateRangePicker/DateRangePicker.esm.js

@@ -83,7 +83,7 @@ const DateRangePickerComponent = ({ item, control, watch, setValue, getValues, c
     const displayValue = state[0].startDate && state[0].endDate
         ? `${format(state[0].startDate, 'dd/MM/yyyy')} - ${format(state[0].endDate, 'dd/MM/yyyy')}`
         : '';
-    const label = variant !== 'standard' ? `${item.label}${item.required ? ' *' : ''}` : '';
+    const label = variant !== 'standard' && item.labelVariant !== 'static' ? `${item.label}${item.required ? ' *' : ''}` : '';
     return (jsxs(Fragment, { children: [jsx(Box, { onClick: handleClick, sx: { width: '100%' }, children: jsx(Controller, { name: fromDateName, control: control, render: ({ fieldState }) => (jsxs(Fragment, { children: [renderLabel(variant, {
                                 item,
                                 ...rest,

package/dist/components/Form/FormRender.esm.js

@@ -1,6 +1,13 @@
 import { jsx, Fragment } from 'react/jsx-runtime';
 import require$$0__default, { lazy, Suspense } from 'react';
 import FormCheckBox from '../FormComponents/FormCheckBox/FormCheckBox.esm.js';
+import FormCheckBoxGroup from '../FormComponents/FormCheckBoxGroup/FormCheckBoxGroup.esm.js';
+import FormNumberField from '../FormComponents/FormNumberField/FormNumberField.esm.js';
+import FormNumberFieldDecimal from '../FormComponents/FormNumberField/FormNumberFieldDecimal.esm.js';
+import FormRadioGroup from '../FormComponents/FormRadioGroup/FormRadioGroup.esm.js';
+import FormTextAreaField from '../FormComponents/FormTextAreaField/FormTextAreaField.esm.js';
+import FormTextField from '../FormComponents/FormTextField/FormTextField.esm.js';
+import PasswordField from '../FormComponents/PasswordField/PasswordField.esm.js';
 import SingleSelect from '../FormComponents/Select/SingleSelect.esm.js';
 import MultiSelectAutocomplete from '../FormComponents/Select/MultiSelectAutocomplete.esm.js';
 import SingleSelectNonAutoComplete from '../FormComponents/Select/SingleSelectNonAutoComplete.esm.js';
@@ -11,13 +18,6 @@ import DateRangePickerComponent from '../DateRangePicker/DateRangePicker.esm.js'
 import RichTextEditorWrapper from '../FormComponents/RichTextEditor/RichTextEditorWrapper.esm.js';
 import SingleSelectSearchApi from '../FormComponents/Select/SingleSelectSearchApi.esm.js';
 import DatetimepickerWrapper from '../FormComponents/DatePicker/DatetimepickerWrapper.esm.js';
-import FormTextAreaField from '../FormComponents/FormTextAreaField/FormTextAreaField.esm.js';
-import FormRadioGroup from '../FormComponents/FormRadioGroup/FormRadioGroup.esm.js';
-import FormCheckBoxGroup from '../FormComponents/FormCheckBoxGroup/FormCheckBoxGroup.esm.js';
-import FormNumberFieldDecimal from '../FormComponents/FormNumberField/FormNumberFieldDecimal.esm.js';
-import FormNumberField from '../FormComponents/FormNumberField/FormNumberField.esm.js';
-import PasswordField from '../FormComponents/PasswordField/PasswordField.esm.js';
-import FormTextField from '../FormComponents/FormTextField/FormTextField.esm.js';
 
 // Lazy-loaded heavy components
 // const RichTextEditorWrapper = lazy(() =>

package/dist/components/FormComponents/FormRadioGroup/FormRadioGroup.esm.js

@@ -39,10 +39,34 @@ const FormRadioGroup = ({ props, variant }) => {
             fontSize: 16, // controls the radio icon size
         },
     }), [checkedColor]);
+    const isPill = props.item.radioVariant === 'pill';
     /**
      * Renders a group of radio buttons with labels and validation support
      */
-    return (jsxs(Fragment, { children: [renderLabel(variant, props), jsx(FormControl, { component: "fieldset", children: jsx(Controller, { name: props.item.name, control: props.control, render: ({ field }) => (jsx(RadioGroup, { value: field.value || '', onChange: (e) => {
+    return (jsxs(Fragment, { children: [renderLabel(variant, props), jsx(FormControl, { component: "fieldset", children: jsx(Controller, { name: props.item.name, control: props.control, render: ({ field }) => isPill ? (jsx("div", { role: "radiogroup", "aria-label": props.item.label, style: { display: 'flex', gap: 7, flexWrap: 'wrap' }, children: props.item?.settings?.map((option, i) => {
+                            const on = (field.value || '') === option.name;
+                            const long = String(option.label).length > 26;
+                            return (jsx("button", { type: "button", role: "radio", "aria-checked": on, onClick: () => {
+                                    field.onChange(option.name); // update form state
+                                    props.item.onChangeFn && props.item.onChangeFn(option.name); // optional handler
+                                }, style: {
+                                    flex: long ? '1 1 100%' : '1 1 auto',
+                                    width: long ? '100%' : undefined,
+                                    textAlign: long ? 'left' : 'center',
+                                    minWidth: long ? undefined : 120,
+                                    padding: long ? '10px 13px' : '9px 12px',
+                                    borderRadius: 7,
+                                    fontFamily: 'inherit',
+                                    fontSize: '12.5px',
+                                    fontWeight: on ? 700 : 600,
+                                    cursor: 'pointer',
+                                    whiteSpace: long ? 'normal' : 'nowrap',
+                                    lineHeight: 1.4,
+                                    border: `1px solid ${on ? checkedColor : '#DDE4ED'}`,
+                                    background: on ? `${checkedColor}14` : '#fff',
+                                    color: on ? checkedColor : '#42536B',
+                                }, children: option.label }, i));
+                        }) })) : (jsx(RadioGroup, { value: field.value || '', onChange: (e) => {
                             field.onChange(e.target.value); // update form state
                             props.item.onChangeFn && props.item.onChangeFn(e.target.value); // optional handler
                         }, row: true, sx: RADIO_GROUP_SX, children: props.item?.settings?.map((option, i) => (jsx(FormControlLabel, { value: option.name, control: jsx(Radio, { sx: radioSx }), label: jsx(Typography, { fontSize: '11px', fontWeight: 'normal !important', children: option.label }) }, i))) })) }) }), jsx(FormBottomField, { ...props })] }));

package/dist/components/FormComponents/index.esm.js

@@ -1,3 +1,8 @@
+export { default as FormNumberField } from './FormNumberField/FormNumberField.esm.js';
+export { default as FormNumberFieldDecimal } from './FormNumberField/FormNumberFieldDecimal.esm.js';
+export { default as FormTextAreaField } from './FormTextAreaField/FormTextAreaField.esm.js';
+export { default as FormTextField } from './FormTextField/FormTextField.esm.js';
+export { default as PasswordField } from './PasswordField/PasswordField.esm.js';
 export { default as FormCheckBox } from './FormCheckBox/FormCheckBox.esm.js';
 export { default as SingleSelect } from './Select/SingleSelect.esm.js';
 export { default as SingleSelectNonAutoComplete } from './Select/SingleSelectNonAutoComplete.esm.js';
@@ -5,21 +10,33 @@ export { default as SingleSelectSearchApi } from './Select/SingleSelectSearchApi
 export { default as MultiSelectV1 } from './Select/MultiSelectv1.esm.js';
 export { default as MultiSelectTable } from './Select/MultiSelectTable.esm.js';
 export { default as SearchableSelect } from './Select/SearchableSelect.esm.js';
-export { default as DatepickerWrapperV2 } from './DatePicker/DatepickerWrapperV2.esm.js';
-export { default as FormBottomField } from './FormBottomField/FormBottomField.esm.js';
 export { default as FormCheckBoxGroup } from './FormCheckBoxGroup/FormCheckBoxGroup.esm.js';
-export { default as FormErrorField } from './FormErrorField/FormErrorField.esm.js';
-export { default as FormNumberField } from './FormNumberField/FormNumberField.esm.js';
-export { default as FormNumberFieldDecimal } from './FormNumberField/FormNumberFieldDecimal.esm.js';
 export { default as FormRadioGroup } from './FormRadioGroup/FormRadioGroup.esm.js';
+export { default as DatepickerWrapperV2 } from './DatePicker/DatepickerWrapperV2.esm.js';
+export { default as Monthpickerrender } from './DatePicker/Monthpickerrender.esm.js';
+import 'react/jsx-runtime';
+import 'react';
+import '@mui/material';
+import '@mui/icons-material/CalendarToday';
+import '@mui/icons-material/ChevronLeft';
+import '@mui/icons-material/ChevronRight';
+import 'react-hook-form';
+export { default as FormBottomField } from './FormBottomField/FormBottomField.esm.js';
+import 'dayjs';
+export { default as YearPickerField } from './YearPickerField/YearPickerField.esm.js';
+export { default as TimePicker } from './TimePicker/TimePicker.esm.js';
 export { default as FormRenderFileUpload } from './FileUpload/FormRenderFileUpload.esm.js';
 export { default as FormRenderMultiFileUpload } from './FileUpload/FormRenderMultiFileUpload.esm.js';
-export { default as FormTextAreaField } from './FormTextAreaField/FormTextAreaField.esm.js';
-export { default as FormTextField } from './FormTextField/FormTextField.esm.js';
+import '@mui/icons-material/Visibility';
+import '@mui/icons-material/Close';
+import '@mui/icons-material/NavigateBefore';
+import '@mui/icons-material/NavigateNext';
+import '@mui/icons-material/Delete';
+import '@mui/icons-material/UploadFile';
+import '@mui/icons-material/PictureAsPdf';
+import '@mui/icons-material/TableChart';
+import '@mui/icons-material/Description';
+export { default as FormErrorField } from './FormErrorField/FormErrorField.esm.js';
 export { default as HelperText } from './HelperText/HelperText.esm.js';
-export { default as Monthpickerrender } from './DatePicker/Monthpickerrender.esm.js';
-export { default as PasswordField } from './PasswordField/PasswordField.esm.js';
 export { default as RichTextEditor } from './RichTextEditor/RichTextEditor.esm.js';
 export { default as RichTextEditorWrapper } from './RichTextEditor/RichTextEditorWrapper.esm.js';
-export { default as TimePicker } from './TimePicker/TimePicker.esm.js';
-export { default as YearPickerField } from './YearPickerField/YearPickerField.esm.js';

package/dist/node_modules/react-date-range/dist/components/Calendar/index.esm.js

@@ -1,4 +1,4 @@
-import { __exports as Calendar } from '../../../../../_virtual/index.esm4.js';
+import { __exports as Calendar } from '../../../../../_virtual/index.esm6.js';
 import require$$0__default from 'react';
 import { __require as requirePropTypes } from '../../../../prop-types/index.esm.js';
 import { __require as requireDayCell } from '../DayCell/index.esm.js';

package/dist/node_modules/react-date-range/dist/components/DateInput/index.esm.js

@@ -1,4 +1,4 @@
-import { __exports as DateInput } from '../../../../../_virtual/index.esm13.js';
+import { __exports as DateInput } from '../../../../../_virtual/index.esm12.js';
 import require$$0__default from 'react';
 import { __require as requirePropTypes } from '../../../../prop-types/index.esm.js';
 import { __require as requireClassnames } from '../../../../classnames/index.esm.js';

package/dist/node_modules/react-date-range/dist/components/DateRange/index.esm.js

@@ -1,4 +1,4 @@
-import { __exports as DateRange } from '../../../../../_virtual/index.esm6.js';
+import { __exports as DateRange } from '../../../../../_virtual/index.esm5.js';
 import require$$0__default from 'react';
 import { __require as requirePropTypes } from '../../../../prop-types/index.esm.js';
 import { __require as requireCalendar } from '../Calendar/index.esm.js';

package/dist/node_modules/react-date-range/dist/components/DateRangePicker/index.esm.js

@@ -1,4 +1,4 @@
-import { __exports as DateRangePicker } from '../../../../../_virtual/index.esm5.js';
+import { __exports as DateRangePicker } from '../../../../../_virtual/index.esm7.js';
 import require$$0__default from 'react';
 import { __require as requirePropTypes } from '../../../../prop-types/index.esm.js';
 import { __require as requireDateRange } from '../DateRange/index.esm.js';

package/dist/node_modules/react-date-range/dist/components/DefinedRange/index.esm.js

@@ -1,4 +1,4 @@
-import { __exports as DefinedRange } from '../../../../../_virtual/index.esm7.js';
+import { __exports as DefinedRange } from '../../../../../_virtual/index.esm4.js';
 import require$$0__default from 'react';
 import { __require as requirePropTypes } from '../../../../prop-types/index.esm.js';
 import { __require as requireStyles } from '../../styles.esm.js';

package/dist/node_modules/react-date-range/dist/components/InputRangeField/index.esm.js

@@ -1,4 +1,4 @@
-import { __exports as InputRangeField } from '../../../../../_virtual/index.esm14.js';
+import { __exports as InputRangeField } from '../../../../../_virtual/index.esm13.js';
 import require$$0__default from 'react';
 import { __require as requirePropTypes } from '../../../../prop-types/index.esm.js';
 

package/dist/node_modules/react-date-range/dist/components/Month/index.esm.js

@@ -1,4 +1,4 @@
-import { __exports as Month } from '../../../../../_virtual/index.esm12.js';
+import { __exports as Month } from '../../../../../_virtual/index.esm14.js';
 import require$$0__default from 'react';
 import { __require as requirePropTypes } from '../../../../prop-types/index.esm.js';
 import { __require as requireDayCell } from '../DayCell/index.esm.js';

package/dist/utils/Interface/FormInterface.d.ts

@@ -97,6 +97,13 @@ export interface FormSectionPropsItem {
     labelVariant?: 'floating' | 'static';
     /** Style overrides for the label span when `labelVariant: 'static'` is used. */
     labelSx?: SxProps<Theme>;
+    /**
+     * Visual style for `radio-group` fields. `'dot'` (default when omitted) keeps every existing
+     * consumer's current look — a stock MUI `Radio` dot per option. `'pill'` renders each option
+     * as a bordered, labelled button instead (no dot) that fills with the theme's
+     * `TPRadioGroup.checkedColor` when selected — no visual change unless a field opts in.
+     */
+    radioVariant?: 'dot' | 'pill';
 }
 export type VariantProps = 'standard' | 'outlined' | '';
 export interface FormRenderProps {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tp-react-elements",
-  "version": "3.0.15",
+  "version": "3.0.17",
   "private": false,
   "type": "module",
   "description": "React form components library built with React Hook Form and Yup",
@@ -66,6 +66,8 @@
     "format:check": "prettier --check \"src/**/*.{js,jsx,ts,tsx,css,scss,md,json}\"",
     "storybook": "storybook dev -p 6006",
     "build-storybook": "storybook build",
+    "deploy-storybook": "powershell -ExecutionPolicy Bypass -File scripts/deploy-storybook.ps1",
+    "deploy-storybook:ftp": "powershell -ExecutionPolicy Bypass -File scripts/deploy-storybook-ftp.ps1",
     "version:patch": "npm version patch",
     "version:minor": "npm version minor",
     "version:major": "npm version major",

package/scripts/deploy-storybook-ftp.ps1

@@ -0,0 +1,173 @@
+<#
+.SYNOPSIS
+  Builds Storybook and publishes storybook-static/ to the SmarterASP.NET site
+  "tpproduction-001-site41" over FTP, using the same credentials as
+  site41.PublishSettings' FTP profile. Use this if Web Deploy
+  (deploy-storybook.ps1) keeps failing with ERROR_CONNECTION_TERMINATED --
+  shared hosts often cap the size/duration of a single Web Deploy sync, and
+  this build's minified JS chunks exceed that. FTP uploads file-by-file, so a
+  large build doesn't hit the same limit.
+
+  The password is read from .storybook-deploy.local.json in the repo root if
+  present (shared with deploy-storybook.ps1, gitignored). Otherwise you're
+  prompted once and it's saved there for next time.
+
+.EXAMPLE
+  ./scripts/deploy-storybook-ftp.ps1
+
+.EXAMPLE
+  ./scripts/deploy-storybook-ftp.ps1 -SkipBuild
+#>
+
+param(
+    [string]$FtpHost = "win8095.site4now.net",
+    [int]$FtpPort = 21,
+    [string]$RemoteRoot = "/tp-react-elements",
+    [string]$UserName = "tpproduction-001",
+    [SecureString]$Password,
+    [switch]$SkipBuild
+)
+
+$ErrorActionPreference = "Stop"
+$repoRoot = Split-Path -Parent $PSScriptRoot
+$sourcePath = Join-Path $repoRoot "storybook-static"
+$credentialFile = Join-Path $repoRoot ".storybook-deploy.local.json"
+
+if (-not $SkipBuild) {
+    Write-Host "Building Storybook..." -ForegroundColor Cyan
+    Push-Location $repoRoot
+    try {
+        npm run build-storybook
+        if ($LASTEXITCODE -ne 0) { throw "build-storybook failed with exit code $LASTEXITCODE" }
+    } finally {
+        Pop-Location
+    }
+}
+
+if (-not (Test-Path $sourcePath)) {
+    throw "Build output not found at $sourcePath"
+}
+
+$plainPassword = $null
+$passwordFromFile = $false
+
+if ($Password) {
+    $bstr = [Runtime.InteropServices.Marshal]::SecureStringToBSTR($Password)
+    try { $plainPassword = [Runtime.InteropServices.Marshal]::PtrToStringAuto($bstr) }
+    finally { [Runtime.InteropServices.Marshal]::ZeroFreeBSTR($bstr) }
+} elseif (Test-Path $credentialFile) {
+    $plainPassword = (Get-Content $credentialFile -Raw | ConvertFrom-Json).password
+    $passwordFromFile = $true
+    Write-Host "Using saved deployment password from .storybook-deploy.local.json" -ForegroundColor DarkGray
+}
+
+if (-not $plainPassword) {
+    $securePassword = Read-Host -Prompt "FTP password for $UserName" -AsSecureString
+    $bstr = [Runtime.InteropServices.Marshal]::SecureStringToBSTR($securePassword)
+    try { $plainPassword = [Runtime.InteropServices.Marshal]::PtrToStringAuto($bstr) }
+    finally { [Runtime.InteropServices.Marshal]::ZeroFreeBSTR($bstr) }
+}
+
+if (-not $passwordFromFile) {
+    @{ password = $plainPassword } | ConvertTo-Json | Set-Content -Path $credentialFile -Encoding utf8
+    Write-Host "Saved password to .storybook-deploy.local.json for next time (gitignored)." -ForegroundColor DarkGray
+}
+
+$credential = New-Object System.Net.NetworkCredential($UserName, $plainPassword)
+
+function New-RemoteDirectory([string]$remotePath) {
+    $uri = "ftp://$FtpHost`:$FtpPort$remotePath"
+    $request = [System.Net.FtpWebRequest]::Create($uri)
+    $request.Credentials = $credential
+    $request.UsePassive = $true
+    $request.UseBinary = $true
+    $request.KeepAlive = $false
+    $request.Method = [System.Net.WebRequestMethods+Ftp]::MakeDirectory
+    try {
+        $response = $request.GetResponse()
+        $response.Close()
+    } catch [System.Net.WebException] {
+        # 550 = already exists, which is fine
+        $resp = $_.Exception.Response
+        if (-not ($resp -and $resp.StatusDescription -match "550")) {
+            throw
+        }
+    }
+}
+
+function Send-RemoteFile([string]$localFile, [string]$remotePath) {
+    $uri = "ftp://$FtpHost`:$FtpPort$remotePath"
+    $request = [System.Net.FtpWebRequest]::Create($uri)
+    $request.Credentials = $credential
+    $request.UsePassive = $true
+    $request.UseBinary = $true
+    $request.KeepAlive = $false
+    $request.Method = [System.Net.WebRequestMethods+Ftp]::UploadFile
+
+    $bytes = [System.IO.File]::ReadAllBytes($localFile)
+    $request.ContentLength = $bytes.Length
+    $stream = $request.GetRequestStream()
+    try {
+        $stream.Write($bytes, 0, $bytes.Length)
+    } finally {
+        $stream.Close()
+    }
+    $response = $request.GetResponse()
+    $response.Close()
+}
+
+Write-Host "Publishing $sourcePath -> ftp://$FtpHost$RemoteRoot ..." -ForegroundColor Cyan
+
+$allFiles = Get-ChildItem -Path $sourcePath -Recurse -File
+$createdDirs = New-Object System.Collections.Generic.HashSet[string]
+$total = $allFiles.Count
+$count = 0
+$failed = @()
+
+foreach ($file in $allFiles) {
+    $count++
+    $relative = $file.FullName.Substring($sourcePath.Length).TrimStart("\", "/").Replace("\", "/")
+    $remoteFilePath = "$RemoteRoot/$relative"
+    $remoteDir = [System.IO.Path]::GetDirectoryName($remoteFilePath).Replace("\", "/")
+
+    if ($remoteDir -and -not $createdDirs.Contains($remoteDir)) {
+        $segments = $remoteDir.Trim("/").Split("/")
+        $accum = ""
+        foreach ($segment in $segments) {
+            $accum = "$accum/$segment"
+            if (-not $createdDirs.Contains($accum)) {
+                New-RemoteDirectory $accum
+                $createdDirs.Add($accum) | Out-Null
+            }
+        }
+    }
+
+    $attempt = 0
+    $ok = $false
+    while (-not $ok -and $attempt -lt 3) {
+        $attempt++
+        try {
+            Send-RemoteFile $file.FullName $remoteFilePath
+            $ok = $true
+        } catch {
+            if ($attempt -ge 3) {
+                $failed += $relative
+                Write-Host "FAILED ($attempt/3): $relative - $($_.Exception.Message)" -ForegroundColor Red
+            } else {
+                Start-Sleep -Seconds 2
+            }
+        }
+    }
+
+    if ($ok) {
+        Write-Host "[$count/$total] $relative" -ForegroundColor DarkGray
+    }
+}
+
+if ($failed.Count -gt 0) {
+    Write-Host "`n$($failed.Count) file(s) failed to upload:" -ForegroundColor Red
+    $failed | ForEach-Object { Write-Host "  $_" -ForegroundColor Red }
+    throw "FTP deploy finished with $($failed.Count) failure(s)."
+}
+
+Write-Host "`nDeployed successfully: $total files." -ForegroundColor Green

package/scripts/deploy-storybook.ps1

@@ -0,0 +1,135 @@
+<#
+.SYNOPSIS
+  Builds Storybook and publishes storybook-static/ to the SmarterASP.NET site
+  "tpproduction-001-site41" via Web Deploy (MSDeploy), using the same Web Deploy
+  mechanism as site41.PublishSettings.
+
+  The deployment password is read from .storybook-deploy.local.json in the repo
+  root if that file exists (it is gitignored, so it never leaves this machine).
+  Otherwise you are prompted for it once, and it is saved to that file so future
+  runs don't ask again. On a fresh clone the file won't exist yet, so the first
+  run there will prompt.
+
+.EXAMPLE
+  ./scripts/deploy-storybook.ps1
+  (uses the saved password, or prompts and saves it on first run)
+
+.EXAMPLE
+  ./scripts/deploy-storybook.ps1 -SkipBuild
+  (redeploys the existing storybook-static/ folder without rebuilding)
+#>
+
+param(
+    [string]$SiteName = "tpproduction-001-site41",
+    [string]$ComputerName = "https://win8095.site4now.net:8172/msdeploy.axd?site=tpproduction-001-site41",
+    [string]$UserName = "tpproduction-001",
+    [SecureString]$Password,
+    [switch]$SkipBuild
+)
+
+$ErrorActionPreference = "Stop"
+$repoRoot = Split-Path -Parent $PSScriptRoot
+$sourcePath = Join-Path $repoRoot "storybook-static"
+$credentialFile = Join-Path $repoRoot ".storybook-deploy.local.json"
+
+$msdeployCandidates = @(
+    "$env:ProgramFiles\IIS\Microsoft Web Deploy V3\msdeploy.exe",
+    "${env:ProgramFiles(x86)}\IIS\Microsoft Web Deploy V3\msdeploy.exe"
+)
+$msdeploy = $msdeployCandidates | Where-Object { Test-Path $_ } | Select-Object -First 1
+if (-not $msdeploy) {
+    throw "msdeploy.exe not found. Install 'Web Deploy 3.6' from Microsoft and re-run."
+}
+
+if (-not $SkipBuild) {
+    Write-Host "Building Storybook..." -ForegroundColor Cyan
+    Push-Location $repoRoot
+    try {
+        npm run build-storybook
+        if ($LASTEXITCODE -ne 0) { throw "build-storybook failed with exit code $LASTEXITCODE" }
+    } finally {
+        Pop-Location
+    }
+}
+
+if (-not (Test-Path $sourcePath)) {
+    throw "Build output not found at $sourcePath"
+}
+
+$plainPassword = $null
+$passwordFromFile = $false
+
+if ($Password) {
+    $bstr = [Runtime.InteropServices.Marshal]::SecureStringToBSTR($Password)
+    try {
+        $plainPassword = [Runtime.InteropServices.Marshal]::PtrToStringAuto($bstr)
+    } finally {
+        [Runtime.InteropServices.Marshal]::ZeroFreeBSTR($bstr)
+    }
+} elseif (Test-Path $credentialFile) {
+    $plainPassword = (Get-Content $credentialFile -Raw | ConvertFrom-Json).password
+    $passwordFromFile = $true
+    Write-Host "Using saved deployment password from .storybook-deploy.local.json" -ForegroundColor DarkGray
+}
+
+if (-not $plainPassword) {
+    $securePassword = Read-Host -Prompt "Web Deploy password for $UserName" -AsSecureString
+    $bstr = [Runtime.InteropServices.Marshal]::SecureStringToBSTR($securePassword)
+    try {
+        $plainPassword = [Runtime.InteropServices.Marshal]::PtrToStringAuto($bstr)
+    } finally {
+        [Runtime.InteropServices.Marshal]::ZeroFreeBSTR($bstr)
+    }
+}
+
+if (-not $passwordFromFile) {
+    @{ password = $plainPassword } | ConvertTo-Json | Set-Content -Path $credentialFile -Encoding utf8
+    Write-Host "Saved password to .storybook-deploy.local.json for next time (gitignored)." -ForegroundColor DarkGray
+}
+
+Write-Host "Publishing $sourcePath -> $SiteName via Web Deploy..." -ForegroundColor Cyan
+
+# Synced one file at a time (instead of the whole storybook-static folder in a
+# single sync) because this build is ~10MB across 150+ files, and one big sync
+# kept dying with ERROR_CONNECTION_TERMINATED partway through -- SmarterASP's
+# shared-hosting Web Deploy endpoint appears to cap how long/large a single
+# request can be. Each file here is well under 1.5MB, small enough to finish
+# before any such limit kicks in. contentPath's provider auto-creates any
+# destination folders that don't exist yet, so no separate mkdir pass is needed.
+$allFiles = Get-ChildItem -Path $sourcePath -Recurse -File
+$total = $allFiles.Count
+$count = 0
+$failed = @()
+
+foreach ($file in $allFiles) {
+    $count++
+    $relative = $file.FullName.Substring($sourcePath.Length).TrimStart("\", "/").Replace("\", "/")
+    $remoteFilePath = "$SiteName/$relative"
+
+    # Pre-quoted as strings (not inline) so PowerShell's native-argument
+    # marshalling preserves the embedded quotes around paths that contain
+    # spaces (e.g. "D:\TP Projects\..."). Writing the quotes inline in the
+    # call below causes PowerShell to strip them before msdeploy ever sees
+    # them, which then misparses the whole descriptor as an unknown provider.
+    $sourceArg = "-source:contentPath=`"$($file.FullName)`""
+    $destArg = "-dest:contentPath=`"$remoteFilePath`",ComputerName=`"$ComputerName`",UserName=`"$UserName`",Password=`"$plainPassword`",AuthType=`"Basic`""
+
+    $output = & $msdeploy -verb:sync $sourceArg $destArg -allowUntrusted -retryAttempts:2 -retryInterval:5000 2>&1
+    if ($LASTEXITCODE -eq 0) {
+        Write-Host "[$count/$total] $relative" -ForegroundColor DarkGray
+    } else {
+        $failed += $relative
+        Write-Host "[$count/$total] FAILED: $relative" -ForegroundColor Red
+        $output | ForEach-Object { Write-Host "    $_" -ForegroundColor DarkRed }
+    }
+}
+
+$plainPassword = $null
+
+if ($failed.Count -gt 0) {
+    Write-Host "`n$($failed.Count) file(s) failed to deploy:" -ForegroundColor Red
+    $failed | ForEach-Object { Write-Host "  $_" -ForegroundColor Red }
+    throw "Web Deploy finished with $($failed.Count) failure(s)."
+}
+
+Write-Host "`nDeployed successfully: $total files." -ForegroundColor Green