@foxford/ui 2.52.0-beta-2ffe7f1-20241118 → 2.53.0-beta-fc8b350-20241125

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (63) hide show
  1. package/_virtual/index7.mjs +1 -1
  2. package/_virtual/index8.js +2 -0
  3. package/_virtual/index8.js.map +1 -0
  4. package/_virtual/index8.mjs +2 -0
  5. package/_virtual/index8.mjs.map +1 -0
  6. package/components/DialogComponent/DialogComponent.js +1 -1
  7. package/components/DialogComponent/DialogComponent.js.map +1 -1
  8. package/components/DialogComponent/DialogComponent.mjs +1 -1
  9. package/components/DialogComponent/DialogComponent.mjs.map +1 -1
  10. package/components/FormInputLabel/FormInputLabel.js +1 -1
  11. package/components/FormInputLabel/FormInputLabel.js.map +1 -1
  12. package/components/FormInputLabel/FormInputLabel.mjs +1 -1
  13. package/components/FormInputLabel/FormInputLabel.mjs.map +1 -1
  14. package/components/FormInputLabel/constants.js +1 -1
  15. package/components/FormInputLabel/constants.js.map +1 -1
  16. package/components/FormInputLabel/constants.mjs +1 -1
  17. package/components/FormInputLabel/constants.mjs.map +1 -1
  18. package/components/FormInputLabel/style.js +1 -1
  19. package/components/FormInputLabel/style.js.map +1 -1
  20. package/components/FormInputLabel/style.mjs +1 -1
  21. package/components/FormInputLabel/style.mjs.map +1 -1
  22. package/components/MenuComponent/MenuComponent.js +1 -1
  23. package/components/MenuComponent/MenuComponent.js.map +1 -1
  24. package/components/MenuComponent/MenuComponent.mjs +1 -1
  25. package/components/MenuComponent/MenuComponent.mjs.map +1 -1
  26. package/components/Paper/Paper.js.map +1 -1
  27. package/components/Paper/Paper.mjs.map +1 -1
  28. package/components/Text/Ellipsis.js +1 -1
  29. package/components/Text/Ellipsis.js.map +1 -1
  30. package/components/Text/Ellipsis.mjs +1 -1
  31. package/components/Text/Ellipsis.mjs.map +1 -1
  32. package/components/Textarea/Textarea.js +1 -1
  33. package/components/Textarea/Textarea.js.map +1 -1
  34. package/components/Textarea/Textarea.mjs +1 -1
  35. package/components/Textarea/Textarea.mjs.map +1 -1
  36. package/components/Textarea/constants.js +2 -0
  37. package/components/Textarea/constants.js.map +1 -0
  38. package/components/Textarea/constants.mjs +2 -0
  39. package/components/Textarea/constants.mjs.map +1 -0
  40. package/components/Textarea/style.js +1 -1
  41. package/components/Textarea/style.js.map +1 -1
  42. package/components/Textarea/style.mjs +1 -1
  43. package/components/Textarea/style.mjs.map +1 -1
  44. package/dts/index.d.ts +95 -18
  45. package/external/.pnpm/@foxford_icon-pack@0.10.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@foxford/icon-pack/icons/ResizeHandle/index.js +2 -0
  46. package/external/.pnpm/@foxford_icon-pack@0.10.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@foxford/icon-pack/icons/ResizeHandle/index.js.map +1 -0
  47. package/external/.pnpm/@foxford_icon-pack@0.10.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@foxford/icon-pack/icons/ResizeHandle/index.mjs +2 -0
  48. package/external/.pnpm/@foxford_icon-pack@0.10.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@foxford/icon-pack/icons/ResizeHandle/index.mjs.map +1 -0
  49. package/external/.pnpm/@foxford_icon-pack@0.10.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@foxford/icon-pack/icons/WarningTriangleFill/index.js +1 -1
  50. package/external/.pnpm/@foxford_icon-pack@0.10.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@foxford/icon-pack/icons/WarningTriangleFill/index.mjs +1 -1
  51. package/hooks/useClickOutside.js +1 -1
  52. package/hooks/useClickOutside.js.map +1 -1
  53. package/hooks/useClickOutside.mjs +1 -1
  54. package/hooks/useClickOutside.mjs.map +1 -1
  55. package/hooks/useResizable.js +2 -0
  56. package/hooks/useResizable.js.map +1 -0
  57. package/hooks/useResizable.mjs +2 -0
  58. package/hooks/useResizable.mjs.map +1 -0
  59. package/package.json +1 -1
  60. package/shared/utils/misc.js +2 -0
  61. package/shared/utils/misc.js.map +1 -0
  62. package/shared/utils/misc.mjs +2 -0
  63. package/shared/utils/misc.mjs.map +1 -0
