@burdenoff/microfe-bigconsole 2026.1004.2 → 2026.1004.4

package/dist/bigconsole/components/builder/inspector/DataBindingSection.js.map

@@ -1 +1 @@
-{"version":3,"file":"DataBindingSection.js","names":[],"sources":["../../../../../src/bigconsole/components/builder/inspector/DataBindingSection.tsx"],"sourcesContent":["import type { FC } from 'react';\nimport { Input, Label, Spinner } from '@burdenoff/fe-libs/ui';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport type { WidgetBinding, WidgetBindingStatus } from '../../../types';\nimport { DataSinkSelector } from '../../parser/DataSinkSelector';\nimport { ParserSelector } from '../../parser/ParserSelector';\nimport { Section, SectionStack, type SectionTone } from '../../common';\n\nexport interface DataBindingSectionProps {\n  consoleId: string;\n  binding: WidgetBinding;\n  dataSinkKey: string | null;\n  dataPath?: string;\n  status: WidgetBindingStatus;\n  missingFields?: string[];\n  preview?: unknown;\n  error?: string | null;\n  onDataSinkChange: (key: string | null) => void;\n  onParserChange: (parserId: string | null) => void;\n  onDataPathChange: (path: string | undefined) => void;\n}\n\n/**\n * Binding health is the single most important signal on this tab, so it gets a\n * toned section of its own instead of the bare `<p class=\"text-xs\">` it used to\n * be (BOFF-5636).\n */\nconst STATUS_TONES: Record<WidgetBindingStatus, SectionTone> = {\n  unbound: 'info',\n  loading: 'info',\n  bound: 'success',\n  no_data: 'warning',\n  parser_error: 'danger',\n  field_mismatch: 'warning',\n};\n\nexport const DataBindingSection: FC<DataBindingSectionProps> = ({\n  consoleId,\n  binding,\n  dataSinkKey,\n  dataPath,\n  status,\n  missingFields = [],\n  preview,\n  error,\n  onDataSinkChange,\n  onParserChange,\n  onDataPathChange,\n}) => {\n  const { t } = useI18n();\n\n  const statusLabels: Record<WidgetBindingStatus, string> = {\n    unbound: t('bigconsole.builder.dataBinding.status.unbound', 'Select a DataSink to begin'),\n    loading: t('bigconsole.builder.dataBinding.status.loading', 'Testing parser and detecting fields…'),\n    bound: t('bigconsole.builder.dataBinding.status.bound', 'Binding ready'),\n    no_data: t('bigconsole.builder.dataBinding.status.noData', 'Parser returned no data'),\n    parser_error: t('bigconsole.builder.dataBinding.status.parserError', 'Parser test failed'),\n    field_mismatch: t('bigconsole.builder.dataBinding.status.fieldMismatch', 'Some mapped fields were not found'),\n  };\n\n  return (\n    <SectionStack>\n      <Section\n        title=\"Data source\"\n        description={t(\n          'bigconsole.builder.dataBinding.intro',\n          'Connect this widget to a DataSink and Parser to display transformed data.'\n        )}\n        data-testid=\"widget-inspector-data-source\"\n      >\n        <div className=\"flex flex-col gap-form-gap\">\n          <div className=\"space-y-2\">\n            <Label>{t('bigconsole.builder.dataBinding.dataSinkLabel', 'DataSink')}</Label>\n            <DataSinkSelector\n              value={dataSinkKey}\n              onChange={onDataSinkChange}\n              placeholder={t('bigconsole.builder.dataBinding.dataSinkPlaceholder', 'Select a DataSink...')}\n            />\n            {dataSinkKey && (\n              <p className=\"text-xs text-text-secondary\">\n                {t('bigconsole.builder.dataBinding.keyLabel', 'Key: {{key}}', { key: dataSinkKey })}\n                {binding.source.ref && (\n                  <span className=\"ml-2 text-text-muted\">\n                    {t('bigconsole.builder.dataBinding.idLabel', 'ID: {{id}}...', {\n                      id: binding.source.ref.slice(0, 8),\n                    })}\n                  </span>\n                )}\n              </p>\n            )}\n          </div>\n\n          <div className=\"space-y-2\">\n            <Label>{t('bigconsole.builder.dataBinding.parserLabel', 'Parser')}</Label>\n            <ParserSelector\n              consoleId={consoleId}\n              value={binding.parserId ?? null}\n              onChange={onParserChange}\n              filterInputSinkKey={dataSinkKey ?? undefined}\n              filterStatus={undefined}\n              placeholder={\n                dataSinkKey\n                  ? t('bigconsole.builder.dataBinding.parserPlaceholder', 'Select a parser...')\n                  : t('bigconsole.builder.dataBinding.parserPlaceholderNoSink', 'Select a DataSink first...')\n              }\n              disabled={!dataSinkKey}\n            />\n          </div>\n        </div>\n      </Section>\n\n      <Section\n        title={statusLabels[status]}\n        tone={STATUS_TONES[status]}\n        padding=\"compact\"\n        headingLevel={3}\n        icon={status === 'loading' ? <Spinner style={{ width: '14px', height: '14px' }} /> : undefined}\n        data-testid=\"widget-inspector-binding-status\"\n      >\n        <div role=\"status\" aria-live=\"polite\" className=\"min-w-0 space-y-1\">\n          {/*\n            The status label is the section heading, which sits OUTSIDE this live\n            region — without this echo a screen reader would never hear the binding\n            flip from \"loading\" to \"bound\".\n          */}\n          <p className=\"sr-only\">{statusLabels[status]}</p>\n          {error && <p className=\"break-words text-xs text-[var(--color-status-error-text)]\">{error}</p>}\n          {missingFields.length > 0 && (\n            <p className=\"break-words text-xs text-[var(--color-status-warning-text)]\">\n              {t('bigconsole.builder.dataBinding.missingFields', 'Missing: {{fields}}', {\n                fields: missingFields.join(', '),\n              })}\n            </p>\n          )}\n          {!error && missingFields.length === 0 && status === 'bound' && (\n            <p className=\"text-xs text-text-secondary\">\n              The parser ran and its output matches the fields this widget expects.\n            </p>\n          )}\n        </div>\n      </Section>\n\n      {binding.parserId && Object.keys(binding.fields).length > 0 && (\n        <Section\n          emphasis=\"muted\"\n          padding=\"compact\"\n          title={t('bigconsole.builder.dataBinding.fieldMappingsConfigured', 'Field mappings configured')}\n          headingLevel={3}\n        >\n          <div className=\"min-w-0 space-y-1 text-xs text-text-secondary\">\n            {Object.entries(binding.fields).map(([name, path]) => (\n              <p key={name} className=\"break-words\">\n                {name}: <code className=\"rounded bg-bg-surface px-1 font-mono\">{path}</code>\n              </p>\n            ))}\n          </div>\n        </Section>\n      )}\n\n      {preview !== undefined && (\n        <Section\n          emphasis=\"muted\"\n          padding=\"compact\"\n          title={t('bigconsole.builder.dataBinding.livePreviewLabel', 'Live Preview')}\n          description=\"Raw parser output, exactly as the widget receives it.\"\n          headingLevel={3}\n        >\n          <pre className=\"max-h-40 min-w-0 overflow-auto rounded-input border border-[var(--color-border-subtle)] bg-bg-surface p-3 text-xs text-text-secondary\">\n            {JSON.stringify(preview, null, 2)}\n          </pre>\n        </Section>\n      )}\n\n      <Section emphasis=\"muted\" padding=\"compact\" title=\"Data path\" headingLevel={3}>\n        <div className=\"space-y-2\">\n          <Label htmlFor=\"widget-inspector-data-path\">\n            {t('bigconsole.builder.dataBinding.dataPathLabel', 'Data Path (Optional)')}\n          </Label>\n          <Input\n            id=\"widget-inspector-data-path\"\n            value={dataPath ?? ''}\n            onChange={(event) => onDataPathChange(event.target.value || undefined)}\n            placeholder={t('bigconsole.builder.dataBinding.dataPathPlaceholder', 'e.g., summary.totalRevenue')}\n          />\n          <p className=\"text-xs text-text-secondary\">\n            {t(\n              'bigconsole.builder.dataBinding.dataPathHelp',\n              'Path to extract specific data from the parser output (dot notation)'\n            )}\n          </p>\n        </div>\n      </Section>\n    </SectionStack>\n  );\n};\n"],"mappings":";;;;;;;;AA2BA,IAAM,IAAyD;CAC7D,SAAS;CACT,SAAS;CACT,OAAO;CACP,SAAS;CACT,cAAc;CACd,gBAAgB;CACjB,EAEY,KAAmD,EAC9D,cACA,YACA,gBACA,aACA,WACA,mBAAgB,EAAE,EAClB,YACA,UACA,qBACA,mBACA,0BACI;CACJ,IAAM,EAAE,SAAM,GAAS,EAEjB,IAAoD;EACxD,SAAS,EAAE,iDAAiD,6BAA6B;EACzF,SAAS,EAAE,iDAAiD,uCAAuC;EACnG,OAAO,EAAE,+CAA+C,gBAAgB;EACxE,SAAS,EAAE,gDAAgD,0BAA0B;EACrF,cAAc,EAAE,qDAAqD,qBAAqB;EAC1F,gBAAgB,EAAE,uDAAuD,oCAAoC;EAC9G;AAED,QACE,kBAAC,GAAD,EAAA,UAAA;EACE,kBAAC,GAAD;GACE,OAAM;GACN,aAAa,EACX,wCACA,4EACD;GACD,eAAY;aAEZ,kBAAC,OAAD;IAAK,WAAU;cAAf,CACE,kBAAC,OAAD;KAAK,WAAU;eAAf;MACE,kBAAC,GAAD,EAAA,UAAQ,EAAE,gDAAgD,WAAW,EAAS,CAAA;MAC9E,kBAAC,GAAD;OACE,OAAO;OACP,UAAU;OACV,aAAa,EAAE,sDAAsD,uBAAuB;OAC5F,CAAA;MACD,KACC,kBAAC,KAAD;OAAG,WAAU;iBAAb,CACG,EAAE,2CAA2C,gBAAgB,EAAE,KAAK,GAAa,CAAC,EAClF,EAAQ,OAAO,OACd,kBAAC,QAAD;QAAM,WAAU;kBACb,EAAE,0CAA0C,iBAAiB,EAC5D,IAAI,EAAQ,OAAO,IAAI,MAAM,GAAG,EAAE,EACnC,CAAC;QACG,CAAA,CAEP;;MAEF;QAEN,kBAAC,OAAD;KAAK,WAAU;eAAf,CACE,kBAAC,GAAD,EAAA,UAAQ,EAAE,8CAA8C,SAAS,EAAS,CAAA,EAC1E,kBAAC,GAAD;MACa;MACX,OAAO,EAAQ,YAAY;MAC3B,UAAU;MACV,oBAAoB,KAAe,KAAA;MACnC,cAAc,KAAA;MACd,aACE,IACI,EAAE,oDAAoD,qBAAqB,GAC3E,EAAE,0DAA0D,6BAA6B;MAE/F,UAAU,CAAC;MACX,CAAA,CACE;OACF;;GACE,CAAA;EAEV,kBAAC,GAAD;GACE,OAAO,EAAa;GACpB,MAAM,EAAa;GACnB,SAAQ;GACR,cAAc;GACd,MAAM,MAAW,YAAY,kBAAC,GAAD,EAAS,OAAO;IAAE,OAAO;IAAQ,QAAQ;IAAQ,EAAI,CAAA,GAAG,KAAA;GACrF,eAAY;aAEZ,kBAAC,OAAD;IAAK,MAAK;IAAS,aAAU;IAAS,WAAU;cAAhD;KAME,kBAAC,KAAD;MAAG,WAAU;gBAAW,EAAa;MAAY,CAAA;KAChD,KAAS,kBAAC,KAAD;MAAG,WAAU;gBAA6D;MAAU,CAAA;KAC7F,EAAc,SAAS,KACtB,kBAAC,KAAD;MAAG,WAAU;gBACV,EAAE,gDAAgD,uBAAuB,EACxE,QAAQ,EAAc,KAAK,KAAK,EACjC,CAAC;MACA,CAAA;KAEL,CAAC,KAAS,EAAc,WAAW,KAAK,MAAW,WAClD,kBAAC,KAAD;MAAG,WAAU;gBAA8B;MAEvC,CAAA;KAEF;;GACE,CAAA;EAET,EAAQ,YAAY,OAAO,KAAK,EAAQ,OAAO,CAAC,SAAS,KACxD,kBAAC,GAAD;GACE,UAAS;GACT,SAAQ;GACR,OAAO,EAAE,0DAA0D,4BAA4B;GAC/F,cAAc;aAEd,kBAAC,OAAD;IAAK,WAAU;cACZ,OAAO,QAAQ,EAAQ,OAAO,CAAC,KAAK,CAAC,GAAM,OAC1C,kBAAC,KAAD;KAAc,WAAU;eAAxB;MACG;MAAK;MAAE,kBAAC,QAAD;OAAM,WAAU;iBAAwC;OAAY,CAAA;MAC1E;OAFI,EAEJ,CACJ;IACE,CAAA;GACE,CAAA;EAGX,MAAY,KAAA,KACX,kBAAC,GAAD;GACE,UAAS;GACT,SAAQ;GACR,OAAO,EAAE,mDAAmD,eAAe;GAC3E,aAAY;GACZ,cAAc;aAEd,kBAAC,OAAD;IAAK,WAAU;cACZ,KAAK,UAAU,GAAS,MAAM,EAAE;IAC7B,CAAA;GACE,CAAA;EAGZ,kBAAC,GAAD;GAAS,UAAS;GAAQ,SAAQ;GAAU,OAAM;GAAY,cAAc;aAC1E,kBAAC,OAAD;IAAK,WAAU;cAAf;KACE,kBAAC,GAAD;MAAO,SAAQ;gBACZ,EAAE,gDAAgD,uBAAuB;MACpE,CAAA;KACR,kBAAC,GAAD;MACE,IAAG;MACH,OAAO,KAAY;MACnB,WAAW,MAAU,EAAiB,EAAM,OAAO,SAAS,KAAA,EAAU;MACtE,aAAa,EAAE,sDAAsD,6BAA6B;MAClG,CAAA;KACF,kBAAC,KAAD;MAAG,WAAU;gBACV,EACC,+CACA,sEACD;MACC,CAAA;KACA;;GACE,CAAA;EACG,EAAA,CAAA"}
+{"version":3,"file":"DataBindingSection.js","names":[],"sources":["../../../../../src/bigconsole/components/builder/inspector/DataBindingSection.tsx"],"sourcesContent":["import type { FC } from 'react';\nimport { Input, Label, Spinner } from '@burdenoff/fe-libs/ui';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport type { WidgetBinding, WidgetBindingStatus, Parser } from '../../../types';\nimport { DataSinkSelector } from '../../parser/DataSinkSelector';\nimport { ParserSelector } from '../../parser/ParserSelector';\nimport { Section, SectionStack, type SectionTone } from '../../common';\n\nexport interface DataBindingSectionProps {\n  consoleId: string;\n  binding: WidgetBinding;\n  resolvedParser?: Parser;\n  dataSinkKey: string | null;\n  dataPath?: string;\n  status: WidgetBindingStatus;\n  resolving?: boolean;\n  missingFields?: string[];\n  preview?: unknown;\n  error?: string | null;\n  onDataSinkChange: (key: string | null) => void;\n  onParserChange: (parserId: string | null) => void;\n  onDataPathChange: (path: string | undefined) => void;\n}\n\n/**\n * Binding health is the single most important signal on this tab, so it gets a\n * toned section of its own instead of the bare `<p class=\"text-xs\">` it used to\n * be (BOFF-5636).\n */\nconst STATUS_TONES: Record<WidgetBindingStatus, SectionTone> = {\n  unbound: 'info',\n  loading: 'info',\n  bound: 'success',\n  no_data: 'warning',\n  parser_error: 'danger',\n  field_mismatch: 'warning',\n};\n\nexport const DataBindingSection: FC<DataBindingSectionProps> = ({\n  consoleId,\n  binding,\n  resolvedParser,\n  dataSinkKey,\n  dataPath,\n  status,\n  resolving = false,\n  missingFields = [],\n  preview,\n  error,\n  onDataSinkChange,\n  onParserChange,\n  onDataPathChange,\n}) => {\n  const { t } = useI18n();\n\n  const statusLabels: Record<WidgetBindingStatus, string> = {\n    unbound: t('bigconsole.builder.dataBinding.status.unbound', 'Select a DataSink to begin'),\n    loading: resolving\n      ? t('bigconsole.parsers.selector.loading', 'Loading parsers...')\n      : t('bigconsole.builder.dataBinding.status.loading', 'Testing parser and detecting fields…'),\n    bound: t('bigconsole.builder.dataBinding.status.bound', 'Binding ready'),\n    no_data: t('bigconsole.builder.dataBinding.status.noData', 'Parser returned no data'),\n    parser_error: t('bigconsole.builder.dataBinding.status.parserError', 'Parser test failed'),\n    field_mismatch: t('bigconsole.builder.dataBinding.status.fieldMismatch', 'Some mapped fields were not found'),\n  };\n\n  return (\n    <SectionStack>\n      <Section\n        title=\"Data source\"\n        description={t(\n          'bigconsole.builder.dataBinding.intro',\n          'Connect this widget to a DataSink and Parser to display transformed data.'\n        )}\n        data-testid=\"widget-inspector-data-source\"\n      >\n        <div className=\"flex flex-col gap-form-gap\">\n          <div className=\"space-y-2\">\n            <Label>{t('bigconsole.builder.dataBinding.dataSinkLabel', 'DataSink')}</Label>\n            <DataSinkSelector\n              value={dataSinkKey}\n              onChange={onDataSinkChange}\n              placeholder={t('bigconsole.builder.dataBinding.dataSinkPlaceholder', 'Select a DataSink...')}\n            />\n            {dataSinkKey && (\n              <p className=\"text-xs text-text-secondary\">\n                {t('bigconsole.builder.dataBinding.keyLabel', 'Key: {{key}}', { key: dataSinkKey })}\n                {binding.source.ref && (\n                  <span className=\"ml-2 text-text-muted\">\n                    {t('bigconsole.builder.dataBinding.idLabel', 'ID: {{id}}...', {\n                      id: binding.source.ref.slice(0, 8),\n                    })}\n                  </span>\n                )}\n              </p>\n            )}\n          </div>\n\n          <div className=\"space-y-2\">\n            <Label>{t('bigconsole.builder.dataBinding.parserLabel', 'Parser')}</Label>\n            <ParserSelector\n              consoleId={consoleId}\n              value={binding.parserId ?? null}\n              resolvedParser={resolvedParser}\n              onChange={onParserChange}\n              filterInputSinkKey={dataSinkKey ?? undefined}\n              filterStatus={undefined}\n              placeholder={\n                dataSinkKey\n                  ? t('bigconsole.builder.dataBinding.parserPlaceholder', 'Select a parser...')\n                  : t('bigconsole.builder.dataBinding.parserPlaceholderNoSink', 'Select a DataSink first...')\n              }\n              disabled={!dataSinkKey}\n            />\n          </div>\n        </div>\n      </Section>\n\n      <Section\n        title={statusLabels[status]}\n        tone={STATUS_TONES[status]}\n        padding=\"compact\"\n        headingLevel={3}\n        icon={status === 'loading' ? <Spinner style={{ width: '14px', height: '14px' }} /> : undefined}\n        data-testid=\"widget-inspector-binding-status\"\n      >\n        <div role=\"status\" aria-live=\"polite\" className=\"min-w-0 space-y-1\">\n          {/*\n            The status label is the section heading, which sits OUTSIDE this live\n            region — without this echo a screen reader would never hear the binding\n            flip from \"loading\" to \"bound\".\n          */}\n          <p className=\"sr-only\">{statusLabels[status]}</p>\n          {error && <p className=\"break-words text-xs text-[var(--color-status-error-text)]\">{error}</p>}\n          {missingFields.length > 0 && (\n            <p className=\"break-words text-xs text-[var(--color-status-warning-text)]\">\n              {t('bigconsole.builder.dataBinding.missingFields', 'Missing: {{fields}}', {\n                fields: missingFields.join(', '),\n              })}\n            </p>\n          )}\n          {!error && missingFields.length === 0 && status === 'bound' && preview !== undefined && (\n            <p className=\"text-xs text-text-secondary\">\n              The parser ran and its output matches the fields this widget expects.\n            </p>\n          )}\n        </div>\n      </Section>\n\n      {binding.parserId && Object.keys(binding.fields).length > 0 && (\n        <Section\n          emphasis=\"muted\"\n          padding=\"compact\"\n          title={t('bigconsole.builder.dataBinding.fieldMappingsConfigured', 'Field mappings configured')}\n          headingLevel={3}\n        >\n          <div className=\"min-w-0 space-y-1 text-xs text-text-secondary\">\n            {Object.entries(binding.fields).map(([name, path]) => (\n              <p key={name} className=\"break-words\">\n                {name}: <code className=\"rounded bg-bg-surface px-1 font-mono\">{path}</code>\n              </p>\n            ))}\n          </div>\n        </Section>\n      )}\n\n      {preview !== undefined && (\n        <Section\n          emphasis=\"muted\"\n          padding=\"compact\"\n          title={t('bigconsole.builder.dataBinding.livePreviewLabel', 'Live Preview')}\n          description=\"Raw parser output, exactly as the widget receives it.\"\n          headingLevel={3}\n        >\n          <pre className=\"max-h-40 min-w-0 overflow-auto rounded-input border border-[var(--color-border-subtle)] bg-bg-surface p-3 text-xs text-text-secondary\">\n            {JSON.stringify(preview, null, 2)}\n          </pre>\n        </Section>\n      )}\n\n      <Section emphasis=\"muted\" padding=\"compact\" title=\"Data path\" headingLevel={3}>\n        <div className=\"space-y-2\">\n          <Label htmlFor=\"widget-inspector-data-path\">\n            {t('bigconsole.builder.dataBinding.dataPathLabel', 'Data Path (Optional)')}\n          </Label>\n          <Input\n            id=\"widget-inspector-data-path\"\n            value={dataPath ?? ''}\n            onChange={(event) => onDataPathChange(event.target.value || undefined)}\n            placeholder={t('bigconsole.builder.dataBinding.dataPathPlaceholder', 'e.g., summary.totalRevenue')}\n          />\n          <p className=\"text-xs text-text-secondary\">\n            {t(\n              'bigconsole.builder.dataBinding.dataPathHelp',\n              'Path to extract specific data from the parser output (dot notation)'\n            )}\n          </p>\n        </div>\n      </Section>\n    </SectionStack>\n  );\n};\n"],"mappings":"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"}

