@punkbit/cui 0.0.248-rc.1 → 0.2.0-rc.3

package/dist/cjs/components/Flyout/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sources":["../../../../src/components/Flyout/Flyout.tsx"],"sourcesContent":["import { ReactNode } from 'react';\nimport {\n  Dialog,\n  DialogClose,\n  DialogContent,\n  DialogDescription,\n  DialogOverlay,\n  DialogPortal,\n  DialogTitle,\n  DialogTrigger,\n} from '@radix-ui/react-dialog';\nimport { Button } from '@/components/Button';\nimport type { ButtonProps } from '@/components/Button';\nimport { CodeBlock } from '@/components/CodeBlock';\nimport { Container } from '@/components/Container';\nimport type { ContainerProps } from '@/components/Container';\nimport { Icon } from '@/components/Icon';\nimport { Separator } from '@/components/Separator';\nimport { Spacer } from '@/components/Spacer';\nimport { styled } from 'styled-components';\nimport { CrossButton } from '@/components/CrossButton';\nimport { keyframes } from 'styled-components';\nimport type {\n  FlyoutProps,\n  FlyoutTriggerProps,\n  FlyoutContentProps,\n  FlyoutHeaderProps,\n  FlyoutFooterProps,\n  FlyoutSizeType,\n  FlyoutStrategy,\n  FlyoutType,\n  FlyoutAlignmentType,\n} from './Flyout.types';\n\nexport const Flyout = ({ modal = false, ...props }: FlyoutProps) => {\n  return (\n    <Dialog\n      modal={modal}\n      {...props}\n    />\n  );\n};\n\nconst Trigger = ({ children, ...props }: FlyoutTriggerProps) => {\n  return (\n    <DialogTrigger asChild>\n      <div {...props}>{children}</div>\n    </DialogTrigger>\n  );\n};\nTrigger.displayName = 'Flyout.Trigger';\nFlyout.Trigger = Trigger;\n\nconst animationWidth = () =>\n  keyframes({\n    from: { width: 0 },\n    to: { width: 'fit-content' },\n  });\n\nconst FlyoutContent = styled(DialogContent)<{\n  $size?: FlyoutSizeType;\n  $type?: FlyoutType;\n  $strategy: FlyoutStrategy;\n  $width?: string;\n  $align: FlyoutAlignmentType;\n}>`\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  overflow: hidden;\n  top: 0;\n  bottom: 0;\n  width: fit-content;\n  --flyout-width: ${({ theme, $size = 'default', $width }) =>\n    $width || theme.click.flyout.size[$size].width};\n  animation: ${animationWidth} 500ms cubic-bezier(0.16, 1, 0.3, 1) forwards;\n  ${({ theme, $strategy, $type = 'default', $align }) => `\n    ${$align === 'start' ? 'left' : 'right'}: 0;\n    max-width: 100%;\n    position: ${$strategy};\n    height: ${$strategy === 'relative' ? '100%' : 'auto'};\n    padding: 0 ${theme.click.flyout.space[$type].x}\n    gap: ${theme.click.flyout.space[$type].gap};\n    box-shadow: ${\n      $align === 'start'\n        ? theme.click.flyout.shadow.reverse\n        : theme.click.flyout.shadow.default\n    };\n    border-${$align === 'start' ? 'right' : 'left'}: 1px solid ${\n      theme.click.flyout.color.stroke.default\n    };\n    background: ${theme.click.flyout.color.background.default};\n\n    @media (max-width: 1024px) {\n      ${\n        $strategy === 'relative'\n          ? `\n            position: absolute !important;`\n          : ''\n      }\n      overflow: hidden;\n      transform: ${\n        $align === 'start'\n          ? 'translateX(calc(50px - 100%))'\n          : 'translateX(calc(100% - 50px))'\n      };\n      transition: 0.3s ease-in-out;\n      &:hover,\n      &.active,\n      &:focus-within {\n        transform: translateX(0);\n        ${$align === 'start' ? 'right' : 'left'}: auto;\n      }\n    }\n  `}\n`;\nconst FlyoutContainer = styled.div`\n  display: flex;\n  gap: 0;\n  width: var(--flyout-width);\n  max-width: 100%;\n  flex-flow: column nowrap;\n  gap: inherit;\n`;\n\nconst Content = ({\n  showOverlay = false,\n  children,\n  container,\n  strategy = 'relative',\n  size,\n  type = 'default',\n  closeOnInteractOutside = false,\n  width,\n  align = 'end',\n  onInteractOutside,\n  ...props\n}: FlyoutContentProps) => {\n  return (\n    <DialogPortal container={container}>\n      {showOverlay && <DialogOverlay className=\"DialogOverlay\" />}\n      <FlyoutContent\n        $size={size}\n        $type={type}\n        $strategy={strategy}\n        onInteractOutside={e => {\n          if (!closeOnInteractOutside) {\n            e.preventDefault();\n          }\n          if (typeof onInteractOutside === 'function') {\n            onInteractOutside(e);\n          }\n        }}\n        $width={width}\n        $align={align}\n        {...props}\n      >\n        {children}\n      </FlyoutContent>\n    </DialogPortal>\n  );\n};\nContent.displayName = 'Flyout.Content';\nFlyout.Content = Content;\n\nconst FlyoutElement = styled(Container)<{\n  $type?: FlyoutType;\n}>`\n  max-width: 100%;\n  max-width: -webkit-fill-available;\n  max-width: fill-available;\n  max-width: stretch;\n  ${({ theme, $type = 'default' }) => `\n    gap: ${theme.click.flyout.space[$type].gap};\n    padding: 0 ${theme.click.flyout.space[$type].content.x};\n  `}\n`;\n\ninterface ElementProps extends Omit<\n  ContainerProps,\n  'component' | 'padding' | 'gap' | 'orientation'\n> {\n  type?: FlyoutType;\n}\n\nconst Element = ({ type, ...props }: ElementProps) => (\n  <FlyoutElement\n    orientation=\"vertical\"\n    padding=\"none\"\n    gap=\"none\"\n    $type={type}\n    {...props}\n  />\n);\n\nElement.displayName = 'Flyout.Element';\nFlyout.Element = Element;\n\nconst FlyoutHeaderContainer = styled(Container)<{\n  $type?: FlyoutType;\n}>`\n  ${({ theme, $type = 'default' }) => `\n    row-gap: ${theme.click.flyout.space[$type].content['row-gap']};\n    column-gap: ${theme.click.flyout.space[$type].content['column-gap']};\n    padding: ${theme.click.flyout.space[$type].y} ${theme.click.flyout.space[$type].y} 0 ${theme.click.flyout.space[$type].y} ;\n  `}\n`;\n\nconst FlyoutTitle = styled(DialogTitle)<{\n  $type?: FlyoutType;\n}>`\n  ${({ theme, $type = 'default' }) => `\n    color: ${theme.click.flyout.color.title.default};\n    font: ${theme.click.flyout.typography[$type].title.default};\n    margin: 0;\n    padding: 0;\n  `}\n`;\n\nconst FlyoutDescription = styled(DialogDescription)<{\n  $type?: FlyoutType;\n}>`\n  ${({ theme, $type = 'default' }) => `\n    color: ${theme.click.flyout.color.description.default};\n    font: ${theme.click.flyout.typography[$type].description.default};\n    margin: 0;\n    padding: 0;\n  `}\n`;\n\nconst Header = ({\n  title,\n  description,\n  type,\n  children,\n  showClose = true,\n  showSeparator = true,\n  ...props\n}: FlyoutHeaderProps) => {\n  if (children) {\n    return (\n      <FlyoutContainer>\n        <FlyoutHeaderContainer\n          $type={type}\n          justifyContent=\"space-between\"\n          alignItems=\"start\"\n          padding=\"none\"\n          gap=\"none\"\n          fillWidth={false}\n          isResponsive={false}\n          {...props}\n        >\n          <Container\n            padding=\"none\"\n            gap=\"none\"\n            orientation=\"vertical\"\n            grow=\"1\"\n          >\n            {children}\n          </Container>\n          {showClose && (\n            <DialogClose asChild>\n              <CrossButton data-testid=\"flyout-header-close-btn\">\n                <Icon\n                  name=\"cross\"\n                  size={type === 'inline' ? 'md' : 'lg'}\n                />\n              </CrossButton>\n            </DialogClose>\n          )}\n        </FlyoutHeaderContainer>\n        {showSeparator && (\n          <Separator\n            data-testid=\"flyout-header-separator\"\n            size=\"lg\"\n          />\n        )}\n      </FlyoutContainer>\n    );\n  }\n\n  return (\n    <FlyoutContainer>\n      <FlyoutHeaderContainer\n        $type={type}\n        justifyContent=\"space-between\"\n        alignItems=\"start\"\n        fillWidth={false}\n        isResponsive={false}\n        {...props}\n      >\n        <Container\n          padding=\"none\"\n          gap=\"none\"\n          orientation=\"vertical\"\n          grow=\"1\"\n        >\n          <FlyoutTitle $type={type}>{title}</FlyoutTitle>\n          {description && (\n            <FlyoutDescription $type={type}>{description}</FlyoutDescription>\n          )}\n        </Container>\n        {showClose && (\n          <DialogClose asChild>\n            <CrossButton data-testid=\"flyout-header-close-btn\">\n              <Icon\n                name=\"cross\"\n                size={type === 'inline' ? 'md' : 'lg'}\n              />\n            </CrossButton>\n          </DialogClose>\n        )}\n      </FlyoutHeaderContainer>\n      {showSeparator && (\n        <Separator\n          data-testid=\"flyout-header-separator\"\n          size=\"lg\"\n        />\n      )}\n    </FlyoutContainer>\n  );\n};\nHeader.displayName = 'Flyout.Header';\nFlyout.Header = Header;\n\ntype FlyoutAlign = 'default' | 'top';\nconst FlyoutBody = styled(Container)<{ $align?: FlyoutAlign }>`\n  width: var(--flyout-width);\n  max-width: 100%;\n  margin-top: ${({ $align = 'default' }) => ($align === 'top' ? '-1rem' : 0)};\n`;\n\ninterface BodyProps extends ContainerProps {\n  align?: FlyoutAlign;\n}\n\nconst Body = ({ align, ...props }: BodyProps) => (\n  <FlyoutBody\n    overflow=\"auto\"\n    orientation=\"vertical\"\n    grow=\"1\"\n    $align={align}\n    {...props}\n  />\n);\n\nBody.displayName = 'Flyout.Body';\nFlyout.Body = Body;\n\nconst FlyoutFooter = styled(Container)<{\n  type?: FlyoutType;\n}>`\n  ${({ theme, type = 'default' }) => `\n    row-gap: ${theme.click.flyout.space[type].content['row-gap']};\n    column-gap: ${theme.click.flyout.space[type].content['column-gap']};\n    padding: ${theme.click.flyout.space[type].y} ${theme.click.flyout.space[type].content.x};\n  `}\n`;\n\ninterface FlyoutButtonProps extends Omit<ButtonProps, 'children'> {\n  children?: never;\n}\n\nconst FlyoutClose = ({\n  children,\n  ...props\n}: FlyoutButtonProps | { children?: ReactNode }) => {\n  return (\n    <DialogClose asChild>\n      {children ?? (\n        <Button\n          type=\"secondary\"\n          {...props}\n        />\n      )}\n    </DialogClose>\n  );\n};\nFlyoutClose.displayName = 'Flyout.Close';\nFlyout.Close = FlyoutClose;\n\nconst FooterContainer = styled(Container)`\n  width: var(--flyout-width);\n  max-width: 100%;\n`;\n\nconst Footer = (props: FlyoutFooterProps) => {\n  return (\n    <FooterContainer\n      gap=\"none\"\n      orientation=\"vertical\"\n      alignItems=\"end\"\n    >\n      <Separator size=\"xs\" />\n      <FlyoutFooter\n        justifyContent=\"end\"\n        gap=\"none\"\n        padding=\"none\"\n        isResponsive={false}\n        wrap=\"wrap\"\n        {...props}\n      />\n    </FooterContainer>\n  );\n};\nFooter.displayName = 'Flyout.Footer';\nFlyout.Footer = Footer;\n\nconst CustomCodeBlock = styled(CodeBlock)`\n  display: flex;\n  height: 100%;\n  pre {\n    flex: 1;\n    overflow-wrap: break-word;\n    code {\n      display: inline-block;\n      max-width: calc(100% - 1rem);\n    }\n  }\n`;\n\ninterface FlyoutCodeBlockProps extends ContainerProps {\n  language?: string;\n  statement: string;\n  showLineNumbers?: boolean;\n  showWrapButton?: boolean;\n  wrapLines?: boolean;\n  onCopy?: (value: string) => void | Promise<void>;\n  onCopyError?: (error: string) => void | Promise<void>;\n}\nconst FlyoutCodeBlock = ({\n  statement,\n  language,\n  wrapLines,\n  showLineNumbers,\n  showWrapButton,\n  onCopy,\n  onCopyError,\n  ...props\n}: FlyoutCodeBlockProps & ElementProps) => {\n  return (\n    <Element\n      fillHeight\n      {...props}\n    >\n      <CustomCodeBlock\n        wrapLines={wrapLines}\n        language={language}\n        showLineNumbers={showLineNumbers}\n        showWrapButton={showWrapButton}\n        onCopy={onCopy}\n        onCopyError={onCopyError}\n      >\n        {statement}\n      </CustomCodeBlock>\n      <Spacer size=\"xs\" />\n    </Element>\n  );\n};\n\nFlyout.CodeBlock = FlyoutCodeBlock;\n"],"names":["Flyout","modal","props","jsx","Dialog","Trigger","children","DialogTrigger","displayName","animationWidth","keyframes","from","width","to","FlyoutContent","styled","DialogContent","withConfig","componentId","theme","$size","$width","click","flyout","size","$strategy","$type","$align","space","x","gap","shadow","reverse","default","color","stroke","background","FlyoutContainer","div","Content","showOverlay","container","strategy","type","closeOnInteractOutside","align","onInteractOutside","jsxs","DialogPortal","DialogOverlay","e","preventDefault","FlyoutElement","Container","content","Element","FlyoutHeaderContainer","y","FlyoutTitle","DialogTitle","title","typography","FlyoutDescription","DialogDescription","description","Header","showClose","showSeparator","DialogClose","CrossButton","Icon","Separator","FlyoutBody","Body","FlyoutFooter","FlyoutClose","Button","Close","FooterContainer","Footer","CustomCodeBlock","CodeBlock","FlyoutCodeBlock","statement","language","wrapLines","showLineNumbers","showWrapButton","onCopy","onCopyError","Spacer"],"mappings":"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"}

package/dist/cjs/components/FormContainer/Error.cjs

@@ -0,0 +1,17 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const styledComponents = require('styled-components');
+
+const Error = styledComponents.styled.div.withConfig({
+  componentId: "sc-1p44gei-0"
+})(["", ";"], ({
+  theme
+}) => `
+  font: ${theme.click.field.typography.label.error};
+  color: ${theme.click.field.color.label.error};
+`);
+
+exports.Error = Error;
+//# sourceMappingURL=Error.cjs.map

package/dist/cjs/components/FormContainer/Error.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Error.cjs","sources":["../../../../src/components/FormContainer/Error.tsx"],"sourcesContent":["import { styled } from 'styled-components';\n\nexport const Error = styled.div`\n  ${({ theme }) => `\n  font: ${theme.click.field.typography.label.error};\n  color: ${theme.click.field.color.label.error};\n`};\n`;\n"],"names":["Error","styled","div","withConfig","componentId","theme","click","field","typography","label","error","color"],"mappings":";;;;;;AAEO,MAAMA,KAAAA,GAAQC,uBAAAA,CAAOC,GAAAA,CAAGC,UAAAA,CAAA;AAAA,EAAAC,WAAAA,EAAA;AAAA,CAAA,CAAA,CAAA,CAAA,EAAA,EAAA,GAAA,GAC3B,CAAC;AAAA,EAAEC;AAAM,CAAA,KAAM;AAAA,QAAA,EACTA,KAAAA,CAAMC,KAAAA,CAAMC,KAAAA,CAAMC,UAAAA,CAAWC,MAAMC,KAAK,CAAA;AAAA,SAAA,EACvCL,KAAAA,CAAMC,KAAAA,CAAMC,KAAAA,CAAMI,KAAAA,CAAMF,MAAMC,KAAK,CAAA;AAAA,CAC7C;;;;"}

package/dist/cjs/components/FormContainer/FormElementContainer.cjs

@@ -0,0 +1,14 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const styledComponents = require('styled-components');
+
+const FormElementContainer = styledComponents.styled.div.withConfig({
+  componentId: "sc-b3fr9j-0"
+})(["display:flex;flex-direction:column;align-items:flex-start;width:100%;width:-webkit-fill-available;width:fill-available;width:stretch;gap:", ";"], ({
+  theme
+}) => theme.click.field.space.gap);
+
+exports.FormElementContainer = FormElementContainer;
+//# sourceMappingURL=FormElementContainer.cjs.map

package/dist/cjs/components/FormContainer/FormElementContainer.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormElementContainer.cjs","sources":["../../../../src/components/FormContainer/FormElementContainer.tsx"],"sourcesContent":["import { styled } from 'styled-components';\n\nexport const FormElementContainer = styled.div`\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  width: 100%;\n  width: -webkit-fill-available;\n  width: fill-available;\n  width: stretch;\n  gap: ${({ theme }) => theme.click.field.space.gap};\n`;\n"],"names":["FormElementContainer","styled","div","withConfig","componentId","theme","click","field","space","gap"],"mappings":";;;;;;AAEO,MAAMA,oBAAAA,GAAuBC,uBAAAA,CAAOC,GAAAA,CAAGC,UAAAA,CAAA;AAAA,EAAAC,WAAAA,EAAA;AAAA,CAAA,CAAA,CAAA,CAAA,2IAAA,EAAA,GAAA,GAQrC,CAAC;AAAA,EAAEC;AAAM,CAAA,KAAMA,KAAAA,CAAMC,KAAAA,CAAMC,KAAAA,CAAMC,KAAAA,CAAMC,GAAG;;;;"}

package/dist/cjs/components/FormContainer/FormRoot.cjs

@@ -0,0 +1,28 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const styledComponents = require('styled-components');
+
+const FormRoot = styledComponents.styled.div.withConfig({
+  componentId: "sc-1fv67uv-0"
+})(["display:flex;width:100%;gap:", ";", " *{box-shadow:none;outline:none;}"], ({
+  theme
+}) => theme.click.field.space.gap, ({
+  theme,
+  $orientation = "vertical",
+  $dir = "start",
+  $addLabelPadding = false
+}) => `
+    flex-direction: ${$orientation === "horizontal" ? $dir === "start" ? "row-reverse" : "row" : $dir === "start" ? "column-reverse" : "column"};
+    align-items: flex-start;
+    ${$addLabelPadding && $orientation === "horizontal" ? `
+    label {
+      padding-top: calc(${theme.click.field.space.y} + 1px);
+      line-height: 1lh;
+    }
+    ` : ""}
+  `);
+
+exports.FormRoot = FormRoot;
+//# sourceMappingURL=FormRoot.cjs.map

package/dist/cjs/components/FormContainer/FormRoot.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormRoot.cjs","sources":["../../../../src/components/FormContainer/FormRoot.tsx"],"sourcesContent":["import { styled } from 'styled-components';\n\nexport const FormRoot = styled.div<{\n  $orientation?: 'horizontal' | 'vertical';\n  $dir?: 'start' | 'end';\n  $addLabelPadding?: boolean;\n}>`\n  display: flex;\n  width: 100%;\n  gap: ${({ theme }) => theme.click.field.space.gap};\n  ${({ theme, $orientation = 'vertical', $dir = 'start', $addLabelPadding = false }) => `\n    flex-direction: ${\n      $orientation === 'horizontal'\n        ? $dir === 'start'\n          ? 'row-reverse'\n          : 'row'\n        : $dir === 'start'\n          ? 'column-reverse'\n          : 'column'\n    };\n    align-items: flex-start;\n    ${\n      $addLabelPadding && $orientation === 'horizontal'\n        ? `\n    label {\n      padding-top: calc(${theme.click.field.space.y} + 1px);\n      line-height: 1lh;\n    }\n    `\n        : ''\n    }\n  `}\n  * {\n    box-shadow: none;\n    outline: none;\n  }\n`;\n"],"names":["FormRoot","styled","div","withConfig","componentId","theme","click","field","space","gap","$orientation","$dir","$addLabelPadding","y"],"mappings":";;;;;;AAEO,MAAMA,QAAAA,GAAWC,uBAAAA,CAAOC,GAAAA,CAAGC,UAAAA,CAAA;AAAA,EAAAC,WAAAA,EAAA;AAAA,CAAA,EAAA,CAAA,8BAAA,EAAA,GAAA,EAAA,mCAAA,GAOzB,CAAC;AAAA,EAAEC;AAAM,CAAA,KAAMA,KAAAA,CAAMC,KAAAA,CAAMC,KAAAA,CAAMC,KAAAA,CAAMC,KAC5C,CAAC;AAAA,EAAEJ,KAAAA;AAAAA,EAAOK,YAAAA,GAAe,UAAA;AAAA,EAAYC,IAAAA,GAAO,OAAA;AAAA,EAASC,gBAAAA,GAAmB;AAAM,CAAA,KAAM;AAAA,oBAAA,EAElFF,YAAAA,KAAiB,eACbC,IAAAA,KAAS,OAAA,GACP,gBACA,KAAA,GACFA,IAAAA,KAAS,OAAA,GACP,gBAAA,GACA,QAAQ,CAAA;AAAA;AAAA,IAAA,EAIdC,gBAAAA,IAAoBF,iBAAiB,YAAA,GACjC;AAAA;AAAA,wBAAA,EAEgBL,KAAAA,CAAMC,KAAAA,CAAMC,KAAAA,CAAMC,KAAAA,CAAMK,CAAC,CAAA;AAAA;AAAA;AAAA,IAAA,CAAA,GAIzC,EAAE;AAAA,EAAA,CAET;;;;"}

package/dist/cjs/components/FormContainer/index.cjs

@@ -0,0 +1,29 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const jsxRuntime = require('react/jsx-runtime');
+const Error = require('./Error.cjs');
+const FormElementContainer = require('./FormElementContainer.cjs');
+const FormRoot = require('./FormRoot.cjs');
+const Label = require('../Label/index.cjs');
+
+const FormContainer = ({
+  id,
+  label,
+  orientation,
+  dir,
+  error,
+  children,
+  addLabelPadding,
+  ...props
+}) => /* @__PURE__ */ jsxRuntime.jsxs(FormRoot.FormRoot, { $orientation: orientation, $dir: dir, $addLabelPadding: addLabelPadding, ...props, children: [
+  /* @__PURE__ */ jsxRuntime.jsxs(FormElementContainer.FormElementContainer, { children: [
+    children,
+    !!error && error !== true && /* @__PURE__ */ jsxRuntime.jsx(Error.Error, { children: error })
+  ] }),
+  label && /* @__PURE__ */ jsxRuntime.jsx(Label.Label, { htmlFor: id, error: !!error, children: label })
+] });
+
+exports.FormContainer = FormContainer;
+//# sourceMappingURL=index.cjs.map

package/dist/cjs/components/FormContainer/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sources":["../../../../src/components/FormContainer/FormContainer.tsx"],"sourcesContent":["import { Error } from './Error';\nimport { FormElementContainer } from './FormElementContainer';\nimport { FormRoot } from './FormRoot';\nimport { Label } from '@/components/Label';\nimport { FormContainerProps } from './FormContainer.types';\n\nexport const FormContainer = ({\n  id,\n  label,\n  orientation,\n  dir,\n  error,\n  children,\n  addLabelPadding,\n  ...props\n}: FormContainerProps) => (\n  <FormRoot\n    $orientation={orientation}\n    $dir={dir}\n    $addLabelPadding={addLabelPadding}\n    {...props}\n  >\n    <FormElementContainer>\n      {children}\n      {!!error && error !== true && <Error>{error}</Error>}\n    </FormElementContainer>\n    {label && (\n      <Label\n        htmlFor={id}\n        error={!!error}\n      >\n        {label}\n      </Label>\n    )}\n  </FormRoot>\n);\n"],"names":["FormContainer","id","label","orientation","dir","error","children","addLabelPadding","props","jsxs","FormRoot","FormElementContainer","jsx","Error","Label"],"mappings":";;;;;;;;;;AAMO,MAAMA,gBAAgBA,CAAC;AAAA,EAC5BC,EAAAA;AAAAA,EACAC,KAAAA;AAAAA,EACAC,WAAAA;AAAAA,EACAC,GAAAA;AAAAA,EACAC,KAAAA;AAAAA,EACAC,QAAAA;AAAAA,EACAC,eAAAA;AAAAA,EACA,GAAGC;AACe,CAAA,qBAClBC,eAAA,CAACC,qBACC,YAAA,EAAcP,WAAAA,EACd,MAAMC,GAAAA,EACN,gBAAA,EAAkBG,eAAAA,EAClB,GAAIC,KAAAA,EAEJ,QAAA,EAAA;AAAA,kBAAAC,eAAA,CAACE,yCAAA,EAAA,EACEL,QAAAA,EAAAA;AAAAA,IAAAA,QAAAA;AAAAA,IACA,CAAC,CAACD,KAAAA,IAASA,UAAU,IAAA,oBAAQO,cAAA,CAACC,eAAOR,QAAAA,EAAAA,KAAAA,EAAM;AAAA,GAAA,EAC9C,CAAA;AAAA,EACCH,KAAAA,mCACEY,WAAA,EAAA,EACC,OAAA,EAASb,IACT,KAAA,EAAO,CAAC,CAACI,KAAAA,EAERH,QAAAA,EAAAA,KAAAA,EACH;AAAA,CAAA,EAEJ;;;;"}

package/dist/cjs/components/GenericLabel/index.cjs

@@ -0,0 +1,39 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const jsxRuntime = require('react/jsx-runtime');
+const styledComponents = require('styled-components');
+
+const FormFieldLabel = styledComponents.styled.label.withConfig({
+  componentId: "sc-sar0r3-0"
+})(["", ""], ({
+  theme,
+  disabled
+}) => `
+    ${disabled ? `
+    color: ${theme.click.field.color.genericLabel.disabled};
+    font: ${theme.click.field.typography.genericLabel.disabled};
+    cursor: not-allowed;
+    ` : `
+    cursor: pointer;
+    color: ${theme.click.field.color.genericLabel.default};
+    font: ${theme.click.field.typography.genericLabel.default};
+    &:hover {
+      color: ${theme.click.field.color.genericLabel.hover};
+      font: ${theme.click.field.typography.genericLabel.hover};
+    }
+    &:focus, &:focus-within {
+      color: ${theme.click.field.color.genericLabel.active};
+      font: ${theme.click.field.typography.genericLabel.active};
+    }
+    `};
+  `);
+const GenericLabel = ({
+  disabled,
+  children,
+  ...props
+}) => /* @__PURE__ */ jsxRuntime.jsx(FormFieldLabel, { disabled, ...props, children });
+
+exports.GenericLabel = GenericLabel;
+//# sourceMappingURL=index.cjs.map

package/dist/cjs/components/GenericLabel/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sources":["../../../../src/components/GenericLabel/GenericLabel.tsx"],"sourcesContent":["import { styled } from 'styled-components';\nimport { GenericLabelProps } from './GenericLabel.types';\n\ninterface FormFieldLableProps {\n  disabled?: boolean;\n  htmlFor?: string;\n}\n\nconst FormFieldLabel = styled.label<FormFieldLableProps>`\n  ${({ theme, disabled }) => `\n    ${\n      disabled\n        ? `\n    color: ${theme.click.field.color.genericLabel.disabled};\n    font: ${theme.click.field.typography.genericLabel.disabled};\n    cursor: not-allowed;\n    `\n        : `\n    cursor: pointer;\n    color: ${theme.click.field.color.genericLabel.default};\n    font: ${theme.click.field.typography.genericLabel.default};\n    &:hover {\n      color: ${theme.click.field.color.genericLabel.hover};\n      font: ${theme.click.field.typography.genericLabel.hover};\n    }\n    &:focus, &:focus-within {\n      color: ${theme.click.field.color.genericLabel.active};\n      font: ${theme.click.field.typography.genericLabel.active};\n    }\n    `\n    };\n  `}\n`;\n\nexport const GenericLabel = ({ disabled, children, ...props }: GenericLabelProps) => (\n  <FormFieldLabel\n    disabled={disabled}\n    {...props}\n  >\n    {children}\n  </FormFieldLabel>\n);\n"],"names":["FormFieldLabel","styled","label","withConfig","componentId","theme","disabled","click","field","color","genericLabel","typography","default","hover","active","GenericLabel","children","props","jsx"],"mappings":";;;;;;;AAQA,MAAMA,cAAAA,GAAiBC,uBAAAA,CAAOC,KAAAA,CAAKC,UAAAA,CAAA;AAAA,EAAAC,WAAAA,EAAA;AAAA,CAAA,CAAA,CAAA,CAAA,EAAA,EAAA,EAAA,GAC/B,CAAC;AAAA,EAAEC,KAAAA;AAAAA,EAAOC;AAAS,CAAA,KAAM;AAAA,IAAA,EAEvBA,QAAAA,GACI;AAAA,WAAA,EACGD,KAAAA,CAAME,KAAAA,CAAMC,KAAAA,CAAMC,KAAAA,CAAMC,aAAaJ,QAAQ,CAAA;AAAA,UAAA,EAC9CD,KAAAA,CAAME,KAAAA,CAAMC,KAAAA,CAAMG,UAAAA,CAAWD,aAAaJ,QAAQ,CAAA;AAAA;AAAA,IAAA,CAAA,GAGpD;AAAA;AAAA,WAAA,EAEGD,KAAAA,CAAME,KAAAA,CAAMC,KAAAA,CAAMC,KAAAA,CAAMC,aAAaE,OAAO,CAAA;AAAA,UAAA,EAC7CP,KAAAA,CAAME,KAAAA,CAAMC,KAAAA,CAAMG,UAAAA,CAAWD,aAAaE,OAAO,CAAA;AAAA;AAAA,aAAA,EAE9CP,KAAAA,CAAME,KAAAA,CAAMC,KAAAA,CAAMC,KAAAA,CAAMC,aAAaG,KAAK,CAAA;AAAA,YAAA,EAC3CR,KAAAA,CAAME,KAAAA,CAAMC,KAAAA,CAAMG,UAAAA,CAAWD,aAAaG,KAAK,CAAA;AAAA;AAAA;AAAA,aAAA,EAG9CR,KAAAA,CAAME,KAAAA,CAAMC,KAAAA,CAAMC,KAAAA,CAAMC,aAAaI,MAAM,CAAA;AAAA,YAAA,EAC5CT,KAAAA,CAAME,KAAAA,CAAMC,KAAAA,CAAMG,UAAAA,CAAWD,aAAaI,MAAM,CAAA;AAAA;AAAA,IAAA,CAEzD,CAAA;AAAA,EAAA,CAEF,CAAA;AAGI,MAAMC,eAAeA,CAAC;AAAA,EAAET,QAAAA;AAAAA,EAAUU,QAAAA;AAAAA,EAAU,GAAGC;AAAyB,CAAA,qBAC7EC,cAAA,CAAC,cAAA,EAAA,EACC,QAAA,EACA,GAAID,OAEHD,QAAAA,EACH;;;;"}

package/dist/cjs/components/GenericMenu/index.cjs

@@ -0,0 +1,114 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const styledComponents = require('styled-components');
+
+const GenericMenuPanel = styledComponents.styled.div.withConfig({
+  componentId: "sc-15jqym3-0"
+})(["outline:none;max-width:var(--radix-", "-content-available-width);max-height:var(--radix-", "-content-available-height);overflow:hidden;display:flex;align-items:flex-start;pointer-events:auto;", ";", ";"], ({
+  $type
+}) => $type, ({
+  $type
+}) => $type, ({
+  theme
+}) => `
+    border: 1px solid ${theme.click.genericMenu.panel.color.stroke.default};
+    background: ${theme.click.genericMenu.panel.color.background.default};
+    box-shadow: ${theme.click.genericMenu.panel.shadow.default};
+    border-radius: ${theme.click.genericMenu.panel.radii.all};
+  `, ({
+  $showArrow
+}) => $showArrow ? `
+      &[data-side="bottom"] {
+        margin-top: -1px;
+      }
+      &[data-side="top"] {
+        margin-bottom: 1px;
+      }
+      &[data-side="left"] {
+        margin-right: -1px;
+      }
+      }
+      &[data-side="right"] {
+        margin-left: -1px;
+      }
+  ` : "");
+const GenericPopoverMenuPanel = styledComponents.styled.div.withConfig({
+  componentId: "sc-15jqym3-1"
+})(["outline:none;max-width:var(--radix-", "-content-available-width);max-height:var(--radix-", "-content-available-height);overflow:hidden;display:flex;flex-direction:column;align-items:flex-start;z-index:1;", " ", ";"], ({
+  $type
+}) => $type, ({
+  $type
+}) => $type, ({
+  theme
+}) => `
+    border: 1px solid ${theme.click.popover.color.panel.stroke.default};
+    background: ${theme.click.popover.color.panel.background.default};
+    padding: ${theme.click.popover.space.y} ${theme.click.popover.space.x};
+    border-radius: ${theme.click.popover.radii.all};
+    box-shadow: ${theme.click.popover.shadow.default};
+  `, ({
+  $showArrow
+}) => $showArrow ? "margin: -1px 0;" : "");
+const Arrow = styledComponents.styled.svg.withConfig({
+  componentId: "sc-15jqym3-2"
+})(["filter:drop-shadow(rgba(0,0,0,0.1) 0px 4px 6px);", ";"], ({
+  theme
+}) => `
+    fill: ${theme.click.genericMenu.panel.color.background.default};
+    stroke: ${theme.click.genericMenu.panel.color.stroke.default};
+  `);
+const GenericMenuItem = styledComponents.styled.div.withConfig({
+  componentId: "sc-15jqym3-3"
+})(["display:flex;width:100%;width:-moz-available;width:-webkit-fill-available;width:fill-available;width:stretch;align-items:center;justify-content:flex-start;cursor:default;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;&:focus{outline:none;}", ";position:relative;&:hover .dropdown-arrow,&[data-state='open'] .dropdown-arrow{left:0.5rem;}&[hidden]{display:none;}"], ({
+  theme,
+  $type = "default"
+}) => {
+  const colorKey = $type === "danger" ? "danger" : "default";
+  return `
+    padding: ${theme.click.genericMenu.item.space.y} ${theme.click.genericMenu.item.space.x};
+    gap: ${theme.click.genericMenu.item.space.gap};
+    font: ${theme.click.genericMenu.item.typography.label.default};
+    background: ${theme.click.genericMenu.item.color[colorKey].background.default};
+    color: ${theme.click.genericMenu.item.color[colorKey].text.default};
+    &[data-highlighted] {
+      font: ${theme.click.genericMenu.item.typography.label.hover};
+      background: ${theme.click.genericMenu.item.color[colorKey].background.hover};
+      color:${theme.click.genericMenu.item.color[colorKey].text.hover};
+      cursor: pointer;
+    }
+    [data-input-modality="keyboard"] &[data-highlighted] {
+      outline: 2px solid ${theme.click.global.color.accent.default};
+      outline-offset: -2px;
+    }
+    &[data-state="open"] {
+      background:${theme.click.genericMenu.item.color[colorKey].background.hover};
+      color:${theme.click.genericMenu.item.color[colorKey].text.hover};
+      font: ${theme.click.genericMenu.item.typography.label.hover};
+      cursor: pointer;
+    }
+    &[data-state="checked"], &[data-selected="true"]  {
+      background:${theme.click.genericMenu.item.color[colorKey].background.active};
+      color:${theme.click.genericMenu.item.color[colorKey].text.active};
+      font: ${theme.click.genericMenu.item.typography.label.active};
+    }
+    &[data-disabled] {
+      color:${theme.click.genericMenu.item.color[colorKey].text.disabled};
+      font: ${theme.click.genericMenu.item.typography.label.disabled};
+      pointer-events: none;
+    }
+    &:visited {
+      color: ${theme.click.genericMenu.item.color[colorKey].text.default};
+      a {
+        color: ${theme.click.genericMenu.item.color[colorKey].text.default};
+      }
+    }
+  `;
+});
+
+exports.Arrow = Arrow;
+exports.GenericMenuItem = GenericMenuItem;
+exports.GenericMenuPanel = GenericMenuPanel;
+exports.GenericPopoverMenuPanel = GenericPopoverMenuPanel;
+//# sourceMappingURL=index.cjs.map

package/dist/cjs/components/GenericMenu/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sources":["../../../../src/components/GenericMenu/GenericMenu.tsx"],"sourcesContent":["import { styled } from 'styled-components';\n\nexport const GenericMenuPanel = styled.div<{\n  $type: 'popover' | 'dropdown-menu' | 'context-menu';\n  $showArrow?: boolean;\n}>`\n  outline: none;\n  max-width: var(--radix-${({ $type }) => $type}-content-available-width);\n  max-height: var(--radix-${({ $type }) => $type}-content-available-height);\n  overflow: hidden;\n  display: flex;\n  align-items: flex-start;\n  pointer-events: auto;\n\n  ${({ theme }) => `\n    border: 1px solid ${theme.click.genericMenu.panel.color.stroke.default};\n    background: ${theme.click.genericMenu.panel.color.background.default};\n    box-shadow: ${theme.click.genericMenu.panel.shadow.default};\n    border-radius: ${theme.click.genericMenu.panel.radii.all};\n  `};\n  ${({ $showArrow }) =>\n    $showArrow\n      ? `\n      &[data-side=\"bottom\"] {\n        margin-top: -1px;\n      }\n      &[data-side=\"top\"] {\n        margin-bottom: 1px;\n      }\n      &[data-side=\"left\"] {\n        margin-right: -1px;\n      }\n      }\n      &[data-side=\"right\"] {\n        margin-left: -1px;\n      }\n  `\n      : ''};\n`;\n\nexport const GenericPopoverMenuPanel = styled.div<{\n  $type: 'popover' | 'hover-card';\n  $showArrow?: boolean;\n}>`\n  outline: none;\n  max-width: var(--radix-${({ $type }) => $type}-content-available-width);\n  max-height: var(--radix-${({ $type }) => $type}-content-available-height);\n  overflow: hidden;\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  z-index: 1;\n\n  ${({ theme }) => `\n    border: 1px solid ${theme.click.popover.color.panel.stroke.default};\n    background: ${theme.click.popover.color.panel.background.default};\n    padding: ${theme.click.popover.space.y} ${theme.click.popover.space.x};\n    border-radius: ${theme.click.popover.radii.all};\n    box-shadow: ${theme.click.popover.shadow.default};\n  `}\n  ${({ $showArrow }) => ($showArrow ? 'margin: -1px 0;' : '')};\n`;\n\nexport const Arrow = styled.svg`\n  filter: drop-shadow(rgba(0, 0, 0, 0.1) 0px 4px 6px);\n  ${({ theme }) => `\n    fill: ${theme.click.genericMenu.panel.color.background.default};\n    stroke: ${theme.click.genericMenu.panel.color.stroke.default};\n  `};\n`;\n\nexport const GenericMenuItem = styled.div<{ $type?: 'default' | 'danger' }>`\n  display: flex;\n  width: 100%;\n  width: -moz-available;\n  width: -webkit-fill-available;\n  width: fill-available;\n  width: stretch;\n  align-items: center;\n  justify-content: flex-start;\n  cursor: default;\n  overflow: hidden;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n  &:focus {\n    outline: none;\n  }\n\n  ${({ theme, $type = 'default' }) => {\n    const colorKey = $type === 'danger' ? 'danger' : 'default';\n    return `\n    padding: ${theme.click.genericMenu.item.space.y} ${theme.click.genericMenu.item.space.x};\n    gap: ${theme.click.genericMenu.item.space.gap};\n    font: ${theme.click.genericMenu.item.typography.label.default};\n    background: ${theme.click.genericMenu.item.color[colorKey].background.default};\n    color: ${theme.click.genericMenu.item.color[colorKey].text.default};\n    &[data-highlighted] {\n      font: ${theme.click.genericMenu.item.typography.label.hover};\n      background: ${theme.click.genericMenu.item.color[colorKey].background.hover};\n      color:${theme.click.genericMenu.item.color[colorKey].text.hover};\n      cursor: pointer;\n    }\n    [data-input-modality=\"keyboard\"] &[data-highlighted] {\n      outline: 2px solid ${theme.click.global.color.accent.default};\n      outline-offset: -2px;\n    }\n    &[data-state=\"open\"] {\n      background:${theme.click.genericMenu.item.color[colorKey].background.hover};\n      color:${theme.click.genericMenu.item.color[colorKey].text.hover};\n      font: ${theme.click.genericMenu.item.typography.label.hover};\n      cursor: pointer;\n    }\n    &[data-state=\"checked\"], &[data-selected=\"true\"]  {\n      background:${theme.click.genericMenu.item.color[colorKey].background.active};\n      color:${theme.click.genericMenu.item.color[colorKey].text.active};\n      font: ${theme.click.genericMenu.item.typography.label.active};\n    }\n    &[data-disabled] {\n      color:${theme.click.genericMenu.item.color[colorKey].text.disabled};\n      font: ${theme.click.genericMenu.item.typography.label.disabled};\n      pointer-events: none;\n    }\n    &:visited {\n      color: ${theme.click.genericMenu.item.color[colorKey].text.default};\n      a {\n        color: ${theme.click.genericMenu.item.color[colorKey].text.default};\n      }\n    }\n  `;\n  }};\n  position: relative;\n  &:hover .dropdown-arrow,\n  &[data-state='open'] .dropdown-arrow {\n    left: 0.5rem;\n  }\n  &[hidden] {\n    display: none;\n  }\n`;\n"],"names":["GenericMenuPanel","styled","div","withConfig","componentId","$type","theme","click","genericMenu","panel","color","stroke","default","background","shadow","radii","all","$showArrow","GenericPopoverMenuPanel","popover","space","y","x","Arrow","svg","GenericMenuItem","colorKey","item","gap","typography","label","text","hover","global","accent","active","disabled"],"mappings":"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"}