@@ -1 +1 @@
1
- {"version":3,"file":"style.js","sources":["../../../../src/components/Textarea/style.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport { property, responsiveNamedProperty } from 'mixins/responsive-property'\nimport { chooseWidthValue } from 'components/Input/helpers'\nimport { baseInputStyle } from 'components/Input/style'\nimport { focus } from 'mixins/focus'\nimport type { StyledTextareaProps } from './types'\n\nconst brandTextareaStyle = css<StyledTextareaProps>`\n ${({ theme, disabled }) => `\n display: block;\n box-sizing: border-box;\n appearance: none;\n width: auto;\n resize: none;\n cursor: ${disabled ? 'not-allowed' : 'text'};\n\n background: ${theme.colors['bg-onmain-secondary']};\n border: 1px solid ${theme.colors['border-onmain-default-large']};\n border-radius: 12px;\n padding: 12px 16px;\n\n font-style: normal;\n font-weight: 400;\n font-size: 18px;\n line-height: 24px;\n color: ${theme.colors['content-onmain-primary']};\n\n transition-property: background-color, border-color, color, caret-color;\n transition-duration: 200ms;\n transition-timing-function: ease-in;\n\n &::placeholder {\n color: ${theme.colors['content-onmain-secondary']};\n }\n\n &:disabled {\n background-color: ${theme.colors['bg-disabled-large']};\n border-color: ${theme.colors['border-disabled']};\n color: ${theme.colors['content-disabled']};\n }\n `};\n\n ${(props) =>\n props.width\n ? property(chooseWidthValue(props.width), props.fluid && props.width !== 'auto' ? 'max-width' : 'width')\n : null}\n\n ${(props) =>\n responsiveNamedProperty({\n sizes: {\n widthXS: props.widthXS,\n widthS: props.widthS,\n widthM: props.widthM,\n widthL: props.widthL,\n widthXL: props.widthXL,\n },\n cssProperty: props.fluid && props.width !== 'auto' ? 'max-width' : 'width',\n customSizeHandler: chooseWidthValue,\n })}\n\n ${({ fluid }) => fluid && 'width: 100%;'}\n\n ${({ error, theme }) =>\n error &&\n `\n background-color: ${theme.colors['alert-bg-error-100']};\n border: 1px solid ${theme.colors['alert-bg-error-500']};\n `}\n\n ${focus}\n`\n\nconst baseTextareaStyle = css`\n resize: none;\n line-height: 23px;\n padding: 16px 20px 11px;\n ${baseInputStyle}\n`\n\nexport const Root = styled.textarea.withConfig<StyledTextareaProps>({\n shouldForwardProp: (prop) =>\n !['color', 'placeholderColor', 'rounded', 'fluid', 'error', 'brandPresetUsed', 'theme'].includes(prop) &&\n !prop.includes('width'),\n})`\n ${({ brandPresetUsed }) => (brandPresetUsed ? brandTextareaStyle : baseTextareaStyle)}\n`\n"],"names":["brandTextareaStyle","css","theme","disabled","colors","props","width","property","chooseWidthValue","fluid","responsiveNamedProperty","sizes","widthXS","widthS","widthM","widthL","widthXL","cssProperty","customSizeHandler","error","focus","baseTextareaStyle","baseInputStyle","Root","styled","textarea","withConfig","shouldForwardProp","prop","includes","displayName","componentId","brandPresetUsed"],"mappings":"qWAOA,MAAMA,mBAAqBC,OAAGA,IAAA,CAAA,GAAA,IAAA,IAAA,IAAA,IAAA,IAAA,KAC1B,EAAGC,QAAOC,cAAe,+HAMfA,EAAW,cAAgB,8BAEvBD,EAAME,OAAO,kDACPF,EAAME,OAAO,kMAQxBF,EAAME,OAAO,+NAOXF,EAAME,OAAO,oFAIFF,EAAME,OAAO,8CACjBF,EAAME,OAAO,qCACpBF,EAAME,OAAO,oCAIvBC,GACDA,EAAMC,MACFC,mBAAQA,SAACC,yBAAiBH,EAAMC,OAAQD,EAAMI,OAASJ,EAAMC,QAAU,OAAS,YAAc,SAC9F,OAEHD,GACDK,2CAAwB,CACtBC,MAAO,CACLC,QAASP,EAAMO,QACfC,OAAQR,EAAMQ,OACdC,OAAQT,EAAMS,OACdC,OAAQV,EAAMU,OACdC,QAASX,EAAMW,SAEjBC,YAAaZ,EAAMI,OAASJ,EAAMC,QAAU,OAAS,YAAc,QACnEY,kBAAmBV,QAAAA,qBAGrB,EAAGC,WAAYA,GAAS,iBAExB,EAAGU,QAAOjB,WACViB,GACA,6BACsBjB,EAAME,OAAO,mDACbF,EAAME,OAAO,gCAGnCgB,MAAKA,OAGT,MAAMC,kBAAoBpB,OAAGA,IAAA,CAAA,uDAAA,IAIzBqB,MAAcA,gBAGX,MAAMC,KAAOC,gBAAAA,QAAOC,SAASC,WAAgC,CAClEC,kBAAoBC,IACjB,CAAC,QAAS,mBAAoB,UAAW,QAAS,QAAS,kBAAmB,SAASC,SAASD,KAChGA,EAAKC,SAAS,WACjBH,WAAA,CAAAI,YAAA,iBAAAC,YAAA,mBAJkBP,CAIlB,CAAA,GAAA,KACE,EAAGQ,qBAAuBA,EAAkBhC,mBAAqBqB"}
1
+ {"version":3,"file":"style.js","sources":["../../../../src/components/Textarea/style.ts"],"sourcesContent":["import styled, { createGlobalStyle } from 'styled-components'\nimport { Icon } from 'components/Icon'\nimport { baseInputStyle } from 'components/Input/style'\nimport type { TextareaProps, StyledTextareaProps, TextareaPalette, StyledResizeControlProps } from './types'\n\nconst template = (\n palette: Pick<TextareaPalette, 'color' | 'colorDisabled' | 'placeholderColor' | 'placeholderColorDisabled'>\n) => `\n color: ${palette.color};\n &:disabled {\n color: ${palette.colorDisabled};\n }\n &::placeholder {\n color: ${palette.placeholderColor};\n }\n &:disabled::placeholder {\n color: ${palette.placeholderColorDisabled};\n }\n`\n\nexport const Root = styled.textarea.withConfig<TextareaProps>({\n shouldForwardProp: (prop) =>\n !['color', 'placeholderColor', 'rounded', 'fluid', 'error'].includes(prop) && !prop.includes('width'),\n})`\n resize: none;\n line-height: 23px;\n padding: 16px 20px 11px;\n\n ${baseInputStyle}\n`\n\nexport const Textarea = styled.textarea.withConfig<StyledTextareaProps>({\n shouldForwardProp: (propKey) => !['palette'].includes(propKey),\n})`\n box-sizing: border-box;\n display: block;\n appearance: none;\n resize: none;\n overflow: auto;\n border: none;\n padding: 0;\n margin: 0;\n background-color: transparent;\n font-family: inherit;\n font-size: inherit;\n line-height: inherit;\n width: 100%;\n cursor: pointer;\n &[aria-labelledby] {\n margin-top: 0.2em;\n }\n &:disabled {\n cursor: not-allowed;\n }\n &:focus {\n outline: none;\n }\n &:focus:read-write {\n cursor: text;\n }\n ${(props) =>\n template({\n color: props.palette.color ?? props.theme.colors['content-onmain-primary'],\n placeholderColor: props.palette.placeholderColor ?? props.theme.colors['content-onmain-secondary'],\n colorDisabled: props.palette.colorDisabled ?? props.theme.colors['content-disabled'],\n placeholderColorDisabled: props.palette.placeholderColorDisabled ?? props.theme.colors['content-disabled'],\n })}\n`\n\nexport const TextareaMimic = styled.textarea`\n box-sizing: border-box;\n display: block;\n visibility: hidden;\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n appearance: none;\n resize: none;\n overflow: hidden;\n border: none;\n padding: 0;\n margin: 0;\n font-family: inherit;\n font-size: inherit;\n line-height: inherit;\n`\n\nexport const ResizeGlobals = createGlobalStyle<StyledResizeControlProps>`\n ${(props) => `\n body * {\n cursor: ${props.cursor} !important;\n user-select: none !important;\n }\n `}\n`\n\nexport const ResizeIcon = styled(Icon).withConfig<StyledResizeControlProps>({\n shouldForwardProp: (propKey) => propKey !== 'cursor',\n})`\n ${(props) => `\n position: absolute;\n right: 0px;\n bottom: 0px;\n padding: 4px;\n touch-action: none; \n cursor: ${props.cursor};\n &:focus-visible {\n outline: none;\n color: ${props.theme.colors['border-focus']};\n }\n &:focus-visible > svg {\n transform: scale(1.2);\n }\n `}\n`\n"],"names":["Root","styled","textarea","withConfig","shouldForwardProp","prop","includes","displayName","componentId","baseInputStyle","Textarea","propKey","props","template","palette","color","theme","colors","placeholderColor","colorDisabled","placeholderColorDisabled","TextareaMimic","ResizeGlobals","createGlobalStyle","cursor","ResizeIcon","default","Icon"],"mappings":"6OAoBO,MAAMA,KAAOC,gBAAAA,QAAOC,SAASC,WAA0B,CAC5DC,kBAAoBC,IACjB,CAAC,QAAS,mBAAoB,UAAW,QAAS,SAASC,SAASD,KAAUA,EAAKC,SAAS,WAC/FH,WAAA,CAAAI,YAAA,iBAAAC,YAAA,mBAHkBP,CAGlB,CAAA,uDAAA,IAKEQ,MAAAA,gBAGG,MAAMC,SAAWT,gBAAAA,QAAOC,SAASC,WAAgC,CACtEC,kBAAoBO,IAAa,CAAC,WAAWL,SAASK,KACtDR,WAAA,CAAAI,YAAA,WAAAC,YAAA,mBAFsBP,CA6BnBW,CAAAA,2VAAAA,KAAAA,IACDC,MAtDC,eADHC,EAuDW,CACPC,MAAOH,EAAME,QAAQC,OAASH,EAAMI,MAAMC,OAAO,0BACjDC,iBAAkBN,EAAME,QAAQI,kBAAoBN,EAAMI,MAAMC,OAAO,4BACvEE,cAAeP,EAAME,QAAQK,eAAiBP,EAAMI,MAAMC,OAAO,oBACjEG,yBAA0BR,EAAME,QAAQM,0BAA4BR,EAAMI,MAAMC,OAAO,sBAzD1EF,sCAEND,EAAQK,uDAGRL,EAAQI,mEAGRJ,EAAQM,mCAVnBN,KA4DI,UAGOO,cAAgBpB,gBAAAA,QAAOC,SAAQC,WAAA,CAAAI,YAAA,0BAAAC,YAAA,mBAAfP,CAiB5B,CAAA,gPAEYqB,cAAgBC,OAAiBA,kBAAA,CAAA,GAAA,KACzCX,GAAU,iCAECA,EAAMY,uEAMf,MAAMC,WAAaxB,gBAAMyB,QAACC,WAAMxB,WAAqC,CAC1EC,kBAAoBO,GAAYA,IAAY,WAC5CR,WAAA,CAAAI,YAAA,uBAAAC,YAAA,mBAFwBP,CAExB,CAAA,GAAA,KACGW,GAAU,0HAMDA,EAAMY,sEAGLZ,EAAMI,MAAMC,OAAO"}
@@ -1,2 +1,2 @@
1
- import styled,{css}from'styled-components';import{property,responsiveNamedProperty}from'../../mixins/responsive-property.mjs';import{chooseWidthValue}from'../Input/helpers.mjs';import{baseInputStyle}from'../Input/style.mjs';import{focus}from'../../mixins/focus.mjs';const brandTextareaStyle=css(["",";"," "," "," "," ",""],(({theme:o,disabled:e})=>`\n display: block;\n box-sizing: border-box;\n appearance: none;\n width: auto;\n resize: none;\n cursor: ${e?'not-allowed':'text'};\n\n background: ${o.colors['bg-onmain-secondary']};\n border: 1px solid ${o.colors['border-onmain-default-large']};\n border-radius: 12px;\n padding: 12px 16px;\n\n font-style: normal;\n font-weight: 400;\n font-size: 18px;\n line-height: 24px;\n color: ${o.colors['content-onmain-primary']};\n\n transition-property: background-color, border-color, color, caret-color;\n transition-duration: 200ms;\n transition-timing-function: ease-in;\n\n &::placeholder {\n color: ${o.colors['content-onmain-secondary']};\n }\n\n &:disabled {\n background-color: ${o.colors['bg-disabled-large']};\n border-color: ${o.colors['border-disabled']};\n color: ${o.colors['content-disabled']};\n }\n `),(o=>o.width?property(chooseWidthValue(o.width),o.fluid&&o.width!=='auto'?'max-width':'width'):null),(o=>responsiveNamedProperty({sizes:{widthXS:o.widthXS,widthS:o.widthS,widthM:o.widthM,widthL:o.widthL,widthXL:o.widthXL},cssProperty:o.fluid&&o.width!=='auto'?'max-width':'width',customSizeHandler:chooseWidthValue})),(({fluid:o})=>o&&'width: 100%;'),(({error:o,theme:e})=>o&&`\n background-color: ${e.colors['alert-bg-error-100']};\n border: 1px solid ${e.colors['alert-bg-error-500']};\n `),focus);const baseTextareaStyle=css(["resize:none;line-height:23px;padding:16px 20px 11px;",""],baseInputStyle);const Root=styled.textarea.withConfig({shouldForwardProp:o=>!['color','placeholderColor','rounded','fluid','error','brandPresetUsed','theme'].includes(o)&&!o.includes('width')}).withConfig({displayName:"Textarea__Root",componentId:"ui__sc-a4hfy5-0"})(["",""],(({brandPresetUsed:o})=>o?brandTextareaStyle:baseTextareaStyle));export{Root};
1
+ import styled,{createGlobalStyle}from'styled-components';import{baseInputStyle}from'../Input/style.mjs';import{Icon}from'../Icon/Icon.mjs';const Root=styled.textarea.withConfig({shouldForwardProp:o=>!['color','placeholderColor','rounded','fluid','error'].includes(o)&&!o.includes('width')}).withConfig({displayName:"Textarea__Root",componentId:"ui__sc-a4hfy5-0"})(["resize:none;line-height:23px;padding:16px 20px 11px;",""],baseInputStyle);const Textarea=styled.textarea.withConfig({shouldForwardProp:o=>!['palette'].includes(o)}).withConfig({displayName:"Textarea",componentId:"ui__sc-a4hfy5-1"})(["box-sizing:border-box;display:block;appearance:none;resize:none;overflow:auto;border:none;padding:0;margin:0;background-color:transparent;font-family:inherit;font-size:inherit;line-height:inherit;width:100%;cursor:pointer;&[aria-labelledby]{margin-top:0.2em;}&:disabled{cursor:not-allowed;}&:focus{outline:none;}&:focus:read-write{cursor:text;}",""],(o=>{return`\n color: ${(e={color:o.palette.color??o.theme.colors['content-onmain-primary'],placeholderColor:o.palette.placeholderColor??o.theme.colors['content-onmain-secondary'],colorDisabled:o.palette.colorDisabled??o.theme.colors['content-disabled'],placeholderColorDisabled:o.palette.placeholderColorDisabled??o.theme.colors['content-disabled']}).color};\n &:disabled {\n color: ${e.colorDisabled};\n }\n &::placeholder {\n color: ${e.placeholderColor};\n }\n &:disabled::placeholder {\n color: ${e.placeholderColorDisabled};\n }\n`;var e}));const TextareaMimic=styled.textarea.withConfig({displayName:"Textarea__TextareaMimic",componentId:"ui__sc-a4hfy5-2"})(["box-sizing:border-box;display:block;visibility:hidden;position:absolute;top:0;left:0;width:100%;appearance:none;resize:none;overflow:hidden;border:none;padding:0;margin:0;font-family:inherit;font-size:inherit;line-height:inherit;"]);const ResizeGlobals=createGlobalStyle(["",""],(o=>`\n body * {\n cursor: ${o.cursor} !important;\n user-select: none !important;\n }\n `));const ResizeIcon=styled(Icon).withConfig({shouldForwardProp:o=>o!=='cursor'}).withConfig({displayName:"Textarea__ResizeIcon",componentId:"ui__sc-a4hfy5-3"})(["",""],(o=>`\n position: absolute;\n right: 0px;\n bottom: 0px;\n padding: 4px;\n touch-action: none; \n cursor: ${o.cursor};\n &:focus-visible {\n outline: none;\n color: ${o.theme.colors['border-focus']};\n }\n &:focus-visible > svg {\n transform: scale(1.2);\n }\n `));export{ResizeGlobals,ResizeIcon,Root,Textarea,TextareaMimic};
2
2
  //# sourceMappingURL=style.mjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"style.mjs","sources":["../../../../src/components/Textarea/style.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport { property, responsiveNamedProperty } from 'mixins/responsive-property'\nimport { chooseWidthValue } from 'components/Input/helpers'\nimport { baseInputStyle } from 'components/Input/style'\nimport { focus } from 'mixins/focus'\nimport type { StyledTextareaProps } from './types'\n\nconst brandTextareaStyle = css<StyledTextareaProps>`\n ${({ theme, disabled }) => `\n display: block;\n box-sizing: border-box;\n appearance: none;\n width: auto;\n resize: none;\n cursor: ${disabled ? 'not-allowed' : 'text'};\n\n background: ${theme.colors['bg-onmain-secondary']};\n border: 1px solid ${theme.colors['border-onmain-default-large']};\n border-radius: 12px;\n padding: 12px 16px;\n\n font-style: normal;\n font-weight: 400;\n font-size: 18px;\n line-height: 24px;\n color: ${theme.colors['content-onmain-primary']};\n\n transition-property: background-color, border-color, color, caret-color;\n transition-duration: 200ms;\n transition-timing-function: ease-in;\n\n &::placeholder {\n color: ${theme.colors['content-onmain-secondary']};\n }\n\n &:disabled {\n background-color: ${theme.colors['bg-disabled-large']};\n border-color: ${theme.colors['border-disabled']};\n color: ${theme.colors['content-disabled']};\n }\n `};\n\n ${(props) =>\n props.width\n ? property(chooseWidthValue(props.width), props.fluid && props.width !== 'auto' ? 'max-width' : 'width')\n : null}\n\n ${(props) =>\n responsiveNamedProperty({\n sizes: {\n widthXS: props.widthXS,\n widthS: props.widthS,\n widthM: props.widthM,\n widthL: props.widthL,\n widthXL: props.widthXL,\n },\n cssProperty: props.fluid && props.width !== 'auto' ? 'max-width' : 'width',\n customSizeHandler: chooseWidthValue,\n })}\n\n ${({ fluid }) => fluid && 'width: 100%;'}\n\n ${({ error, theme }) =>\n error &&\n `\n background-color: ${theme.colors['alert-bg-error-100']};\n border: 1px solid ${theme.colors['alert-bg-error-500']};\n `}\n\n ${focus}\n`\n\nconst baseTextareaStyle = css`\n resize: none;\n line-height: 23px;\n padding: 16px 20px 11px;\n ${baseInputStyle}\n`\n\nexport const Root = styled.textarea.withConfig<StyledTextareaProps>({\n shouldForwardProp: (prop) =>\n !['color', 'placeholderColor', 'rounded', 'fluid', 'error', 'brandPresetUsed', 'theme'].includes(prop) &&\n !prop.includes('width'),\n})`\n ${({ brandPresetUsed }) => (brandPresetUsed ? brandTextareaStyle : baseTextareaStyle)}\n`\n"],"names":["brandTextareaStyle","css","theme","disabled","colors","props","width","property","chooseWidthValue","fluid","responsiveNamedProperty","sizes","widthXS","widthS","widthM","widthL","widthXL","cssProperty","customSizeHandler","error","focus","baseTextareaStyle","baseInputStyle","Root","styled","textarea","withConfig","shouldForwardProp","prop","includes","displayName","componentId","brandPresetUsed"],"mappings":"0QAOA,MAAMA,mBAAqBC,IAAG,CAAA,GAAA,IAAA,IAAA,IAAA,IAAA,IAAA,KAC1B,EAAGC,QAAOC,cAAe,+HAMfA,EAAW,cAAgB,8BAEvBD,EAAME,OAAO,kDACPF,EAAME,OAAO,kMAQxBF,EAAME,OAAO,+NAOXF,EAAME,OAAO,oFAIFF,EAAME,OAAO,8CACjBF,EAAME,OAAO,qCACpBF,EAAME,OAAO,oCAIvBC,GACDA,EAAMC,MACFC,SAASC,iBAAiBH,EAAMC,OAAQD,EAAMI,OAASJ,EAAMC,QAAU,OAAS,YAAc,SAC9F,OAEHD,GACDK,wBAAwB,CACtBC,MAAO,CACLC,QAASP,EAAMO,QACfC,OAAQR,EAAMQ,OACdC,OAAQT,EAAMS,OACdC,OAAQV,EAAMU,OACdC,QAASX,EAAMW,SAEjBC,YAAaZ,EAAMI,OAASJ,EAAMC,QAAU,OAAS,YAAc,QACnEY,kBAAmBV,qBAGrB,EAAGC,WAAYA,GAAS,iBAExB,EAAGU,QAAOjB,WACViB,GACA,6BACsBjB,EAAME,OAAO,mDACbF,EAAME,OAAO,gCAGnCgB,OAGJ,MAAMC,kBAAoBpB,IAAG,CAAA,uDAAA,IAIzBqB,gBAGG,MAAMC,KAAOC,OAAOC,SAASC,WAAgC,CAClEC,kBAAoBC,IACjB,CAAC,QAAS,mBAAoB,UAAW,QAAS,QAAS,kBAAmB,SAASC,SAASD,KAChGA,EAAKC,SAAS,WACjBH,WAAA,CAAAI,YAAA,iBAAAC,YAAA,mBAJkBP,CAIlB,CAAA,GAAA,KACE,EAAGQ,qBAAuBA,EAAkBhC,mBAAqBqB"}