package/dist/bigconsole/components/dashboard/DashboardCanvas.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DashboardCanvas.d.ts","sourceRoot":"","sources":["../../../../src/bigconsole/components/dashboard/DashboardCanvas.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,EAAE,KAAK,EAAE,EAA2D,MAAM,OAAO,CAAC;AAqBzF,OAAO,EAAmB,KAAK,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAc3E,MAAM,WAAW,oBAAoB;IACnC,mBAAmB;IACnB,WAAW,EAAE,MAAM,CAAC;IACpB,oCAAoC;IACpC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,sBAAsB;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,+BAA+B;IAC/B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,uCAAuC;IACvC,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,kCAAkC;IAClC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,mCAAmC;IACnC,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,iBAAiB,CAAC,EAAE,MAAM,IAAI,CAAC;IAC/B,0CAA0C;IAC1C,KAAK,CAAC,EAAE,gBAAgB,EAAE,CAAC;IAC3B,qBAAqB;IACrB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,iCAAiC;IACjC,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,wCAAwC;IACxC,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,gBAAgB,EAAE,KAAK,IAAI,CAAC;IACrD,kCAAkC;IAClC,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,oCAAoC;IACpC,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACzD,uCAAuC;IACvC,eAAe,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3C,oCAAoC;IACpC,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,yCAAyC;IACzC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,gCAAgC;IAChC,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,uEAAuE;IACvE,iBAAiB,CAAC,EAAE,OAAO,CAAC;CAC7B;AAmBD,eAAO,MAAM,eAAe,EAAE,EAAE,CAAC,oBAAoB,CAkmBnD,CAAC;AAEH,eAAe,eAAe,CAAC"}
+{"version":3,"file":"DashboardCanvas.d.ts","sourceRoot":"","sources":["../../../../src/bigconsole/components/dashboard/DashboardCanvas.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,EAAE,KAAK,EAAE,EAA2D,MAAM,OAAO,CAAC;AAsBzF,OAAO,EAAmB,KAAK,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAc3E,MAAM,WAAW,oBAAoB;IACnC,mBAAmB;IACnB,WAAW,EAAE,MAAM,CAAC;IACpB,oCAAoC;IACpC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,sBAAsB;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,+BAA+B;IAC/B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,uCAAuC;IACvC,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,kCAAkC;IAClC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,mCAAmC;IACnC,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,iBAAiB,CAAC,EAAE,MAAM,IAAI,CAAC;IAC/B,0CAA0C;IAC1C,KAAK,CAAC,EAAE,gBAAgB,EAAE,CAAC;IAC3B,qBAAqB;IACrB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,iCAAiC;IACjC,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,wCAAwC;IACxC,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,gBAAgB,EAAE,KAAK,IAAI,CAAC;IACrD,kCAAkC;IAClC,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,oCAAoC;IACpC,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACzD,uCAAuC;IACvC,eAAe,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3C,oCAAoC;IACpC,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,yCAAyC;IACzC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,gCAAgC;IAChC,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,uEAAuE;IACvE,iBAAiB,CAAC,EAAE,OAAO,CAAC;CAC7B;AAmBD,eAAO,MAAM,eAAe,EAAE,EAAE,CAAC,oBAAoB,CAqmBnD,CAAC;AAEH,eAAe,eAAe,CAAC"}

package/dist/bigconsole/components/dashboard/DashboardCanvas.js

@@ -13,7 +13,8 @@ import s from "../../hooks/useWidgetOperations.js";
 import c from "../../hooks/useDashboardOperations.js";
 import l from "../../hooks/useDashboardImageExport.js";
 import { BIGCONSOLE_PERMISSIONS as u } from "../../../constants/permissions.js";
-import { useInstalledWidgets as d } from "../../hooks/useInstalledWidgets.js";
+import { loadBigConsoleSettings as d } from "../../hooks/useBigConsoleSettings.js";
+import { useInstalledWidgets as f } from "../../hooks/useInstalledWidgets.js";
 import ee from "./DashboardGrid.js";
 import te from "./DashboardToolbar.js";
 import ne from "./GlobalFiltersBar/GlobalFiltersBar.js";
@@ -28,42 +29,42 @@ import se from "./WidgetPalette.js";
 import { calculatePositionFromDrop as ce, findNextAvailablePosition as le } from "../../utils/widgetPositioning.js";
 import { WidgetInspector as ue } from "../builder/WidgetInspector.js";
 import "../builder/index.js";
-import { memo as f, useCallback as p, useEffect as de, useMemo as fe, useRef as m, useState as h } from "react";
+import { memo as p, useCallback as m, useEffect as de, useMemo as fe, useRef as h, useState as g } from "react";
 import { usePermissions as pe } from "@burdenoff/fe-libs/shared/providers/shell";
 import { Plus as me } from "lucide-react";
-import { Button as g } from "@burdenoff/fe-libs/ui";
-import { jsx as _, jsxs as v } from "react/jsx-runtime";
+import { Button as _ } from "@burdenoff/fe-libs/ui";
+import { jsx as v, jsxs as y } from "react/jsx-runtime";
 import { useI18n as he } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
 //#region src/bigconsole/components/dashboard/DashboardCanvas.tsx
-var y = f(function({ dashboardId: f, pageId: y, title: b, onPaste: ge, onSave: _e, isSaving: ve = !1, onExport: ye, onPublishTemplate: be, pages: x = [], activePageId: xe, onPageChange: Se, onPagesReorder: S, onPageAdd: Ce, onPageRename: we, onPageDuplicate: Te, onPageDelete: Ee, showFilters: De = !0, showPageTabs: Oe = !0, enableCrossFilter: ke = !0 }) {
-	let { t: C } = he(), w = m(null), T = m(null), [E, Ae] = h(1200), [je, D] = h(!1), [O, k] = h(null), [A, j] = h(!1), [Me, M] = h(null), [N, Ne] = h(null), P = t((e) => e.viewMode === "edit"), F = t((e) => e.currentDashboard), { updateDashboard: I } = c({ skipFetch: !0 }), { hasPermission: Pe } = pe(), Fe = Pe(u.DASHBOARD_UPDATE), Ie = N?.id === f ? N.value : F?.id === f ? F.visibility : void 0, Le = p(async (e) => {
-		let t = await I({
-			id: f,
+var b = p(function({ dashboardId: p, pageId: b, title: x, onPaste: ge, onSave: _e, isSaving: ve = !1, onExport: ye, onPublishTemplate: be, pages: S = [], activePageId: xe, onPageChange: Se, onPagesReorder: C, onPageAdd: Ce, onPageRename: we, onPageDuplicate: Te, onPageDelete: Ee, showFilters: De = !0, showPageTabs: Oe = !0, enableCrossFilter: ke = !0 }) {
+	let { t: w } = he(), T = h(null), E = h(null), [D, Ae] = g(1200), [je, O] = g(!1), [k, A] = g(null), [j, M] = g(!1), [Me, N] = g(null), [P, Ne] = g(null), F = t((e) => e.viewMode === "edit"), I = t((e) => e.currentDashboard), L = I?.pages.find((e) => e.id === b)?.gridColumns ?? 12, { updateDashboard: R } = c({ skipFetch: !0 }), { hasPermission: Pe } = pe(), Fe = Pe(u.DASHBOARD_UPDATE), Ie = P?.id === p ? P.value : I?.id === p ? I.visibility : void 0, Le = m(async (e) => {
+		let t = await R({
+			id: p,
 			visibility: e
 		});
 		if (!t) throw Error("The dashboard service did not accept the change.");
 		Ne({
-			id: f,
+			id: p,
 			value: t.visibility ?? e
 		});
-	}, [f, I]), { workspaceId: L, apiGatewayUrl: R, authToken: z } = r(), { installedWidgets: Re, loading: ze } = d({
-		workspaceId: L,
-		apiGatewayUrl: R,
-		authToken: z,
-		enabled: P
+	}, [p, R]), { workspaceId: z, apiGatewayUrl: B, authToken: V } = r(), { installedWidgets: Re, loading: ze } = f({
+		workspaceId: z,
+		apiGatewayUrl: B,
+		authToken: V,
+		enabled: F
 	}), { definitions: Be } = o({
-		workspaceId: L,
-		apiGatewayUrl: R,
-		authToken: z,
-		enabled: P
-	}), B = t((e) => e.zoomLevel), V = t((e) => e.sidebarCollapsed), H = t((e) => e.toggleSidebar), U = !V, W = t((e) => e.setGlobalFilterValues), Ve = p((e) => {
-		W(e);
-	}, [W]), { createWidget: G } = s(y, f, { skipFetch: !0 }), K = e((e) => e.widgets), q = fe(() => {
-		let e = Array.from(K.values());
-		return y ? e.filter((e) => e.pageId === y) : e;
-	}, [K, y]), He = e((e) => e.selectedWidgetId), J = e((e) => e.selectWidget), Y = e((e) => e.addWidget), X = e((e) => e.updateWidgetPosition), Z = e((e) => e.configPanelOpen), Ue = e((e) => e.closeConfigPanel);
+		workspaceId: z,
+		apiGatewayUrl: B,
+		authToken: V,
+		enabled: F
+	}), H = t((e) => e.zoomLevel), U = t((e) => e.sidebarCollapsed), W = t((e) => e.toggleSidebar), G = !U, K = t((e) => e.setGlobalFilterValues), Ve = m((e) => {
+		K(e);
+	}, [K]), { createWidget: q } = s(b, p, { skipFetch: !0 }), J = e((e) => e.widgets), Y = fe(() => {
+		let e = Array.from(J.values());
+		return b ? e.filter((e) => e.pageId === b) : e;
+	}, [J, b]), He = e((e) => e.selectedWidgetId), X = e((e) => e.selectWidget), Z = e((e) => e.addWidget), Q = e((e) => e.updateWidgetPosition), Ue = e((e) => e.configPanelOpen), We = e((e) => e.closeConfigPanel);
 	de(() => {
-		let e = w.current;
+		let e = T.current;
 		if (!e) return;
 		let t = () => {
 			Ae(e.offsetWidth);
@@ -74,93 +75,94 @@ var y = f(function({ dashboardId: f, pageId: y, title: b, onPaste: ge, onSave: _
 		}
 		return window.addEventListener("resize", t), () => window.removeEventListener("resize", t);
 	}, []);
-	let We = p((e) => {
+	let Ge = m((e) => {
 		e.forEach((e) => {
-			X(e.i, {
+			Q(e.i, {
 				x: e.x,
 				y: e.y,
 				width: e.w,
 				height: e.h
 			});
 		});
-	}, [X]), Ge = p((e) => {
-		J(e);
-	}, [J]), Q = p(async (e, t) => {
-		k(null);
-		let n = t?.definition || (e.type ? a(e.type) : null), r = {
-			width: n?.defaultSize?.width ?? 4,
-			height: n?.defaultSize?.height ?? 4
-		}, i;
-		if (t?.position) i = t.position;
+	}, [Q]), Ke = m((e) => {
+		X(e);
+	}, [X]), $ = m(async (e, t) => {
+		A(null);
+		let n = t?.definition || (e.type ? a(e.type) : null), r = d(), i = {
+			width: Math.min(n?.defaultSize?.width ?? 4, L),
+			height: r.defaultWidgetHeight
+		}, o;
+		if (t?.position) o = t.position;
 		else {
-			let { x: e, y: t } = le(q, r, { cols: 12 });
-			i = {
+			let { x: e, y: t } = le(Y, i, { cols: L });
+			o = {
 				x: e,
 				y: t,
-				width: r.width,
-				height: r.height
+				width: i.width,
+				height: i.height
 			};
 		}
-		let o = e;
-		if (y) {
-			let t = await G({
-				pageId: y,
-				dashboardId: f,
+		let s = e;
+		if (b) {
+			let t = await q({
+				pageId: b,
+				dashboardId: p,
 				type: e.type,
-				title: e.title || C("bigconsole.dashboards.canvas.untitledWidget", "Untitled Widget"),
+				title: e.title || w("bigconsole.dashboards.canvas.untitledWidget", "Untitled Widget"),
 				description: e.description,
 				renderer: e.renderer,
 				template: e.template,
 				config: e.config || {},
-				position: i,
-				refreshInterval: e.refreshInterval ?? void 0,
-				dataSinkId: o.dataSinkId,
-				parserId: o.parserId
+				position: o,
+				refreshInterval: e.refreshInterval ?? r.defaultRefreshInterval,
+				dataSinkId: s.dataSinkId,
+				parserId: s.parserId
 			});
 			if (t) {
-				J(t.id);
+				X(t.id);
 				return;
 			}
-			k(C("bigconsole.dashboards.canvas.widgetCreateError", "Could not create the widget. Check the connection and try again."));
+			A(w("bigconsole.dashboards.canvas.widgetCreateError", "Could not create the widget. Check the connection and try again."));
 			return;
 		}
-		let s = {
+		let c = {
 			id: crypto.randomUUID(),
-			dashboardId: f,
-			pageId: y || "local",
+			dashboardId: p,
+			pageId: b || "local",
 			type: e.type,
-			title: e.title || C("bigconsole.dashboards.canvas.untitledWidget", "Untitled Widget"),
+			title: e.title || w("bigconsole.dashboards.canvas.untitledWidget", "Untitled Widget"),
 			description: e.description,
 			renderer: e.renderer,
 			template: e.template,
-			refreshInterval: e.refreshInterval,
+			refreshInterval: e.refreshInterval ?? r.defaultRefreshInterval,
 			config: e.config || {},
-			position: i,
-			positionX: i.x,
-			positionY: i.y,
-			positionWidth: i.width,
-			positionHeight: i.height,
-			dataSinkId: o.dataSinkId,
-			parserId: o.parserId,
+			position: o,
+			positionX: o.x,
+			positionY: o.y,
+			positionWidth: o.width,
+			positionHeight: o.height,
+			dataSinkId: s.dataSinkId,
+			parserId: s.parserId,
 			translations: [],
 			createdAt: (/* @__PURE__ */ new Date()).toISOString(),
 			updatedAt: (/* @__PURE__ */ new Date()).toISOString()
 		};
-		Y(s), J(s.id);
+		Z(c), X(c.id);
 	}, [
-		f,
-		y,
-		G,
-		Y,
-		J,
+		p,
+		b,
 		q,
-		C
-	]), Ke = p((e) => {
-		j(!0), M(e);
-	}, []), qe = p(() => {
-		j(!1), M(null);
-	}, []), Je = p((e) => {
-		e.preventDefault(), j(!1), M(null);
+		Z,
+		X,
+		Y,
+		L,
+		w
+	]), qe = m((e) => {
+		M(!0), N(e);
+	}, []), Je = m(() => {
+		M(!1), N(null);
+	}, []), Ye = m((e) => {
+		e.preventDefault(), M(!1), N(null);
 		try {
 			let t = e.dataTransfer.getData("application/json");
 			if (!t) return;
@@ -174,149 +176,153 @@ var y = f(function({ dashboardId: f, pageId: y, title: b, onPaste: ge, onSave: _
 				defaultConfig: r.defaultConfig,
 				defaultSize: r.defaultSize || i.defaultSize
 			});
-			let s = w.current?.getBoundingClientRect();
+			let s = T.current?.getBoundingClientRect();
 			if (!s) return;
 			let c = {
-				width: i.defaultSize.width,
-				height: i.defaultSize.height
-			}, { x: l, y: u } = ce(e.clientX, e.clientY, s, E, c, { cols: 12 }), d = {
+				width: Math.min(i.defaultSize.width, L),
+				height: d().defaultWidgetHeight
+			}, { x: l, y: u } = ce(e.clientX, e.clientY, s, D, c, { cols: L }), f = {
 				x: l,
 				y: u,
 				width: c.width,
 				height: c.height
 			};
-			Q({
+			$({
 				type: r.type,
 				title: r.name || i.name,
 				config: r.defaultConfig || i.defaultConfig
 			}, {
-				position: d,
+				position: f,
 				definition: o
 			});
 		} catch (e) {
 			console.error("Failed to handle widget drop:", e);
 		}
-	}, [E, Q]), Ye = p((e) => {
+	}, [
+		D,
+		$,
+		L
+	]), Xe = m((e) => {
 		e.preventDefault(), e.dataTransfer.dropEffect = "copy";
-	}, []), Xe = p((e, t) => {
+	}, []), Ze = m((e, t) => {
 		let n = t || a(e);
-		Q({
+		$({
 			type: e,
 			title: n.name,
 			config: n.defaultConfig
 		});
-	}, [Q]), Ze = p(() => {
-		H();
-	}, [H]), Qe = p(() => {
-		V && H(), window.requestAnimationFrame(() => {
-			let e = C("bigconsole.dashboards.widgetPalette.searchPlaceholder", "Search widgets...");
+	}, [$]), Qe = m(() => {
+		W();
+	}, [W]), $e = m(() => {
+		U && W(), window.requestAnimationFrame(() => {
+			let e = w("bigconsole.dashboards.widgetPalette.searchPlaceholder", "Search widgets...");
 			document.querySelector(`input[placeholder="${e}"]`)?.focus();
 		});
 	}, [
-		V,
-		H,
-		C
-	]), { exportPNG: $e, exportPDF: $, isExporting: et } = l({
-		containerRef: T,
-		name: b || "dashboard"
+		U,
+		W,
+		w
+	]), { exportPNG: et, exportPDF: tt, isExporting: nt } = l({
+		containerRef: E,
+		name: x || "dashboard"
 	});
-	return /* @__PURE__ */ v("div", {
+	return /* @__PURE__ */ y("div", {
 		className: "flex flex-col h-full min-w-0 overflow-hidden",
 		children: [
-			/* @__PURE__ */ _(te, {
-				dashboardId: f,
-				title: b,
-				onAddWidget: Qe,
-				onTogglePalette: Ze,
-				isPaletteOpen: U,
+			/* @__PURE__ */ v(te, {
+				dashboardId: p,
+				title: x,
+				onAddWidget: $e,
+				onTogglePalette: Qe,
+				isPaletteOpen: G,
 				onPaste: ge,
 				onSave: _e,
 				isSaving: ve,
 				onExport: ye,
 				onPublishTemplate: be,
-				onExportImage: p(() => {
-					$e();
-				}, [$e]),
-				onExportPdf: p(() => {
-					$();
-				}, [$]),
-				isExportingImage: et,
-				onShare: () => D(!0)
+				onExportImage: m(() => {
+					et();
+				}, [et]),
+				onExportPdf: m(() => {
+					tt();
+				}, [tt]),
+				isExportingImage: nt,
+				onShare: () => O(!0)
 			}),
-			O && /* @__PURE__ */ _("div", {
+			k && /* @__PURE__ */ v("div", {
 				role: "alert",
 				className: "mx-card-padding mt-control-gap flex-shrink-0",
-				children: /* @__PURE__ */ _(i, {
+				children: /* @__PURE__ */ v(i, {
 					tone: "danger",
 					padding: "compact",
 					headingLevel: 3,
 					"data-testid": "widget-create-error",
 					title: "Widget not created",
-					description: O,
-					actions: /* @__PURE__ */ _(g, {
+					description: k,
+					actions: /* @__PURE__ */ v(_, {
 						variant: "outline",
 						size: "sm",
-						onClick: () => k(null),
-						children: C("bigconsole.dashboards.canvas.dismiss", "Dismiss")
+						onClick: () => A(null),
+						children: w("bigconsole.dashboards.canvas.dismiss", "Dismiss")
 					})
 				})
 			}),
-			/* @__PURE__ */ _(ie, {
-				widgets: q,
-				isEditMode: P
+			/* @__PURE__ */ v(ie, {
+				widgets: Y,
+				isEditMode: F
 			}),
-			/* @__PURE__ */ _(re, {
-				widgets: q,
-				isEditMode: P
+			/* @__PURE__ */ v(re, {
+				widgets: Y,
+				isEditMode: F
 			}),
-			De && /* @__PURE__ */ _(ne, {
-				dashboardId: f,
+			De && /* @__PURE__ */ v(ne, {
+				dashboardId: p,
 				onFilterChange: Ve,
 				collapsible: !0
 			}),
-			Oe && (P || x.length > 0) && /* @__PURE__ */ _(ae, {
-				pages: x,
-				activePageId: xe || x[0]?.id,
-				editable: P,
+			Oe && (F || S.length > 0) && /* @__PURE__ */ v(ae, {
+				pages: S,
+				activePageId: xe || S[0]?.id,
+				editable: F,
 				onPageSelect: Se || (() => {}),
-				onPagesReorder: S ? (e) => {
-					S(e.map((e) => x.find((t) => t.id === e)).filter(Boolean));
+				onPagesReorder: C ? (e) => {
+					C(e.map((e) => S.find((t) => t.id === e)).filter(Boolean));
 				} : void 0,
 				onPageCreate: Ce,
 				onPageRename: we,
 				onPageDuplicate: Te,
 				onPageDelete: Ee
 			}),
-			/* @__PURE__ */ v("div", {
+			/* @__PURE__ */ y("div", {
 				"data-testid": "dashboard-canvas-panes",
-				className: `flex flex-1 min-w-0 overflow-hidden ${Z ? "lg:mr-[var(--bc-inspector-width,420px)]" : ""}`,
-				children: [P && /* @__PURE__ */ _(se, {
-					isOpen: U,
-					onClose: Ze,
-					onWidgetSelect: Xe,
-					onDragStart: Ke,
-					onDragEnd: qe,
+				className: `flex flex-1 min-w-0 overflow-hidden ${Ue ? "lg:mr-[var(--bc-inspector-width,420px)]" : ""}`,
+				children: [F && /* @__PURE__ */ v(se, {
+					isOpen: G,
+					onClose: Qe,
+					onWidgetSelect: Ze,
+					onDragStart: qe,
+					onDragEnd: Je,
 					installedWidgets: Re,
 					installedWidgetsLoading: ze,
 					definitions: Be
-				}), /* @__PURE__ */ v("div", {
-					ref: w,
+				}), /* @__PURE__ */ y("div", {
+					ref: T,
 					role: "region",
 					"aria-label": "Dashboard board",
 					"data-section-emphasis": "primary",
 					"data-testid": "dashboard-board",
 					className: "relative min-w-0 flex-1 overflow-auto border-2 border-transparent bg-bg-sunken motion-safe:transition-[border-color,background-color]",
-					onDrop: Je,
-					onDragOver: Ye,
+					onDrop: Ye,
+					onDragOver: Xe,
 					onClick: () => {
-						P && J(null);
+						F && X(null);
 					},
-					style: A ? {
+					style: j ? {
 						borderStyle: "dashed",
 						borderColor: "var(--color-action-primary-bg)",
 						backgroundColor: "var(--color-bg-accentSubtle)"
 					} : void 0,
-					children: [A && /* @__PURE__ */ _("div", {
+					children: [j && /* @__PURE__ */ v("div", {
 						style: {
 							position: "absolute",
 							top: "50%",
@@ -330,65 +336,66 @@ var y = f(function({ dashboardId: f, pageId: y, title: b, onPaste: ge, onSave: _
 							pointerEvents: "none",
 							zIndex: 100
 						},
-						children: /* @__PURE__ */ v("p", {
+						children: /* @__PURE__ */ y("p", {
 							style: {
 								fontSize: "var(--font-size-body-md)",
 								color: "var(--color-text-primary)",
 								margin: 0
 							},
 							children: [
-								C("bigconsole.dashboards.canvas.dropToAddBefore", "Drop to add"),
+								w("bigconsole.dashboards.canvas.dropToAddBefore", "Drop to add"),
 								" ",
-								/* @__PURE__ */ _("strong", { children: Me }),
+								/* @__PURE__ */ v("strong", { children: Me }),
 								" ",
-								C("bigconsole.dashboards.canvas.dropToAddAfter", "widget")
+								w("bigconsole.dashboards.canvas.dropToAddAfter", "widget")
 							]
 						})
-					}), /* @__PURE__ */ _("div", {
-						ref: T,
+					}), /* @__PURE__ */ v("div", {
+						ref: E,
 						className: "min-h-full origin-top-left transition-transform",
 						style: {
-							transform: `scale(${B / 100})`,
-							width: `${100 / (B / 100)}%`
+							transform: `scale(${H / 100})`,
+							width: `${100 / (H / 100)}%`
 						},
-						children: q.length > 0 ? /* @__PURE__ */ _(n, {
+						children: Y.length > 0 ? /* @__PURE__ */ v(n, {
 							enabled: ke,
 							onCrossFilter: (e) => {},
-							children: /* @__PURE__ */ _(ee, {
-								widgets: q,
-								isEditMode: P,
-								width: E,
-								onLayoutChange: We,
-								onWidgetSelect: Ge,
+							children: /* @__PURE__ */ v(ee, {
+								widgets: Y,
+								cols: L,
+								isEditMode: F,
+								width: D,
+								onLayoutChange: Ge,
+								onWidgetSelect: Ke,
 								selectedWidgetId: He
 							})
-						}) : /* @__PURE__ */ _("div", {
+						}) : /* @__PURE__ */ v("div", {
 							className: "flex min-h-[min(400px,60vh)] items-center justify-center p-card-padding",
-							children: /* @__PURE__ */ _(i, {
+							children: /* @__PURE__ */ v(i, {
 								headingLevel: 3,
 								className: "w-full max-w-md",
 								"data-testid": "dashboard-empty-board",
 								headerClassName: "mb-form-gap",
-								title: C("bigconsole.dashboards.canvas.noWidgetsTitle", "No widgets yet"),
-								description: C("bigconsole.dashboards.canvas.noWidgetsDescription", "Add widgets to build your dashboard. Click the \"Add Widget\" button to get started."),
-								children: P && /* @__PURE__ */ v(g, {
-									onClick: Qe,
-									children: [/* @__PURE__ */ _(me, { className: "size-4" }), C("bigconsole.dashboards.canvas.addWidget", "Add Widget")]
+								title: w("bigconsole.dashboards.canvas.noWidgetsTitle", "No widgets yet"),
+								description: w("bigconsole.dashboards.canvas.noWidgetsDescription", "Add widgets to build your dashboard. Click the \"Add Widget\" button to get started."),
+								children: F && /* @__PURE__ */ y(_, {
+									onClick: $e,
+									children: [/* @__PURE__ */ v(me, { className: "size-4" }), w("bigconsole.dashboards.canvas.addWidget", "Add Widget")]
 								})
 							})
 						})
 					})]
 				})]
 			}),
-			/* @__PURE__ */ _(ue, {
-				isOpen: Z,
-				onClose: Ue
+			/* @__PURE__ */ v(ue, {
+				isOpen: Ue,
+				onClose: We
 			}),
-			/* @__PURE__ */ _(oe, {
-				dashboardId: f,
-				dashboardName: b || C("bigconsole.dashboards.canvas.dashboardFallbackName", "Dashboard"),
+			/* @__PURE__ */ v(oe, {
+				dashboardId: p,
+				dashboardName: x || w("bigconsole.dashboards.canvas.dashboardFallbackName", "Dashboard"),
 				isOpen: je,
-				onClose: () => D(!1),
+				onClose: () => O(!1),
 				visibility: Ie,
 				onVisibilityChange: Le,
 				canChangeVisibility: Fe
@@ -397,6 +404,6 @@ var y = f(function({ dashboardId: f, pageId: y, title: b, onPaste: ge, onSave: _
 	});
 });
 //#endregion
-export { y as default };
+export { b as default };
 
 //# sourceMappingURL=DashboardCanvas.js.map