package/dist/cjs/components/Grid/Cell.cjs

@@ -0,0 +1,73 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const jsxRuntime = require('react/jsx-runtime');
+const react = require('react');
+const reactWindow = require('react-window');
+const StyledCell = require('./StyledCell.cjs');
+
+const Cell = react.memo(({
+  data,
+  rowIndex,
+  columnIndex,
+  style,
+  ...props
+}) => {
+  const {
+    cell: CellData,
+    getSelectionType,
+    focus,
+    columnCount,
+    rowCount,
+    showRowNumber,
+    showHeader,
+    rowHeight,
+    rowStart,
+    rowAutoHeight,
+    updateRowHeight
+  } = data;
+  const currentRowIndex = rowIndex + rowStart;
+  const {
+    row: focusedRow,
+    column: focusedColumn
+  } = focus;
+  const isFocused = columnIndex === focusedColumn && currentRowIndex === focusedRow;
+  const rightOfFocus = columnIndex - 1 === focusedColumn && currentRowIndex === focusedRow;
+  const belowFocus = columnIndex === focusedColumn && currentRowIndex - 1 === focusedRow;
+  const selectionType = getSelectionType({
+    row: currentRowIndex,
+    column: columnIndex,
+    type: "cell"
+  });
+  const rightSelection = getSelectionType({
+    row: currentRowIndex,
+    column: columnIndex - 1,
+    type: "cell"
+  });
+  const belowSelection = getSelectionType({
+    row: currentRowIndex - 1,
+    column: columnIndex,
+    type: "cell"
+  });
+  const rightOfSelectionBorder = (selectionType === "selectDirect" || rightSelection === "selectDirect") && selectionType !== rightSelection;
+  const belowSelectionBorder = (selectionType === "selectDirect" || belowSelection === "selectDirect") && selectionType !== belowSelection;
+  const selectionBorderLeft = rightOfSelectionBorder || rightOfFocus || isFocused;
+  const selectionBorderTop = belowSelectionBorder || belowFocus || isFocused;
+  const cellRef = react.useRef(null);
+  react.useEffect(() => {
+    if (!rowAutoHeight || !cellRef.current) {
+      return;
+    }
+    const height = cellRef.current.getBoundingClientRect().height;
+    updateRowHeight(rowIndex, height);
+  }, [updateRowHeight, rowIndex, rowAutoHeight]);
+  const styleWithHeight = {
+    ...style,
+    height: "auto"
+  };
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { style: styleWithHeight, "data-row": currentRowIndex, "data-column": columnIndex, ref: cellRef, children: /* @__PURE__ */ jsxRuntime.jsx(StyledCell.StyledCell, { as: CellData, rowIndex: currentRowIndex, columnIndex, type: "row-cell", "data-selected": isFocused || selectionType === "selectDirect", "data-focused": isFocused, $isSelectedTop: selectionBorderTop, $isSelectedLeft: selectionBorderLeft, $isFocused: isFocused, $isLastRow: rowCount - 1 === rowIndex, $isLastColumn: columnCount - 1 === columnIndex, $isFirstColumn: columnIndex === 0 && !showRowNumber, $isFirstRow: rowIndex === 0 && !showHeader, $selectionType: selectionType, $height: rowHeight, "data-grid-row": currentRowIndex, "data-grid-column": columnIndex, $showBorder: true, $rowAutoHeight: rowAutoHeight, ...props }) });
+}, reactWindow.areEqual);
+
+exports.Cell = Cell;
+//# sourceMappingURL=Cell.cjs.map