1
+ {"version":3,"file":"style.mjs","sources":["../../../../src/components/Textarea/style.ts"],"sourcesContent":["import styled, { createGlobalStyle } from 'styled-components'\nimport { Icon } from 'components/Icon'\nimport { baseInputStyle } from 'components/Input/style'\nimport type { TextareaProps, StyledTextareaProps, TextareaPalette, StyledResizeControlProps } from './types'\n\nconst template = (\n palette: Pick<TextareaPalette, 'color' | 'colorDisabled' | 'placeholderColor' | 'placeholderColorDisabled'>\n) => `\n color: ${palette.color};\n &:disabled {\n color: ${palette.colorDisabled};\n }\n &::placeholder {\n color: ${palette.placeholderColor};\n }\n &:disabled::placeholder {\n color: ${palette.placeholderColorDisabled};\n }\n`\n\nexport const Root = styled.textarea.withConfig<TextareaProps>({\n shouldForwardProp: (prop) =>\n !['color', 'placeholderColor', 'rounded', 'fluid', 'error'].includes(prop) && !prop.includes('width'),\n})`\n resize: none;\n line-height: 23px;\n padding: 16px 20px 11px;\n\n ${baseInputStyle}\n`\n\nexport const Textarea = styled.textarea.withConfig<StyledTextareaProps>({\n shouldForwardProp: (propKey) => !['palette'].includes(propKey),\n})`\n box-sizing: border-box;\n display: block;\n appearance: none;\n resize: none;\n overflow: auto;\n border: none;\n padding: 0;\n margin: 0;\n background-color: transparent;\n font-family: inherit;\n font-size: inherit;\n line-height: inherit;\n width: 100%;\n cursor: pointer;\n &[aria-labelledby] {\n margin-top: 0.2em;\n }\n &:disabled {\n cursor: not-allowed;\n }\n &:focus {\n outline: none;\n }\n &:focus:read-write {\n cursor: text;\n }\n ${(props) =>\n template({\n color: props.palette.color ?? props.theme.colors['content-onmain-primary'],\n placeholderColor: props.palette.placeholderColor ?? props.theme.colors['content-onmain-secondary'],\n colorDisabled: props.palette.colorDisabled ?? props.theme.colors['content-disabled'],\n placeholderColorDisabled: props.palette.placeholderColorDisabled ?? props.theme.colors['content-disabled'],\n })}\n`\n\nexport const TextareaMimic = styled.textarea`\n box-sizing: border-box;\n display: block;\n visibility: hidden;\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n appearance: none;\n resize: none;\n overflow: hidden;\n border: none;\n padding: 0;\n margin: 0;\n font-family: inherit;\n font-size: inherit;\n line-height: inherit;\n`\n\nexport const ResizeGlobals = createGlobalStyle<StyledResizeControlProps>`\n ${(props) => `\n body * {\n cursor: ${props.cursor} !important;\n user-select: none !important;\n }\n `}\n`\n\nexport const ResizeIcon = styled(Icon).withConfig<StyledResizeControlProps>({\n shouldForwardProp: (propKey) => propKey !== 'cursor',\n})`\n ${(props) => `\n position: absolute;\n right: 0px;\n bottom: 0px;\n padding: 4px;\n touch-action: none; \n cursor: ${props.cursor};\n &:focus-visible {\n outline: none;\n color: ${props.theme.colors['border-focus']};\n }\n &:focus-visible > svg {\n transform: scale(1.2);\n }\n `}\n`\n"],"names":["Root","styled","textarea","withConfig","shouldForwardProp","prop","includes","displayName","componentId","baseInputStyle","Textarea","propKey","props","template","palette","color","theme","colors","placeholderColor","colorDisabled","placeholderColorDisabled","TextareaMimic","ResizeGlobals","createGlobalStyle","cursor","ResizeIcon","Icon"],"mappings":"2IAoBO,MAAMA,KAAOC,OAAOC,SAASC,WAA0B,CAC5DC,kBAAoBC,IACjB,CAAC,QAAS,mBAAoB,UAAW,QAAS,SAASC,SAASD,KAAUA,EAAKC,SAAS,WAC/FH,WAAA,CAAAI,YAAA,iBAAAC,YAAA,mBAHkBP,CAGlB,CAAA,uDAAA,IAKEQ,gBAGG,MAAMC,SAAWT,OAAOC,SAASC,WAAgC,CACtEC,kBAAoBO,IAAa,CAAC,WAAWL,SAASK,KACtDR,WAAA,CAAAI,YAAA,WAAAC,YAAA,mBAFsBP,CA6BnBW,CAAAA,2VAAAA,KAAAA,IACDC,MAtDC,eADHC,EAuDW,CACPC,MAAOH,EAAME,QAAQC,OAASH,EAAMI,MAAMC,OAAO,0BACjDC,iBAAkBN,EAAME,QAAQI,kBAAoBN,EAAMI,MAAMC,OAAO,4BACvEE,cAAeP,EAAME,QAAQK,eAAiBP,EAAMI,MAAMC,OAAO,oBACjEG,yBAA0BR,EAAME,QAAQM,0BAA4BR,EAAMI,MAAMC,OAAO,sBAzD1EF,sCAEND,EAAQK,uDAGRL,EAAQI,mEAGRJ,EAAQM,mCAVnBN,KA4DI,UAGOO,cAAgBpB,OAAOC,SAAQC,WAAA,CAAAI,YAAA,0BAAAC,YAAA,mBAAfP,CAiB5B,CAAA,gPAEYqB,cAAgBC,kBAAiB,CAAA,GAAA,KACzCX,GAAU,iCAECA,EAAMY,uEAMf,MAAMC,WAAaxB,OAAOyB,MAAMvB,WAAqC,CAC1EC,kBAAoBO,GAAYA,IAAY,WAC5CR,WAAA,CAAAI,YAAA,uBAAAC,YAAA,mBAFwBP,CAExB,CAAA,GAAA,KACGW,GAAU,0HAMDA,EAAMY,sEAGLZ,EAAMI,MAAMC,OAAO"}
package/dts/index.d.ts CHANGED
@@ -5112,27 +5112,106 @@ declare enum SizeInput {
5112
5112
  xs = 140
5113
5113
  }