package/dist/cjs/components/Grid/Cell.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Cell.cjs","sources":["../../../../src/components/Grid/Cell.tsx"],"sourcesContent":["import { memo, useEffect, useRef } from 'react';\nimport { GridChildComponentProps, areEqual } from 'react-window';\nimport { ItemDataType } from './types';\nimport { StyledCell } from './StyledCell';\n\ntype CellProps = GridChildComponentProps<ItemDataType> & {\n  width: number;\n};\n\nexport const Cell = memo(\n  ({ data, rowIndex, columnIndex, style, ...props }: CellProps) => {\n    const {\n      cell: CellData,\n      getSelectionType,\n      focus,\n      columnCount,\n      rowCount,\n      showRowNumber,\n      showHeader,\n      rowHeight,\n      rowStart,\n      rowAutoHeight,\n      updateRowHeight,\n    } = data;\n\n    const currentRowIndex = rowIndex + rowStart;\n    const { row: focusedRow, column: focusedColumn } = focus;\n    const isFocused = columnIndex === focusedColumn && currentRowIndex === focusedRow;\n    const rightOfFocus =\n      columnIndex - 1 === focusedColumn && currentRowIndex === focusedRow;\n    const belowFocus =\n      columnIndex === focusedColumn && currentRowIndex - 1 === focusedRow;\n\n    const selectionType = getSelectionType({\n      row: currentRowIndex,\n      column: columnIndex,\n      type: 'cell',\n    });\n    const rightSelection = getSelectionType({\n      row: currentRowIndex,\n      column: columnIndex - 1,\n      type: 'cell',\n    });\n    const belowSelection = getSelectionType({\n      row: currentRowIndex - 1,\n      column: columnIndex,\n      type: 'cell',\n    });\n    const rightOfSelectionBorder =\n      (selectionType === 'selectDirect' || rightSelection === 'selectDirect') &&\n      selectionType !== rightSelection;\n    const belowSelectionBorder =\n      (selectionType === 'selectDirect' || belowSelection === 'selectDirect') &&\n      selectionType !== belowSelection;\n\n    const selectionBorderLeft = rightOfSelectionBorder || rightOfFocus || isFocused;\n    const selectionBorderTop = belowSelectionBorder || belowFocus || isFocused;\n\n    const cellRef = useRef<HTMLDivElement>(null);\n\n    useEffect(() => {\n      if (!rowAutoHeight || !cellRef.current) {\n        return;\n      }\n      const height = cellRef.current.getBoundingClientRect().height;\n      updateRowHeight(rowIndex, height);\n    }, [updateRowHeight, rowIndex, rowAutoHeight]);\n\n    const styleWithHeight = {\n      ...style,\n      height: 'auto',\n    };\n\n    return (\n      <div\n        style={styleWithHeight}\n        data-row={currentRowIndex}\n        data-column={columnIndex}\n        ref={cellRef}\n      >\n        <StyledCell\n          as={CellData}\n          rowIndex={currentRowIndex}\n          columnIndex={columnIndex}\n          type=\"row-cell\"\n          data-selected={isFocused || selectionType === 'selectDirect'}\n          data-focused={isFocused}\n          $isSelectedTop={selectionBorderTop}\n          $isSelectedLeft={selectionBorderLeft}\n          $isFocused={isFocused}\n          $isLastRow={rowCount - 1 === rowIndex}\n          $isLastColumn={columnCount - 1 === columnIndex}\n          $isFirstColumn={columnIndex === 0 && !showRowNumber}\n          $isFirstRow={rowIndex === 0 && !showHeader}\n          $selectionType={selectionType}\n          $height={rowHeight}\n          data-grid-row={currentRowIndex}\n          data-grid-column={columnIndex}\n          $showBorder\n          $rowAutoHeight={rowAutoHeight}\n          {...props}\n        />\n      </div>\n    );\n  },\n  areEqual\n);\n"],"names":["Cell","memo","data","rowIndex","columnIndex","style","props","cell","CellData","getSelectionType","focus","columnCount","rowCount","showRowNumber","showHeader","rowHeight","rowStart","rowAutoHeight","updateRowHeight","currentRowIndex","row","focusedRow","column","focusedColumn","isFocused","rightOfFocus","belowFocus","selectionType","type","rightSelection","belowSelection","rightOfSelectionBorder","belowSelectionBorder","selectionBorderLeft","selectionBorderTop","cellRef","useRef","useEffect","current","height","getBoundingClientRect","styleWithHeight","jsx","StyledCell","areEqual"],"mappings":"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"}

package/dist/cjs/components/Grid/ColumnResizer.cjs

@@ -0,0 +1,112 @@
+'use strict';
+
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: 'Module' } });
+
+const jsxRuntime = require('react/jsx-runtime');
+const react = require('react');
+const styledComponents = require('styled-components');
+const lodashEs = require('lodash-es');
+const useResizingState = require('./useResizingState.cjs');
+
+const DOUBLE_CLICK_THRESHOLD_MSEC = 300;
+const ResizeSpan = styledComponents.styled.div.withConfig({
+  componentId: "sc-p7utwv-0"
+})(["top:", ";left:", ";z-index:1;position:absolute;height:", "px;cursor:col-resize;width:4px;overflow:auto;&:hover,&:active,&:hover{background:", ";}", ""], useResizingState.initialPosition.top, useResizingState.initialPosition.left, ({
+  $height
+}) => $height, ({
+  theme
+}) => theme.click.grid.header.cell.color.stroke.selectDirect, ({
+  $isPressed
+}) => $isPressed && `
+      height: 100%;
+      position: fixed;
+    `);
+const ColumnResizer = ({
+  height,
+  onColumnResize: onColumnResizeProp,
+  columnIndex,
+  getResizerPosition,
+  columnWidth,
+  resizingState
+}) => {
+  const resizeRef = react.useRef(null);
+  const {
+    pointer,
+    setPointer,
+    getIsPressed,
+    setIsPressed,
+    getPosition,
+    setPosition,
+    lastPressedTimestamp
+  } = resizingState;
+  const isPressed = getIsPressed(columnIndex);
+  const position = getPosition(columnIndex);
+  const onColumnResize = lodashEs.throttle(onColumnResizeProp, 1e3);
+  react.useEffect(() => {
+    const control = resizeRef.current;
+    if (!isPressed || !control || !pointer) {
+      return;
+    }
+    const pointerId = pointer.pointerId;
+    try {
+      control.setPointerCapture(pointerId);
+      return () => {
+        if (control.hasPointerCapture(pointerId)) {
+          control.releasePointerCapture(pointerId);
+        }
+      };
+    } catch (e) {
+      console.error(e);
+    }
+  }, [pointer, isPressed, columnIndex]);
+  const onPointerDown = react.useCallback((e) => {
+    e.stopPropagation();
+    e.preventDefault();
+    if (resizeRef.current) {
+      if (lastPressedTimestamp > Date.now() - DOUBLE_CLICK_THRESHOLD_MSEC) {
+        onColumnResize(columnIndex, 0, "auto");
+      }
+      setPointer({
+        pointerId: e.pointerId,
+        initialClientX: e.clientX,
+        width: columnWidth
+      });
+      setIsPressed(columnIndex, true);
+      const pos = getResizerPosition(e.clientX, columnWidth, columnIndex);
+      setPosition(pos);
+    }
+  }, [lastPressedTimestamp, setPointer, columnWidth, setIsPressed, columnIndex, getResizerPosition, setPosition, onColumnResize]);
+  const onPointerMove = react.useCallback((e) => {
+    e.stopPropagation();
+    e.preventDefault();
+    if (isPressed && pointer) {
+      const width = columnWidth + (e.clientX - pointer.initialClientX);
+      const pos = getResizerPosition(e.clientX, width, columnIndex);
+      setPosition(pos);
+      pointer.width = Math.max(width, 50);
+    }
+  }, [pointer, isPressed, columnWidth, getResizerPosition, columnIndex, setPosition]);
+  return /* @__PURE__ */ jsxRuntime.jsx(ResizeSpan, { ref: resizeRef, $height: height, $isPressed: isPressed, onPointerDown, onPointerUp: (e) => {
+    e.preventDefault();
+    e.stopPropagation();
+    if (resizeRef.current && // 0 is a valid pointerId in Firefox
+    (pointer?.pointerId || pointer?.pointerId === 0)) {
+      const shouldCallResize = e.clientX !== pointer.initialClientX;
+      if (shouldCallResize) {
+        onColumnResize(columnIndex, pointer.width, "manual");
+      }
+      setPosition(useResizingState.initialPosition);
+      setPointer(null);
+      setIsPressed(columnIndex, false);
+    }
+  }, onPointerMove, onPointerCancel: (e) => {
+    e.preventDefault();
+    e.stopPropagation();
+    setPosition(useResizingState.initialPosition);
+    setPointer(null);
+    setIsPressed(columnIndex, false);
+  }, onClick: (e) => e.stopPropagation(), "data-resize": true, style: position });
+};
+
+exports.default = ColumnResizer;
+//# sourceMappingURL=ColumnResizer.cjs.map

package/dist/cjs/components/Grid/ColumnResizer.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ColumnResizer.cjs","sources":["../../../../src/components/Grid/ColumnResizer.tsx"],"sourcesContent":["import { PointerEventHandler, useCallback, useEffect, useRef } from 'react';\nimport { styled } from 'styled-components';\nimport { ColumnResizeFn, GetResizerPositionFn } from './types';\nimport { throttle } from 'lodash-es';\nimport { initialPosition, ResizingState } from './useResizingState';\n\nconst DOUBLE_CLICK_THRESHOLD_MSEC = 300;\n\nconst ResizeSpan = styled.div<{ $height: number; $isPressed: boolean }>`\n  top: ${initialPosition.top};\n  left: ${initialPosition.left};\n  z-index: 1;\n  position: absolute;\n  height: ${({ $height }) => $height}px;\n  cursor: col-resize;\n  width: 4px;\n  overflow: auto;\n  &:hover,\n  &:active,\n  &:hover {\n    background: ${({ theme }) => theme.click.grid.header.cell.color.stroke.selectDirect};\n  }\n  ${({ $isPressed }) =>\n    $isPressed &&\n    `\n      height: 100%;\n      position: fixed;\n    `}\n`;\n\ninterface Props {\n  height: number;\n  onColumnResize: ColumnResizeFn;\n  columnIndex: number;\n  getResizerPosition: GetResizerPositionFn;\n  columnWidth: number;\n  resizingState: ResizingState;\n}\n\nconst ColumnResizer = ({\n  height,\n  onColumnResize: onColumnResizeProp,\n  columnIndex,\n  getResizerPosition,\n  columnWidth,\n  resizingState,\n}: Props) => {\n  const resizeRef = useRef<HTMLDivElement>(null);\n  const {\n    pointer,\n    setPointer,\n    getIsPressed,\n    setIsPressed,\n    getPosition,\n    setPosition,\n    lastPressedTimestamp,\n  } = resizingState;\n  const isPressed = getIsPressed(columnIndex);\n  const position = getPosition(columnIndex);\n  const onColumnResize = throttle(onColumnResizeProp, 1000);\n\n  useEffect(() => {\n    // Capture the pointer when pressed to ensure we receive move events outside the element.\n    // Capturing must be properly handled when the component unmounts and mounts again,\n    // based on its pressed state.\n    const control = resizeRef.current;\n    if (!isPressed || !control || !pointer) {\n      return;\n    }\n    const pointerId = pointer.pointerId;\n    try {\n      control.setPointerCapture(pointerId);\n      return () => {\n        if (control.hasPointerCapture(pointerId)) {\n          control.releasePointerCapture(pointerId);\n        }\n      };\n    } catch (e) {\n      console.error(e);\n    }\n  }, [pointer, isPressed, columnIndex]);\n\n  /**\n   * Handler for pointer down events to initiate resizing or auto-sizing on double-click.\n   * @type {PointerEventHandler<HTMLDivElement>}\n   */\n  const onPointerDown: PointerEventHandler<HTMLDivElement> = useCallback(\n    e => {\n      e.stopPropagation();\n      e.preventDefault();\n      if (resizeRef.current) {\n        // We cannot detect double-click with onDoubleClick event,\n        // because this component might be unmounted before the second click and mounted again.\n        // We keep track of the last click timestamp and check if it was a double-click.\n        if (lastPressedTimestamp > Date.now() - DOUBLE_CLICK_THRESHOLD_MSEC) {\n          // Auto-size the column on double click.\n          onColumnResize(columnIndex, 0, 'auto');\n        }\n        setPointer({\n          pointerId: e.pointerId,\n          initialClientX: e.clientX,\n          width: columnWidth,\n        });\n        setIsPressed(columnIndex, true);\n        const pos = getResizerPosition(e.clientX, columnWidth, columnIndex);\n        setPosition(pos);\n      }\n    },\n    [\n      lastPressedTimestamp,\n      setPointer,\n      columnWidth,\n      setIsPressed,\n      columnIndex,\n      getResizerPosition,\n      setPosition,\n      onColumnResize,\n    ]\n  );\n\n  /**\n   * Handler for pointer move events to update the column width as the user drags.\n   * @type {PointerEventHandler<HTMLDivElement>}\n   */\n  const onPointerMove: PointerEventHandler<HTMLDivElement> = useCallback(\n    e => {\n      e.stopPropagation();\n      e.preventDefault();\n      if (isPressed && pointer) {\n        const width = columnWidth + (e.clientX - pointer.initialClientX);\n        const pos = getResizerPosition(e.clientX, width, columnIndex);\n        setPosition(pos);\n        // Ensure minimum width of 50px\n        pointer.width = Math.max(width, 50);\n      }\n    },\n    [pointer, isPressed, columnWidth, getResizerPosition, columnIndex, setPosition]\n  );\n\n  return (\n    <ResizeSpan\n      ref={resizeRef}\n      $height={height}\n      $isPressed={isPressed}\n      onPointerDown={onPointerDown}\n      onPointerUp={e => {\n        e.preventDefault();\n        e.stopPropagation();\n        if (\n          resizeRef.current &&\n          // 0 is a valid pointerId in Firefox\n          (pointer?.pointerId || pointer?.pointerId === 0)\n        ) {\n          const shouldCallResize = e.clientX !== pointer.initialClientX;\n          if (shouldCallResize) {\n            onColumnResize(columnIndex, pointer.width, 'manual');\n          }\n          setPosition(initialPosition);\n          setPointer(null);\n          setIsPressed(columnIndex, false);\n        }\n      }}\n      onPointerMove={onPointerMove}\n      onPointerCancel={e => {\n        e.preventDefault();\n        e.stopPropagation();\n        setPosition(initialPosition);\n        setPointer(null);\n        setIsPressed(columnIndex, false);\n      }}\n      onClick={e => e.stopPropagation()}\n      data-resize\n      style={position}\n    />\n  );\n};\n\nexport default ColumnResizer;\n"],"names":["DOUBLE_CLICK_THRESHOLD_MSEC","ResizeSpan","styled","div","withConfig","componentId","initialPosition","top","left","$height","theme","click","grid","header","cell","color","stroke","selectDirect","$isPressed","ColumnResizer","height","onColumnResize","onColumnResizeProp","columnIndex","getResizerPosition","columnWidth","resizingState","resizeRef","useRef","pointer","setPointer","getIsPressed","setIsPressed","getPosition","setPosition","lastPressedTimestamp","isPressed","position","throttle","useEffect","control","current","pointerId","setPointerCapture","hasPointerCapture","releasePointerCapture","e","console","error","onPointerDown","useCallback","stopPropagation","preventDefault","Date","now","initialClientX","clientX","width","pos","onPointerMove","Math","max","jsx","shouldCallResize"],"mappings":"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"}