5114
5114
 
5115
- interface TextareaProps extends ColorProperty, ColorProperty<'placeholderColor'>, ResponsiveNamedProperty<'width', 'auto' | keyof typeof SizeInput | number>, Omit<React.ComponentPropsWithoutRef<'textarea'>, 'color'> {
5116
- /** UI: brand (v3), or default (v2) */
5117
- preset?: ThemePreset;
5118
- /** Specifies the visible max number of lines in a text area */
5115
+ declare type TextareaSize = 'l' | 'm' | 's';
5116
+ declare type TextareaPalette = {
5117
+ color: CSSColor;
5118
+ colorDisabled: CSSColor;
5119
+ placeholderColor: CSSColor;
5120
+ placeholderColorDisabled: CSSColor;
5121
+ backgroundColor: CSSColor;
5122
+ backgroundColorHover: CSSColor;
5123
+ backgroundColorDisabled: CSSColor;
5124
+ borderColor: CSSColor;
5125
+ borderColorDisabled: CSSColor;
5126
+ };
5127
+ interface TextareaProps extends ResponsiveSizeProps<TextareaSize>, ResponsiveMarginProps, ColorProperty, ColorProperty<'placeholderColor'>, ResponsiveNamedProperty<'width', 'auto' | keyof typeof SizeInput | number>, Omit<React.ComponentPropsWithRef<'textarea'>, 'children' | 'color' | 'cols' | 'defaultValue'> {
5128
+ /**
5129
+ * Автоматически адаптировать число строк под контент
5130
+ * @default false */
5131
+ autoRows?: boolean;
5132
+ /**
5133
+ * Адаптировать цветовую схему для контрастного фона
5134
+ * @default false */
5135
+ contrast?: boolean;
5136
+ /**
5137
+ * Начальное значение контрола
5138
+ * @default undefined */
5139
+ defaultValue?: string;
5140
+ /**
5141
+ * Вариант цветовой схемы
5142
+ * @default false */
5143
+ error?: boolean;
5144
+ /**
5145
+ * Отображать компонент на одной линии с другими
5146
+ * @default false */
5147
+ inline?: boolean;
5148
+ /**
5149
+ * Текст лейбла
5150
+ * @default undefined */
5151
+ label?: React.ReactNode;
5152
+ /**
5153
+ * Положение текста лейбла
5154
+ * @default "dynamic" */
5155
+ labelPosition?: 'dynamic' | 'top';
5156
+ /**
5157
+ * Максимальное число видимых строк контента
5158
+ * @default 30 */
5119
5159
  maxRows?: number;
5120
- /** Value */
5160
+ /**
5161
+ * Колбек, который будет вызван при изменении значения контрола
5162
+ * @default undefined */
5163
+ onChange?: React.ChangeEventHandler<HTMLTextAreaElement>;
5164
+ /**
5165
+ * Кастомные цвета
5166
+ * @default undefined */
5167
+ palette?: Partial<Record<keyof TextareaPalette, Color>>;
5168
+ /**
5169
+ * Версия компонента: v3 ("brand") или v2 ("default")
5170
+ * @default "default" */
5171
+ preset?: ThemePreset;
5172
+ /**
5173
+ * Вариант цветовой схемы
5174
+ * @default true */
5175
+ primary?: boolean;
5176
+ /**
5177
+ * Число видимых строк контента
5178
+ * @default 2 */
5179
+ rows?: number;
5180
+ /**
5181
+ * Возможность изменения высоты и ширины контрола вручную
5182
+ * @default undefined */
5183
+ resize?: 'both' | 'vertical' | 'horizontal';
5184
+ /**
5185
+ * Вариант цветовой схемы
5186
+ * @default false */
5187
+ secondary?: boolean;
5188
+ /**
5189
+ * Вариант цветовой схемы
5190
+ * @default false */
5191
+ success?: boolean;
5192
+ /**
5193
+ * Текущее значение контрола (использование включает контролируемый режим)
5194
+ * @default undefined */
5121
5195
  value?: string;
5122
- /** Autosize for textarea */
5196
+ /** @ignore */
5123
5197
  autosize?: boolean;
5124
- /** Has error */
5125
- error?: boolean;
5126
- /** Take on the size of it's container */
5198
+ /** @ignore */
5127
5199
  fluid?: boolean;
5128
- /** Rounded style */
5200
+ /** @ignore */
5129
5201
  rounded?: boolean;
5130
5202
  }
5131
5203
 
5132
- declare const Textarea: {
5133
- (props: TextareaProps): JSX.Element;
5134
- displayName: string;
5135
- };
5204
+ /**
5205
+ *
5206
+ * Компонент поддерживает все атрибуты \<textarea\> элемента.
5207
+ *
5208
+ * Поддерживаются пропсы определения размеров и внешних отступов в зависимости от ширины вьюпорта.
5209
+ *
5210
+ * Можно передать "ref", который будет ассоциирован с \<textarea\>.
5211
+ *
5212
+ * Полный интерфейс можно посмотреть [тут](https://github.com/foxford/ui/blob/master/src/components/Textarea/types.ts).
5213
+ */
5214
+ declare const Textarea: React.ForwardRefExoticComponent<TextareaProps>;
5136
5215
 
5137
5216
  interface SwitcherProps extends ColorProperty<'color'>, ColorProperty<'inactiveColor'> {
5138
5217
  /** UI: brand (v3), or default (v2) */
@@ -5988,8 +6067,6 @@ interface MenuComponentProps extends ResponsiveSizeProps<MenuComponentSize>, Omi
5988
6067
  autoFocus?: unknown;
5989
6068
  /** Disable autoFocus behavior (usage discourage, unless you manage focus by yourself) */
5990
6069
  disableAutoFocus?: boolean;
5991
- /** Callback to call on unmount (can be used to restore focus on trigger component) */
5992
- onUnmount?: () => void;
5993
6070
  /** Render menu view (Menu.List, Menu.Container, or custom component) */
5994
6071
  children?: React.ReactElement | ((props: Pick<MenuComponentProps, 'size' | 'sizeXXS' | 'sizeXS' | 'sizeS' | 'sizeM' | 'sizeL' | 'sizeXL' | 'showCloseButton' | 'closeButtonProps'> & {
5995
6072
  closeFn: () => void;
@@ -7004,7 +7081,7 @@ interface PaperProps extends SpacerProps, ColorProperty, ResponsiveNamedProperty
7004
7081
  }
7005
7082
  /**
7006
7083
  * Расширен:
7007
- * - [`SpacerProps`](#/Разметка%20и%20позиционирование/Spacer)
7084
+ * - [`SpacerProps`](#/Разметка/Spacer)
7008
7085
  * - [`Color`](#/Миксины)
7009
7086
  * - [`ResponsiveNamedProperty<'padding'>`](#/Миксины)
7010
7087
  */
@@ -7887,7 +7964,7 @@ ColorProperty<'placeholderColor'>, ResponsiveNamedProperty<'width', 'auto' | key
7887
7964
  onChange?: React.ChangeEventHandler<HTMLInputElement>;
7888
7965
  /** Кастомные цвета */
7889
7966
  palette?: Partial<Record<keyof InputPalette, Color>>;
7890
- /** Версия компонента: brand (v3), or default (v2) */
7967
+ /** Версия компонента: brand (v3) или default (v2) */
7891
7968
  preset?: ThemePreset;
7892
7969
  /** Вариант цветовой схемы */
7893
7970
  primary?: boolean;
@@ -0,0 +1,2 @@
1
+ 'use strict';var index=require('../../../../../../../../_virtual/index7.js');function _interopDefault(e){return e&&e.__esModule?e:{default:e}}var require$$0__default=_interopDefault(require('react/jsx-runtime'));Object.defineProperty(index.__exports,"__esModule",{value:!0}),exports.ResizeHandle=index.__exports.ResizeHandle=void 0;const jsx_runtime_1=require$$0__default.default;function ResizeHandle(e){const{color:i,size:t,...r}=e;return(0,jsx_runtime_1.jsx)("svg",{xmlns:'http://www.w3.org/2000/svg',width:t,height:t,viewBox:'0 0 24 24',fill:i,...r,children:(0,jsx_runtime_1.jsx)("path",{fillRule:'evenodd',d:'M21.53 7.47a.75.75 0 0 1 0 1.06l-13 13a.75.75 0 0 1-1.06-1.06l13-13a.75.75 0 0 1 1.06 0Zm0 7a.75.75 0 0 1 0 1.06l-6 6a.75.75 0 1 1-1.06-1.06l6-6a.75.75 0 0 1 1.06 0Z',clipRule:'evenodd'})})}exports.ResizeHandle=index.__exports.ResizeHandle=ResizeHandle,index.__exports.default=ResizeHandle;
2
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sources":["../../../../../../../../../../node_modules/.pnpm/@foxford+icon-pack@0.10.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@foxford/icon-pack/icons/ResizeHandle/index.js"],"sourcesContent":["\"use strict\";\nObject.defineProperty(exports, \"__esModule\", { value: true });\nexports.ResizeHandle = void 0;\nconst jsx_runtime_1 = require(\"react/jsx-runtime\");\nfunction ResizeHandle(props) {\n const { color, size, ...otherProps } = props;\n return ((0, jsx_runtime_1.jsx)(\"svg\", { xmlns: 'http://www.w3.org/2000/svg', width: size, height: size, viewBox: '0 0 24 24', fill: color, ...otherProps, children: (0, jsx_runtime_1.jsx)(\"path\", { fillRule: 'evenodd', d: 'M21.53 7.47a.75.75 0 0 1 0 1.06l-13 13a.75.75 0 0 1-1.06-1.06l13-13a.75.75 0 0 1 1.06 0Zm0 7a.75.75 0 0 1 0 1.06l-6 6a.75.75 0 1 1-1.06-1.06l6-6a.75.75 0 0 1 1.06 0Z', clipRule: 'evenodd' }) }));\n}\nexports.ResizeHandle = ResizeHandle;\nexports.default = ResizeHandle;\n//# sourceMappingURL=index.js.map"],"names":["Object","defineProperty","ResizeHandle_1","value","ResizeHandle_2","__exports","ResizeHandle","jsx_runtime_1","require$$0","props","color","size","otherProps","jsx","xmlns","width","height","viewBox","fill","children","fillRule","d","clipRule","default"],"mappings":"oNACAA,OAAOC,eAAeC,MAAAA,UAAS,aAAc,CAAEC,OAAO,IAClCC,QAAAA,aAAAF,MAAAG,UAAAC,kBAAG,EACvB,MAAMC,cAAgBC,oBAAAA,QACtB,SAASF,aAAaG,GAClB,MAAMC,MAAEA,EAAKC,KAAEA,KAASC,GAAeH,EACvC,OAAQ,EAAIF,cAAcM,KAAK,MAAO,CAAEC,MAAO,6BAA8BC,MAAOJ,EAAMK,OAAQL,EAAMM,QAAS,YAAaC,KAAMR,KAAUE,EAAYO,UAAU,EAAIZ,cAAcM,KAAK,OAAQ,CAAEO,SAAU,UAAWC,EAAG,wKAAyKC,SAAU,aACpZ,CACAlB,QAAAA,aAAoBF,MAAAG,UAAAC,aAAGA,aACRJ,MAAAG,UAAAkB,QAAGjB","x_google_ignoreList":[0]}
@@ -0,0 +1,2 @@
1
+ import{__exports as ResizeHandle$1}from'../../../../../../../../_virtual/index7.mjs';import require$$0 from'react/jsx-runtime';Object.defineProperty(ResizeHandle$1,"__esModule",{value:!0});var ResizeHandle_2=ResizeHandle$1.ResizeHandle=void 0;const jsx_runtime_1=require$$0;function ResizeHandle(e){const{color:i,size:l,...s}=e;return(0,jsx_runtime_1.jsx)("svg",{xmlns:'http://www.w3.org/2000/svg',width:l,height:l,viewBox:'0 0 24 24',fill:i,...s,children:(0,jsx_runtime_1.jsx)("path",{fillRule:'evenodd',d:'M21.53 7.47a.75.75 0 0 1 0 1.06l-13 13a.75.75 0 0 1-1.06-1.06l13-13a.75.75 0 0 1 1.06 0Zm0 7a.75.75 0 0 1 0 1.06l-6 6a.75.75 0 1 1-1.06-1.06l6-6a.75.75 0 0 1 1.06 0Z',clipRule:'evenodd'})})}ResizeHandle_2=ResizeHandle$1.ResizeHandle=ResizeHandle,ResizeHandle$1.default=ResizeHandle;export{ResizeHandle_2 as ResizeHandle};
2
+ //# sourceMappingURL=index.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.mjs","sources":["../../../../../../../../../../node_modules/.pnpm/@foxford+icon-pack@0.10.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@foxford/icon-pack/icons/ResizeHandle/index.js"],"sourcesContent":["\"use strict\";\nObject.defineProperty(exports, \"__esModule\", { value: true });\nexports.ResizeHandle = void 0;\nconst jsx_runtime_1 = require(\"react/jsx-runtime\");\nfunction ResizeHandle(props) {\n const { color, size, ...otherProps } = props;\n return ((0, jsx_runtime_1.jsx)(\"svg\", { xmlns: 'http://www.w3.org/2000/svg', width: size, height: size, viewBox: '0 0 24 24', fill: color, ...otherProps, children: (0, jsx_runtime_1.jsx)(\"path\", { fillRule: 'evenodd', d: 'M21.53 7.47a.75.75 0 0 1 0 1.06l-13 13a.75.75 0 0 1-1.06-1.06l13-13a.75.75 0 0 1 1.06 0Zm0 7a.75.75 0 0 1 0 1.06l-6 6a.75.75 0 1 1-1.06-1.06l6-6a.75.75 0 0 1 1.06 0Z', clipRule: 'evenodd' }) }));\n}\nexports.ResizeHandle = ResizeHandle;\nexports.default = ResizeHandle;\n//# sourceMappingURL=index.js.map"],"names":["Object","defineProperty","ResizeHandle_1","value","ResizeHandle_2","ResizeHandle","jsx_runtime_1","require$$0","props","color","size","otherProps","jsx","xmlns","width","height","viewBox","fill","children","fillRule","d","clipRule","default"],"mappings":"+HACAA,OAAOC,eAAeC,eAAS,aAAc,CAAEC,OAAO,IAClC,IAAAC,eAAAF,eAAAG,kBAAG,EACvB,MAAMC,cAAgBC,WACtB,SAASF,aAAaG,GAClB,MAAMC,MAAEA,EAAKC,KAAEA,KAASC,GAAeH,EACvC,OAAQ,EAAIF,cAAcM,KAAK,MAAO,CAAEC,MAAO,6BAA8BC,MAAOJ,EAAMK,OAAQL,EAAMM,QAAS,YAAaC,KAAMR,KAAUE,EAAYO,UAAU,EAAIZ,cAAcM,KAAK,OAAQ,CAAEO,SAAU,UAAWC,EAAG,wKAAyKC,SAAU,aACpZ,CACAjB,eAAoBF,eAAAG,aAAGA,aACRH,eAAAoB,QAAGjB","x_google_ignoreList":[0]}
@@ -1,2 +1,2 @@
1
- 'use strict';var index=require('../../../../../../../../_virtual/index7.js');function _interopDefault(e){return e&&e.__esModule?e:{default:e}}var require$$0__default=_interopDefault(require('react/jsx-runtime'));Object.defineProperty(index.__exports,"__esModule",{value:!0}),exports.WarningTriangleFill=index.__exports.WarningTriangleFill=void 0;const jsx_runtime_1=require$$0__default.default;function WarningTriangleFill(e){const{color:i,size:r,...n}=e;return(0,jsx_runtime_1.jsx)("svg",{xmlns:'http://www.w3.org/2000/svg',width:r,height:r,viewBox:'0 0 24 24',fill:i,...n,children:(0,jsx_runtime_1.jsx)("path",{fillRule:'evenodd',d:'M13.135 2.995a2.75 2.75 0 0 0-2.27 0c-.494.224-.855.64-1.18 1.116-.322.473-.678 1.115-1.12 1.908l-4.598 8.278c-.419.753-.758 1.365-.98 1.867-.224.508-.38 1.014-.32 1.537a2.75 2.75 0 0 0 1.127 1.913c.427.308.946.417 1.498.468.547.05 1.246.05 2.109.05h9.198c.863 0 1.562 0 2.11-.05.551-.051 1.07-.16 1.497-.468a2.75 2.75 0 0 0 1.126-1.913c.061-.523-.095-1.03-.319-1.537-.222-.502-.561-1.114-.98-1.867l-4.599-8.278c-.44-.793-.797-1.435-1.12-1.908-.324-.476-.685-.892-1.179-1.116ZM13 9.382a1 1 0 1 0-2 0v4a1 1 0 1 0 2 0v-4Zm-1 6a1 1 0 0 0 0 2h.01a1 1 0 1 0 0-2H12Z',clipRule:'evenodd'})})}exports.WarningTriangleFill=index.__exports.WarningTriangleFill=WarningTriangleFill,index.__exports.default=WarningTriangleFill;
1
+ 'use strict';var index=require('../../../../../../../../_virtual/index8.js');function _interopDefault(e){return e&&e.__esModule?e:{default:e}}var require$$0__default=_interopDefault(require('react/jsx-runtime'));Object.defineProperty(index.__exports,"__esModule",{value:!0}),exports.WarningTriangleFill=index.__exports.WarningTriangleFill=void 0;const jsx_runtime_1=require$$0__default.default;function WarningTriangleFill(e){const{color:i,size:r,...n}=e;return(0,jsx_runtime_1.jsx)("svg",{xmlns:'http://www.w3.org/2000/svg',width:r,height:r,viewBox:'0 0 24 24',fill:i,...n,children:(0,jsx_runtime_1.jsx)("path",{fillRule:'evenodd',d:'M13.135 2.995a2.75 2.75 0 0 0-2.27 0c-.494.224-.855.64-1.18 1.116-.322.473-.678 1.115-1.12 1.908l-4.598 8.278c-.419.753-.758 1.365-.98 1.867-.224.508-.38 1.014-.32 1.537a2.75 2.75 0 0 0 1.127 1.913c.427.308.946.417 1.498.468.547.05 1.246.05 2.109.05h9.198c.863 0 1.562 0 2.11-.05.551-.051 1.07-.16 1.497-.468a2.75 2.75 0 0 0 1.126-1.913c.061-.523-.095-1.03-.319-1.537-.222-.502-.561-1.114-.98-1.867l-4.599-8.278c-.44-.793-.797-1.435-1.12-1.908-.324-.476-.685-.892-1.179-1.116ZM13 9.382a1 1 0 1 0-2 0v4a1 1 0 1 0 2 0v-4Zm-1 6a1 1 0 0 0 0 2h.01a1 1 0 1 0 0-2H12Z',clipRule:'evenodd'})})}exports.WarningTriangleFill=index.__exports.WarningTriangleFill=WarningTriangleFill,index.__exports.default=WarningTriangleFill;
2
2
  //# sourceMappingURL=index.js.map
@@ -1,2 +1,2 @@
1
- import{__exports as WarningTriangleFill$1}from'../../../../../../../../_virtual/index7.mjs';import require$$0 from'react/jsx-runtime';Object.defineProperty(WarningTriangleFill$1,"__esModule",{value:!0});var WarningTriangleFill_2=WarningTriangleFill$1.WarningTriangleFill=void 0;const jsx_runtime_1=require$$0;function WarningTriangleFill(i){const{color:l,size:n,...r}=i;return(0,jsx_runtime_1.jsx)("svg",{xmlns:'http://www.w3.org/2000/svg',width:n,height:n,viewBox:'0 0 24 24',fill:l,...r,children:(0,jsx_runtime_1.jsx)("path",{fillRule:'evenodd',d:'M13.135 2.995a2.75 2.75 0 0 0-2.27 0c-.494.224-.855.64-1.18 1.116-.322.473-.678 1.115-1.12 1.908l-4.598 8.278c-.419.753-.758 1.365-.98 1.867-.224.508-.38 1.014-.32 1.537a2.75 2.75 0 0 0 1.127 1.913c.427.308.946.417 1.498.468.547.05 1.246.05 2.109.05h9.198c.863 0 1.562 0 2.11-.05.551-.051 1.07-.16 1.497-.468a2.75 2.75 0 0 0 1.126-1.913c.061-.523-.095-1.03-.319-1.537-.222-.502-.561-1.114-.98-1.867l-4.599-8.278c-.44-.793-.797-1.435-1.12-1.908-.324-.476-.685-.892-1.179-1.116ZM13 9.382a1 1 0 1 0-2 0v4a1 1 0 1 0 2 0v-4Zm-1 6a1 1 0 0 0 0 2h.01a1 1 0 1 0 0-2H12Z',clipRule:'evenodd'})})}WarningTriangleFill_2=WarningTriangleFill$1.WarningTriangleFill=WarningTriangleFill,WarningTriangleFill$1.default=WarningTriangleFill;export{WarningTriangleFill_2 as WarningTriangleFill};
1
+ import{__exports as WarningTriangleFill$1}from'../../../../../../../../_virtual/index8.mjs';import require$$0 from'react/jsx-runtime';Object.defineProperty(WarningTriangleFill$1,"__esModule",{value:!0});var WarningTriangleFill_2=WarningTriangleFill$1.WarningTriangleFill=void 0;const jsx_runtime_1=require$$0;function WarningTriangleFill(i){const{color:l,size:n,...r}=i;return(0,jsx_runtime_1.jsx)("svg",{xmlns:'http://www.w3.org/2000/svg',width:n,height:n,viewBox:'0 0 24 24',fill:l,...r,children:(0,jsx_runtime_1.jsx)("path",{fillRule:'evenodd',d:'M13.135 2.995a2.75 2.75 0 0 0-2.27 0c-.494.224-.855.64-1.18 1.116-.322.473-.678 1.115-1.12 1.908l-4.598 8.278c-.419.753-.758 1.365-.98 1.867-.224.508-.38 1.014-.32 1.537a2.75 2.75 0 0 0 1.127 1.913c.427.308.946.417 1.498.468.547.05 1.246.05 2.109.05h9.198c.863 0 1.562 0 2.11-.05.551-.051 1.07-.16 1.497-.468a2.75 2.75 0 0 0 1.126-1.913c.061-.523-.095-1.03-.319-1.537-.222-.502-.561-1.114-.98-1.867l-4.599-8.278c-.44-.793-.797-1.435-1.12-1.908-.324-.476-.685-.892-1.179-1.116ZM13 9.382a1 1 0 1 0-2 0v4a1 1 0 1 0 2 0v-4Zm-1 6a1 1 0 0 0 0 2h.01a1 1 0 1 0 0-2H12Z',clipRule:'evenodd'})})}WarningTriangleFill_2=WarningTriangleFill$1.WarningTriangleFill=WarningTriangleFill,WarningTriangleFill$1.default=WarningTriangleFill;export{WarningTriangleFill_2 as WarningTriangleFill};
2
2
  //# sourceMappingURL=index.mjs.map
@@ -1,2 +1,2 @@
1
- 'use strict';var React=require('react');exports.useClickOutside=(e,t,c)=>{React.useEffect((()=>{const listener=c=>{e.current&&!e.current.contains(c.target)&&t(c)};return document.addEventListener('click',listener,c),()=>{document.removeEventListener('click',listener,c)}}),[t,c])};
1
+ 'use strict';var React=require('react');exports.useClickOutside=(e,t,c)=>{React.useEffect((()=>{const listener=c=>{e.current&&!e.current.contains(c.target)&&t(c)};return document.addEventListener('click',listener,c),()=>{document.removeEventListener('click',listener,c)}}),[e,t,c])};
2
2
  //# sourceMappingURL=useClickOutside.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"useClickOutside.js","sources":["../../../src/hooks/useClickOutside.ts"],"sourcesContent":["import { useEffect } from 'react'\nimport type { RefObject } from 'react'\n\nexport const useClickOutside = (\n ref: RefObject<HTMLElement>,\n handleClickOutside: (evt: MouseEvent) => void,\n // eslint-disable-next-line jsx-control-statements/jsx-jcs-no-undef\n listenerOptions?: AddEventListenerOptions | boolean\n) => {\n useEffect(() => {\n const listener = (evt: MouseEvent) => {\n if (ref.current && !ref.current.contains(evt.target as Node)) {\n handleClickOutside(evt)\n }\n }\n\n document.addEventListener('click', listener, listenerOptions)\n\n return () => {\n document.removeEventListener('click', listener, listenerOptions)\n }\n }, [handleClickOutside, listenerOptions])\n}\n"],"names":["useClickOutside","ref","handleClickOutside","listenerOptions","useEffect","listener","evt","current","contains","target","document","addEventListener","removeEventListener"],"mappings":"gEAG+BA,CAC7BC,EACAC,EAEAC,KAEAC,MAAAA,WAAU,KACR,MAAMC,SAAYC,IACZL,EAAIM,UAAYN,EAAIM,QAAQC,SAASF,EAAIG,SAC3CP,EAAmBI,EACrB,EAKF,OAFAI,SAASC,iBAAiB,QAASN,SAAUF,GAEtC,KACLO,SAASE,oBAAoB,QAASP,SAAUF,EAAgB,CACjE,GACA,CAACD,EAAoBC,GAAiB"}
1
+ {"version":3,"file":"useClickOutside.js","sources":["../../../src/hooks/useClickOutside.ts"],"sourcesContent":["import { useEffect } from 'react'\nimport type { RefObject } from 'react'\n\nexport const useClickOutside = (\n ref: RefObject<HTMLElement>,\n handleClickOutside: (evt: MouseEvent) => void,\n // eslint-disable-next-line jsx-control-statements/jsx-jcs-no-undef\n listenerOptions?: AddEventListenerOptions | boolean\n) => {\n useEffect(() => {\n const listener = (evt: MouseEvent) => {\n if (ref.current && !ref.current.contains(evt.target as Node)) {\n handleClickOutside(evt)\n }\n }\n\n document.addEventListener('click', listener, listenerOptions)\n\n return () => {\n document.removeEventListener('click', listener, listenerOptions)\n }\n }, [ref, handleClickOutside, listenerOptions])\n}\n"],"names":["useClickOutside","ref","handleClickOutside","listenerOptions","useEffect","listener","evt","current","contains","target","document","addEventListener","removeEventListener"],"mappings":"gEAG+BA,CAC7BC,EACAC,EAEAC,KAEAC,MAAAA,WAAU,KACR,MAAMC,SAAYC,IACZL,EAAIM,UAAYN,EAAIM,QAAQC,SAASF,EAAIG,SAC3CP,EAAmBI,EACrB,EAKF,OAFAI,SAASC,iBAAiB,QAASN,SAAUF,GAEtC,KACLO,SAASE,oBAAoB,QAASP,SAAUF,EAAgB,CACjE,GACA,CAACF,EAAKC,EAAoBC,GAAiB"}
@@ -1,2 +1,2 @@
1
- import{useEffect}from'react';const useClickOutside=(e,t,c)=>{useEffect((()=>{const listener=c=>{e.current&&!e.current.contains(c.target)&&t(c)};return document.addEventListener('click',listener,c),()=>{document.removeEventListener('click',listener,c)}}),[t,c])};export{useClickOutside};
1
+ import{useEffect}from'react';const useClickOutside=(e,t,c)=>{useEffect((()=>{const listener=c=>{e.current&&!e.current.contains(c.target)&&t(c)};return document.addEventListener('click',listener,c),()=>{document.removeEventListener('click',listener,c)}}),[e,t,c])};export{useClickOutside};
2
2
  //# sourceMappingURL=useClickOutside.mjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"useClickOutside.mjs","sources":["../../../src/hooks/useClickOutside.ts"],"sourcesContent":["import { useEffect } from 'react'\nimport type { RefObject } from 'react'\n\nexport const useClickOutside = (\n ref: RefObject<HTMLElement>,\n handleClickOutside: (evt: MouseEvent) => void,\n // eslint-disable-next-line jsx-control-statements/jsx-jcs-no-undef\n listenerOptions?: AddEventListenerOptions | boolean\n) => {\n useEffect(() => {\n const listener = (evt: MouseEvent) => {\n if (ref.current && !ref.current.contains(evt.target as Node)) {\n handleClickOutside(evt)\n }\n }\n\n document.addEventListener('click', listener, listenerOptions)\n\n return () => {\n document.removeEventListener('click', listener, listenerOptions)\n }\n }, [handleClickOutside, listenerOptions])\n}\n"],"names":["useClickOutside","ref","handleClickOutside","listenerOptions","useEffect","listener","evt","current","contains","target","document","addEventListener","removeEventListener"],"mappings":"6BAGO,MAAMA,gBAAkBA,CAC7BC,EACAC,EAEAC,KAEAC,WAAU,KACR,MAAMC,SAAYC,IACZL,EAAIM,UAAYN,EAAIM,QAAQC,SAASF,EAAIG,SAC3CP,EAAmBI,EACrB,EAKF,OAFAI,SAASC,iBAAiB,QAASN,SAAUF,GAEtC,KACLO,SAASE,oBAAoB,QAASP,SAAUF,EAAgB,CACjE,GACA,CAACD,EAAoBC,GAAiB"}
1
+ {"version":3,"file":"useClickOutside.mjs","sources":["../../../src/hooks/useClickOutside.ts"],"sourcesContent":["import { useEffect } from 'react'\nimport type { RefObject } from 'react'\n\nexport const useClickOutside = (\n ref: RefObject<HTMLElement>,\n handleClickOutside: (evt: MouseEvent) => void,\n // eslint-disable-next-line jsx-control-statements/jsx-jcs-no-undef\n listenerOptions?: AddEventListenerOptions | boolean\n) => {\n useEffect(() => {\n const listener = (evt: MouseEvent) => {\n if (ref.current && !ref.current.contains(evt.target as Node)) {\n handleClickOutside(evt)\n }\n }\n\n document.addEventListener('click', listener, listenerOptions)\n\n return () => {\n document.removeEventListener('click', listener, listenerOptions)\n }\n }, [ref, handleClickOutside, listenerOptions])\n}\n"],"names":["useClickOutside","ref","handleClickOutside","listenerOptions","useEffect","listener","evt","current","contains","target","document","addEventListener","removeEventListener"],"mappings":"6BAGO,MAAMA,gBAAkBA,CAC7BC,EACAC,EAEAC,KAEAC,WAAU,KACR,MAAMC,SAAYC,IACZL,EAAIM,UAAYN,EAAIM,QAAQC,SAASF,EAAIG,SAC3CP,EAAmBI,EACrB,EAKF,OAFAI,SAASC,iBAAiB,QAASN,SAAUF,GAEtC,KACLO,SAASE,oBAAoB,QAASP,SAAUF,EAAgB,CACjE,GACA,CAACF,EAAKC,EAAoBC,GAAiB"}
@@ -0,0 +1,2 @@
1
+ 'use strict';var React=require('react');var misc=require('../shared/utils/misc.js');var constants=require('../shared/constants.js');const ARROW_KEYS=[...constants.keyboardKeys.ArrowUp.key,...constants.keyboardKeys.ArrowRight.key,...constants.keyboardKeys.ArrowDown.key,...constants.keyboardKeys.ArrowLeft.key];exports.useResizable=({target:t,direction:e="both",minHeight:r=45,minWidth:n=90,throttleMS:i=20})=>{const c=React.useRef({pointer:{clientX:0,clientY:0},target:{_width:0,_height:0,get width(){return this._width},get height(){return this._height},set width(t){this._width=Math.max(t,n)},set height(t){this._height=Math.max(t,r)}}});const[a,h]=React.useState(!1);const commitDimensions=()=>{t.current&&(e==='horizontal'?t.current.style.width=`${c.current.target.width}px`:(e==='vertical'||(t.current.style.width=`${c.current.target.width}px`),t.current.style.height=`${c.current.target.height}px`))};const s=misc.createThrottledCallback((e=>{if(!t.current)return;const r=e.clientY-c.current.pointer.clientY;c.current.target.width=c.current.target.width+(e.clientX-c.current.pointer.clientX),c.current.target.height=c.current.target.height+r,c.current.pointer.clientX=e.clientX,c.current.pointer.clientY=e.clientY,commitDimensions()}),i);const handleResizeEnd=()=>{document.removeEventListener('pointermove',s),document.removeEventListener('pointerup',handleResizeEnd),h(!1)};return[a,e=>{if(!t.current)return;c.current.pointer.clientX=e.clientX,c.current.pointer.clientY=e.clientY;const r=t.current.getBoundingClientRect();c.current.target.width=r.width,c.current.target.height=r.height,document.addEventListener('pointermove',s),document.addEventListener('pointerup',handleResizeEnd),h(!0)},misc.createThrottledCallback((e=>{if(t.current&&ARROW_KEYS.includes(e.key)){e.preventDefault();const r=t.current.getBoundingClientRect();c.current.target.width=r.width,c.current.target.height=r.height,constants.keyboardKeys.ArrowUp.validate(e.key)?c.current.target.height=c.current.target.height-7:constants.keyboardKeys.ArrowDown.validate(e.key)?c.current.target.height=c.current.target.height+7:constants.keyboardKeys.ArrowLeft.validate(e.key)?c.current.target.width=c.current.target.width-7:constants.keyboardKeys.ArrowRight.validate(e.key)&&(c.current.target.width=c.current.target.width+7),commitDimensions()}}),i)]};
2
+ //# sourceMappingURL=useResizable.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useResizable.js","sources":["../../../src/hooks/useResizable.ts"],"sourcesContent":["import { useRef, useState } from 'react'\nimport type { RefObject } from 'react'\nimport { createThrottledCallback } from 'shared/utils/misc'\nimport { keyboardKeys } from 'shared/constants'\n\nconst ARROW_KEYS: string[] = [\n ...keyboardKeys.ArrowUp.key,\n ...keyboardKeys.ArrowRight.key,\n ...keyboardKeys.ArrowDown.key,\n ...keyboardKeys.ArrowLeft.key,\n]\n\nconst useResizable = <T extends HTMLElement, P = T>({\n target,\n direction = 'both',\n minHeight = 45,\n minWidth = 90,\n throttleMS = 20,\n}: {\n target: RefObject<T>\n direction?: 'vertical' | 'horizontal' | 'both'\n minHeight?: number\n minWidth?: number\n throttleMS?: number\n}): [boolean, React.PointerEventHandler<P>, React.KeyboardEventHandler<P>] => {\n const memo = useRef({\n pointer: {\n clientX: 0,\n clientY: 0,\n },\n target: {\n _width: 0,\n _height: 0,\n get width() {\n return this._width\n },\n get height() {\n return this._height\n },\n set width(update: number) {\n this._width = Math.max(update, minWidth)\n },\n set height(update: number) {\n this._height = Math.max(update, minHeight)\n },\n },\n })\n\n const [resizing, setResizing] = useState(false)\n\n const commitDimensions = () => {\n if (!target.current) return\n\n if (direction === 'horizontal') {\n target.current.style.width = `${memo.current.target.width}px`\n } else if (direction === 'vertical') {\n target.current.style.height = `${memo.current.target.height}px`\n } else {\n target.current.style.width = `${memo.current.target.width}px`\n target.current.style.height = `${memo.current.target.height}px`\n }\n }\n const handleResize = createThrottledCallback((evt: PointerEvent) => {\n if (!target.current) return\n\n const deltaX = evt.clientX - memo.current.pointer.clientX\n const deltaY = evt.clientY - memo.current.pointer.clientY\n\n memo.current.target.width = memo.current.target.width + deltaX\n memo.current.target.height = memo.current.target.height + deltaY\n\n memo.current.pointer.clientX = evt.clientX\n memo.current.pointer.clientY = evt.clientY\n\n commitDimensions()\n }, throttleMS)\n\n const handleResizeEnd = () => {\n document.removeEventListener('pointermove', handleResize)\n document.removeEventListener('pointerup', handleResizeEnd)\n\n setResizing(false)\n }\n\n const handleResizeStart: React.PointerEventHandler<P> = (evt) => {\n if (!target.current) return\n\n memo.current.pointer.clientX = evt.clientX\n memo.current.pointer.clientY = evt.clientY\n\n const clientRect = target.current.getBoundingClientRect()\n\n memo.current.target.width = clientRect.width\n memo.current.target.height = clientRect.height\n\n document.addEventListener('pointermove', handleResize)\n document.addEventListener('pointerup', handleResizeEnd)\n\n setResizing(true)\n }\n\n const handleResizeOnNudge: React.KeyboardEventHandler<P> = createThrottledCallback((evt) => {\n if (!target.current) return\n\n if (ARROW_KEYS.includes(evt.key)) {\n evt.preventDefault()\n\n const clientRect = target.current.getBoundingClientRect()\n\n memo.current.target.width = clientRect.width\n memo.current.target.height = clientRect.height\n\n if (keyboardKeys.ArrowUp.validate(evt.key)) {\n memo.current.target.height = memo.current.target.height - 7\n } else if (keyboardKeys.ArrowDown.validate(evt.key)) {\n memo.current.target.height = memo.current.target.height + 7\n } else if (keyboardKeys.ArrowLeft.validate(evt.key)) {\n memo.current.target.width = memo.current.target.width - 7\n } else if (keyboardKeys.ArrowRight.validate(evt.key)) {\n memo.current.target.width = memo.current.target.width + 7\n }\n\n commitDimensions()\n }\n }, throttleMS)\n\n return [resizing, handleResizeStart, handleResizeOnNudge]\n}\n\nexport { useResizable }\n"],"names":["ARROW_KEYS","keyboardKeys","ArrowUp","key","ArrowRight","ArrowDown","ArrowLeft","useResizable","target","direction","minHeight","minWidth","throttleMS","memo","useRef","pointer","clientX","clientY","_width","_height","width","this","height","update","Math","max","resizing","setResizing","useState","commitDimensions","current","style","handleResize","createThrottledCallback","evt","deltaY","handleResizeEnd","document","removeEventListener","clientRect","getBoundingClientRect","addEventListener","includes","preventDefault","validate"],"mappings":"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"}
@@ -0,0 +1,2 @@
1
+ import{useRef,useState}from'react';import{createThrottledCallback}from'../shared/utils/misc.mjs';import{keyboardKeys}from'../shared/constants.mjs';const ARROW_KEYS=[...keyboardKeys.ArrowUp.key,...keyboardKeys.ArrowRight.key,...keyboardKeys.ArrowDown.key,...keyboardKeys.ArrowLeft.key];const useResizable=({target:t,direction:e="both",minHeight:r=45,minWidth:n=90,throttleMS:i=20})=>{const c=useRef({pointer:{clientX:0,clientY:0},target:{_width:0,_height:0,get width(){return this._width},get height(){return this._height},set width(t){this._width=Math.max(t,n)},set height(t){this._height=Math.max(t,r)}}});const[h,o]=useState(!1);const commitDimensions=()=>{t.current&&(e==='horizontal'?t.current.style.width=`${c.current.target.width}px`:(e==='vertical'||(t.current.style.width=`${c.current.target.width}px`),t.current.style.height=`${c.current.target.height}px`))};const a=createThrottledCallback((e=>{if(!t.current)return;const r=e.clientY-c.current.pointer.clientY;c.current.target.width=c.current.target.width+(e.clientX-c.current.pointer.clientX),c.current.target.height=c.current.target.height+r,c.current.pointer.clientX=e.clientX,c.current.pointer.clientY=e.clientY,commitDimensions()}),i);const handleResizeEnd=()=>{document.removeEventListener('pointermove',a),document.removeEventListener('pointerup',handleResizeEnd),o(!1)};return[h,e=>{if(!t.current)return;c.current.pointer.clientX=e.clientX,c.current.pointer.clientY=e.clientY;const r=t.current.getBoundingClientRect();c.current.target.width=r.width,c.current.target.height=r.height,document.addEventListener('pointermove',a),document.addEventListener('pointerup',handleResizeEnd),o(!0)},createThrottledCallback((e=>{if(t.current&&ARROW_KEYS.includes(e.key)){e.preventDefault();const r=t.current.getBoundingClientRect();c.current.target.width=r.width,c.current.target.height=r.height,keyboardKeys.ArrowUp.validate(e.key)?c.current.target.height=c.current.target.height-7:keyboardKeys.ArrowDown.validate(e.key)?c.current.target.height=c.current.target.height+7:keyboardKeys.ArrowLeft.validate(e.key)?c.current.target.width=c.current.target.width-7:keyboardKeys.ArrowRight.validate(e.key)&&(c.current.target.width=c.current.target.width+7),commitDimensions()}}),i)]};export{useResizable};
2
+ //# sourceMappingURL=useResizable.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useResizable.mjs","sources":["../../../src/hooks/useResizable.ts"],"sourcesContent":["import { useRef, useState } from 'react'\nimport type { RefObject } from 'react'\nimport { createThrottledCallback } from 'shared/utils/misc'\nimport { keyboardKeys } from 'shared/constants'\n\nconst ARROW_KEYS: string[] = [\n ...keyboardKeys.ArrowUp.key,\n ...keyboardKeys.ArrowRight.key,\n ...keyboardKeys.ArrowDown.key,\n ...keyboardKeys.ArrowLeft.key,\n]\n\nconst useResizable = <T extends HTMLElement, P = T>({\n target,\n direction = 'both',\n minHeight = 45,\n minWidth = 90,\n throttleMS = 20,\n}: {\n target: RefObject<T>\n direction?: 'vertical' | 'horizontal' | 'both'\n minHeight?: number\n minWidth?: number\n throttleMS?: number\n}): [boolean, React.PointerEventHandler<P>, React.KeyboardEventHandler<P>] => {\n const memo = useRef({\n pointer: {\n clientX: 0,\n clientY: 0,\n },\n target: {\n _width: 0,\n _height: 0,\n get width() {\n return this._width\n },\n get height() {\n return this._height\n },\n set width(update: number) {\n this._width = Math.max(update, minWidth)\n },\n set height(update: number) {\n this._height = Math.max(update, minHeight)\n },\n },\n })\n\n const [resizing, setResizing] = useState(false)\n\n const commitDimensions = () => {\n if (!target.current) return\n\n if (direction === 'horizontal') {\n target.current.style.width = `${memo.current.target.width}px`\n } else if (direction === 'vertical') {\n target.current.style.height = `${memo.current.target.height}px`\n } else {\n target.current.style.width = `${memo.current.target.width}px`\n target.current.style.height = `${memo.current.target.height}px`\n }\n }\n const handleResize = createThrottledCallback((evt: PointerEvent) => {\n if (!target.current) return\n\n const deltaX = evt.clientX - memo.current.pointer.clientX\n const deltaY = evt.clientY - memo.current.pointer.clientY\n\n memo.current.target.width = memo.current.target.width + deltaX\n memo.current.target.height = memo.current.target.height + deltaY\n\n memo.current.pointer.clientX = evt.clientX\n memo.current.pointer.clientY = evt.clientY\n\n commitDimensions()\n }, throttleMS)\n\n const handleResizeEnd = () => {\n document.removeEventListener('pointermove', handleResize)\n document.removeEventListener('pointerup', handleResizeEnd)\n\n setResizing(false)\n }\n\n const handleResizeStart: React.PointerEventHandler<P> = (evt) => {\n if (!target.current) return\n\n memo.current.pointer.clientX = evt.clientX\n memo.current.pointer.clientY = evt.clientY\n\n const clientRect = target.current.getBoundingClientRect()\n\n memo.current.target.width = clientRect.width\n memo.current.target.height = clientRect.height\n\n document.addEventListener('pointermove', handleResize)\n document.addEventListener('pointerup', handleResizeEnd)\n\n setResizing(true)\n }\n\n const handleResizeOnNudge: React.KeyboardEventHandler<P> = createThrottledCallback((evt) => {\n if (!target.current) return\n\n if (ARROW_KEYS.includes(evt.key)) {\n evt.preventDefault()\n\n const clientRect = target.current.getBoundingClientRect()\n\n memo.current.target.width = clientRect.width\n memo.current.target.height = clientRect.height\n\n if (keyboardKeys.ArrowUp.validate(evt.key)) {\n memo.current.target.height = memo.current.target.height - 7\n } else if (keyboardKeys.ArrowDown.validate(evt.key)) {\n memo.current.target.height = memo.current.target.height + 7\n } else if (keyboardKeys.ArrowLeft.validate(evt.key)) {\n memo.current.target.width = memo.current.target.width - 7\n } else if (keyboardKeys.ArrowRight.validate(evt.key)) {\n memo.current.target.width = memo.current.target.width + 7\n }\n\n commitDimensions()\n }\n }, throttleMS)\n\n return [resizing, handleResizeStart, handleResizeOnNudge]\n}\n\nexport { useResizable }\n"],"names":["ARROW_KEYS","keyboardKeys","ArrowUp","key","ArrowRight","ArrowDown","ArrowLeft","useResizable","target","direction","minHeight","minWidth","throttleMS","memo","useRef","pointer","clientX","clientY","_width","_height","width","this","height","update","Math","max","resizing","setResizing","useState","commitDimensions","current","style","handleResize","createThrottledCallback","evt","deltaY","handleResizeEnd","document","removeEventListener","clientRect","getBoundingClientRect","addEventListener","includes","preventDefault","validate"],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@foxford/ui",
3
- "version": "2.52.0-beta-2ffe7f1-20241118",
3
+ "version": "2.53.0-beta-fc8b350-20241125",
4
4
  "description": "UI components library",
5
5
  "bugs": {
6
6
  "url": "https://github.com/foxford/ui/issues"
@@ -0,0 +1,2 @@
1
+ 'use strict';exports.createThrottledCallback=(t,e=100)=>{let l=null;return r=>{l||(l=setTimeout((()=>{l=null}),e),t(r))}};
2
+ //# sourceMappingURL=misc.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"misc.js","sources":["../../../../src/shared/utils/misc.ts"],"sourcesContent":["import type { Nullable } from 'shared/types'\n\nexport const createThrottledCallback = <T>(cb: (params: T) => void, throttleMS = 100): typeof cb => {\n let timerId: Nullable<ReturnType<typeof setTimeout>> = null\n\n return (params: T) => {\n if (timerId) return\n\n timerId = setTimeout(() => {\n timerId = null\n }, throttleMS)\n\n cb(params)\n }\n}\n"],"names":["createThrottledCallback","cb","throttleMS","timerId","params","setTimeout"],"mappings":"6CAEuCA,CAAIC,EAAyBC,EAAa,OAC/E,IAAIC,EAAmD,KAEvD,OAAQC,IACFD,IAEJA,EAAUE,YAAW,KACnBF,EAAU,IAAI,GACbD,GAEHD,EAAGG,GAAO,CACX"}
@@ -0,0 +1,2 @@
1
+ const createThrottledCallback=(t,e=100)=>{let l=null;return r=>{l||(l=setTimeout((()=>{l=null}),e),t(r))}};export{createThrottledCallback};
2
+ //# sourceMappingURL=misc.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"misc.mjs","sources":["../../../../src/shared/utils/misc.ts"],"sourcesContent":["import type { Nullable } from 'shared/types'\n\nexport const createThrottledCallback = <T>(cb: (params: T) => void, throttleMS = 100): typeof cb => {\n let timerId: Nullable<ReturnType<typeof setTimeout>> = null\n\n return (params: T) => {\n if (timerId) return\n\n timerId = setTimeout(() => {\n timerId = null\n }, throttleMS)\n\n cb(params)\n }\n}\n"],"names":["createThrottledCallback","cb","throttleMS","timerId","params","setTimeout"],"mappings":"AAEO,MAAMA,wBAA0BA,CAAIC,EAAyBC,EAAa,OAC/E,IAAIC,EAAmD,KAEvD,OAAQC,IACFD,IAEJA,EAAUE,YAAW,KACnBF,EAAU,IAAI,GACbD,GAEHD,EAAGG,GAAO,CACX"}