@accelint/design-toolkit 2.2.1 → 2.3.0
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.
- package/README.md +1 -0
- package/dist/components/accordion/index.d.ts +2 -2
- package/dist/components/accordion/index.js +1 -1
- package/dist/components/accordion/index.js.map +1 -1
- package/dist/components/accordion/styles.d.ts +3 -39
- package/dist/components/accordion/styles.js +1 -1
- package/dist/components/accordion/styles.js.map +1 -1
- package/dist/components/avatar/index.d.ts +4 -4
- package/dist/components/badge/index.d.ts +2 -2
- package/dist/components/box/index.d.ts +3 -3
- package/dist/components/button/index.d.ts +35 -23
- package/dist/components/button/index.js +1 -1
- package/dist/components/button/index.js.map +1 -1
- package/dist/components/button/styles.d.ts +297 -0
- package/dist/components/button/styles.js +2 -0
- package/dist/components/button/styles.js.map +1 -0
- package/dist/components/button/types.d.ts +14 -0
- package/dist/components/button/types.js +2 -0
- package/dist/components/button/types.js.map +1 -0
- package/dist/components/checkbox/index.d.ts +2 -2
- package/dist/components/checkbox/index.js +1 -1
- package/dist/components/checkbox/index.js.map +1 -1
- package/dist/components/chip/index.d.ts +25 -48
- package/dist/components/chip/index.js +1 -1
- package/dist/components/chip/index.js.map +1 -1
- package/dist/components/chip/styles.d.ts +250 -0
- package/dist/components/chip/styles.js +2 -0
- package/dist/components/chip/styles.js.map +1 -0
- package/dist/components/chip/types.d.ts +20 -0
- package/dist/components/chip/types.js +2 -0
- package/dist/components/chip/types.js.map +1 -0
- package/dist/components/classification-badge/index.d.ts +15 -16
- package/dist/components/classification-badge/index.js +1 -1
- package/dist/components/classification-badge/index.js.map +1 -1
- package/dist/components/classification-badge/styles.d.ts +51 -0
- package/dist/components/classification-badge/styles.js +2 -0
- package/dist/components/classification-badge/styles.js.map +1 -0
- package/dist/components/classification-badge/types.d.ts +9 -0
- package/dist/components/classification-badge/types.js +2 -0
- package/dist/components/classification-badge/types.js.map +1 -0
- package/dist/components/classification-banner/index.d.ts +15 -16
- package/dist/components/classification-banner/index.js +1 -2
- package/dist/components/classification-banner/index.js.map +1 -1
- package/dist/components/classification-banner/styles.d.ts +38 -0
- package/dist/components/classification-banner/styles.js +2 -0
- package/dist/components/classification-banner/styles.js.map +1 -0
- package/dist/components/classification-banner/types.d.ts +9 -0
- package/dist/components/classification-banner/types.js +2 -0
- package/dist/components/classification-banner/types.js.map +1 -0
- package/dist/components/combobox/index.js +1 -1
- package/dist/components/combobox/index.js.map +1 -1
- package/dist/components/date-field/index.js +1 -1
- package/dist/components/date-field/index.js.map +1 -1
- package/dist/components/dialog/index.d.ts +5 -5
- package/dist/components/dialog/index.js +1 -1
- package/dist/components/dialog/index.js.map +1 -1
- package/dist/components/icon/index.d.ts +2 -2
- package/dist/components/icon/types.d.ts +3 -5
- package/dist/components/label/index.d.ts +10 -7
- package/dist/components/label/index.js +1 -1
- package/dist/components/label/index.js.map +1 -1
- package/dist/components/label/styles.d.ts +5 -0
- package/dist/components/label/styles.js +2 -0
- package/dist/components/label/styles.js.map +1 -0
- package/dist/components/label/types.d.ts +10 -0
- package/dist/components/label/types.js +2 -0
- package/dist/components/label/types.js.map +1 -0
- package/dist/components/options/index.d.ts +2 -2
- package/dist/components/options-item/index.js +1 -1
- package/dist/components/options-item/index.js.map +1 -1
- package/dist/components/popover/styles.d.ts +3 -3
- package/dist/components/query-builder/index.js +1 -1
- package/dist/components/query-builder/index.js.map +1 -1
- package/dist/components/query-builder/value-editor.js +1 -1
- package/dist/components/query-builder/value-editor.js.map +1 -1
- package/dist/components/radio/index.d.ts +11 -9
- package/dist/components/radio/index.js +1 -1
- package/dist/components/radio/index.js.map +1 -1
- package/dist/components/radio/styles.d.ts +53 -0
- package/dist/components/radio/styles.js +2 -0
- package/dist/components/radio/styles.js.map +1 -0
- package/dist/components/radio/types.d.ts +21 -0
- package/dist/components/radio/types.js +2 -0
- package/dist/components/radio/types.js.map +1 -0
- package/dist/components/search-field/index.js +1 -1
- package/dist/components/search-field/index.js.map +1 -1
- package/dist/components/switch/index.d.ts +10 -7
- package/dist/components/switch/index.js +1 -1
- package/dist/components/switch/index.js.map +1 -1
- package/dist/components/switch/styles.d.ts +41 -0
- package/dist/components/switch/styles.js +2 -0
- package/dist/components/switch/styles.js.map +1 -0
- package/dist/components/switch/types.d.ts +13 -0
- package/dist/components/switch/types.js +2 -0
- package/dist/components/switch/types.js.map +1 -0
- package/dist/components/tabs/index.js +1 -1
- package/dist/components/tabs/index.js.map +1 -1
- package/dist/components/text-area-field/index.d.ts +19 -0
- package/dist/components/text-area-field/index.js +2 -0
- package/dist/components/text-area-field/index.js.map +1 -0
- package/dist/components/text-area-field/styles.d.ts +113 -0
- package/dist/components/text-area-field/styles.js +2 -0
- package/dist/components/text-area-field/styles.js.map +1 -0
- package/dist/components/text-area-field/types.d.ts +23 -0
- package/dist/components/text-area-field/types.js +2 -0
- package/dist/components/text-area-field/types.js.map +1 -0
- package/dist/components/text-field/index.js +1 -1
- package/dist/components/text-field/index.js.map +1 -1
- package/dist/components/tooltip/index.d.ts +2 -2
- package/dist/index.css +122 -252
- package/dist/index.d.ts +25 -11
- package/dist/index.js +1 -1
- package/dist/lib/react.js.map +1 -1
- package/dist/lib/utils.js +1 -1
- package/dist/lib/utils.js.map +1 -1
- package/dist/metafile-esm.json +1 -1
- package/dist/styles.css +873 -754
- package/dist/tokens/generated/themes.css +147 -0
- package/dist/tokens/generated/themes.d.ts +2 -0
- package/dist/tokens/generated/tokens.css +119 -0
- package/dist/tokens/generated/tokens.d.ts +108 -0
- package/dist/tokens/generated/tokens.js +2 -0
- package/dist/tokens/generated/tokens.js.map +1 -0
- package/package.json +6 -6
- package/dist/components/floating-button/index.d.ts +0 -18
- package/dist/components/floating-button/index.js +0 -2
- package/dist/components/floating-button/index.js.map +0 -1
- package/dist/components/icon-button/index.d.ts +0 -20
- package/dist/components/icon-button/index.js +0 -2
- package/dist/components/icon-button/index.js.map +0 -1
- package/dist/components/text-area/index.d.ts +0 -30
- package/dist/components/text-area/index.js +0 -2
- package/dist/components/text-area/index.js.map +0 -1
- package/dist/components/toggle-icon-button/index.d.ts +0 -20
- package/dist/components/toggle-icon-button/index.js +0 -2
- package/dist/components/toggle-icon-button/index.js.map +0 -1
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../../src/components/combobox/index.tsx"],"names":["w","className","isReadOnly","size","AriaInput","props","isDisabled","isInvalid","p","ComboBox","children","isSmall","shouldShowDescription","shouldShowError","shouldShowLabel","label","jsx","AriaComboBox","e","D","m","AriaButton","L","cn","Icon","ChevronDown","k","AriaText","description","y","errorMessage","AriaVirtualizer","AriaListLayout","T","Options","F","ComboBoxSection","jsxs","AriaListBoxSection","S","C","header","items","v"],"mappings":"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","file":"index.js","sourcesContent":["/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n'use client';\nimport 'client-only';\nimport {\n Button as AriaButton,\n ComboBox as AriaComboBox,\n type ComboBoxProps as AriaComboBoxProps,\n Header as AriaHeader,\n Input as AriaInput,\n type InputProps as AriaInputProps,\n Collection as AriaListBoxCollection,\n ListBoxSection as AriaListBoxSection,\n type ListBoxSectionProps as AriaListBoxSectionProps,\n ListLayout as AriaListLayout,\n type ListLayoutOptions as AriaListLayoutOptions,\n Popover as AriaPopover,\n Text as AriaText,\n Virtualizer as AriaVirtualizer,\n type VirtualizerProps as AriaVirtualizerProps,\n} from 'react-aria-components';\n\nimport { cn } from '@/lib/utils';\nimport { ChevronDown } from '@accelint/icons';\nimport { type VariantProps, cva } from 'cva';\nimport type { ReactNode } from 'react';\nimport { Icon } from '../icon';\nimport { Label } from '../label';\nimport { Options } from '../options';\nimport { type IOptionsItem, OptionsItem } from '../options-item';\n\nconst textFieldStyles = cva(\n [\n 'block w-full rounded-medium py-xs pr-[32px] pl-s font-display outline outline-interactive',\n 'not-disabled:read-only:rounded-none not-disabled:read-only:p-0 not-disabled:read-only:outline-transparent not-disabled:read-only:hover:outline-transparent not-disabled:read-only:focus:outline-transparent',\n ],\n {\n variants: {\n isDisabled: {\n true: 'text-disabled outline-interactive-disabled placeholder:text-disabled',\n false:\n 'text-default-light placeholder:text-default-dark hover:outline-interactive-hover focus:outline-highlight',\n },\n isInvalid: {\n true: 'outline-serious',\n },\n size: {\n medium: 'text-body-s',\n small: 'text-body-xs',\n },\n },\n compoundVariants: [\n {\n isDisabled: true,\n isInvalid: true,\n className: 'outline-interactive-disabled',\n },\n ],\n defaultVariants: {\n size: 'medium',\n },\n },\n);\n\ninterface InputProps\n extends VariantProps<typeof textFieldStyles>,\n Omit<AriaInputProps, 'size'> {\n isReadOnly?: boolean;\n}\n\nconst Input = ({\n className,\n isReadOnly = false,\n size = 'medium',\n ...props\n}: InputProps) => {\n return (\n <AriaInput\n {...props}\n className={({ isDisabled, isInvalid }) =>\n cn(\n textFieldStyles({\n isDisabled,\n isInvalid,\n size,\n className,\n }),\n )\n }\n />\n );\n};\nInput.displayName = 'ComboBox.Input';\n\nexport interface ComboBoxProps<T extends IOptionsItem>\n extends Omit<\n VariantProps<typeof textFieldStyles>,\n 'isDisabled' | 'isInvalid' | 'isReadOnly'\n >,\n Omit<AriaComboBoxProps<T>, 'children'>,\n Pick<AriaVirtualizerProps<AriaListLayoutOptions>, 'layoutOptions'> {\n className?: string;\n children: ReactNode | ((item: T) => ReactNode);\n description?: string;\n errorMessage?: string;\n label?: string;\n placeholder?: string;\n}\n\nexport function ComboBox<T extends IOptionsItem>({\n children,\n className,\n description,\n errorMessage,\n isDisabled,\n isInvalid,\n isReadOnly,\n label,\n placeholder,\n layoutOptions,\n size = 'medium',\n ...props\n}: ComboBoxProps<T>) {\n const isSmall = size === 'small';\n const shouldShowDescription = !(isSmall || isInvalid) || isDisabled;\n const shouldShowError = isInvalid && !isDisabled && !isReadOnly;\n const shouldShowLabel = !isSmall && label;\n\n return (\n <AriaComboBox<T>\n {...props}\n isDisabled={isDisabled}\n isInvalid={isInvalid}\n isReadOnly={isReadOnly}\n className='flex flex-col gap-xs'\n >\n {({ isDisabled, isOpen }) => (\n <>\n {shouldShowLabel && (\n <Label\n className='empty:hidden'\n isDisabled={isDisabled}\n isOptional={!props.isRequired}\n >\n {label}\n </Label>\n )}\n <div className='relative flex items-center'>\n <Input\n className={className}\n isReadOnly={isReadOnly}\n placeholder={placeholder}\n size={size}\n />\n <AriaButton\n className={cn([\n 'fg-default-light absolute right-xs transform',\n isDisabled && 'fg-disabled',\n isOpen && 'rotate-180',\n isReadOnly && 'hidden',\n ])}\n >\n <Icon className='block' size='large'>\n <ChevronDown />\n </Icon>\n </AriaButton>\n </div>\n {shouldShowDescription && (\n <AriaText\n className={cn([\n 'fg-default-dark text-body-xs empty:hidden',\n isDisabled && 'fg-disabled',\n ])}\n slot='description'\n >\n {description}\n </AriaText>\n )}\n {shouldShowError && (\n <AriaText\n className='fg-serious text-body-xs empty:hidden'\n slot='errorMessage'\n >\n {errorMessage}\n </AriaText>\n )}\n <AriaPopover className='w-(--trigger-width)'>\n <AriaVirtualizer\n layout={AriaListLayout}\n layoutOptions={layoutOptions}\n >\n <Options>{children}</Options>\n </AriaVirtualizer>\n </AriaPopover>\n </>\n )}\n </AriaComboBox>\n );\n}\nComboBox.displayName = 'ComboBox';\n\nComboBox.Item = OptionsItem;\n\ninterface ComboBoxSectionProps<T extends IOptionsItem>\n extends AriaListBoxSectionProps<T> {\n header?: string;\n}\n\nexport function ComboBoxSection<T extends IOptionsItem>({\n children,\n header,\n items,\n}: ComboBoxSectionProps<T>) {\n return (\n <AriaListBoxSection\n id={header}\n className='col-span-2 mt-s grid grid-cols-[auto_1fr] border-default-dark border-t first:border-none'\n >\n <AriaHeader className='col-span-2 m-xs my-s text-default-dark text-header-xs'>\n {header}\n </AriaHeader>\n <AriaListBoxCollection items={items}>{children}</AriaListBoxCollection>\n </AriaListBoxSection>\n );\n}\nComboBox.displayName = 'ComboBox.Section';\nComboBox.Section = ComboBoxSection;\n"]}
|
1
|
+
{"version":3,"sources":["../../../src/components/combobox/index.tsx"],"names":["w","className","isReadOnly","size","AriaInput","props","isDisabled","isInvalid","p","ComboBox","children","isSmall","shouldShowDescription","shouldShowError","shouldShowLabel","label","jsx","AriaComboBox","e","N","m","E","AriaButton","L","cn","Icon","ChevronDown","k","AriaText","description","y","errorMessage","AriaVirtualizer","AriaListLayout","T","Options","F","ComboBoxSection","jsxs","AriaListBoxSection","S","C","header","items","O"],"mappings":"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","file":"index.js","sourcesContent":["/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n'use client';\nimport 'client-only';\nimport {\n Button as AriaButton,\n ComboBox as AriaComboBox,\n type ComboBoxProps as AriaComboBoxProps,\n Header as AriaHeader,\n Input as AriaInput,\n type InputProps as AriaInputProps,\n Collection as AriaListBoxCollection,\n ListBoxSection as AriaListBoxSection,\n type ListBoxSectionProps as AriaListBoxSectionProps,\n ListLayout as AriaListLayout,\n type ListLayoutOptions as AriaListLayoutOptions,\n Popover as AriaPopover,\n Text as AriaText,\n Virtualizer as AriaVirtualizer,\n type VirtualizerProps as AriaVirtualizerProps,\n} from 'react-aria-components';\n\nimport { cn } from '@/lib/utils';\nimport { ChevronDown } from '@accelint/icons';\nimport { type VariantProps, cva } from 'cva';\nimport type { ReactNode } from 'react';\nimport { Icon } from '../icon';\nimport { Label } from '../label';\nimport { Options } from '../options';\nimport { type IOptionsItem, OptionsItem } from '../options-item';\n\nconst textFieldStyles = cva(\n [\n 'block w-full rounded-medium py-xs pr-[32px] pl-s font-display outline outline-interactive',\n 'not-disabled:read-only:rounded-none not-disabled:read-only:p-0 not-disabled:read-only:outline-transparent not-disabled:read-only:hover:outline-transparent not-disabled:read-only:focus:outline-transparent',\n ],\n {\n variants: {\n isDisabled: {\n true: 'text-disabled outline-interactive-disabled placeholder:text-disabled',\n false:\n 'text-default-light placeholder:text-default-dark hover:outline-interactive-hover focus:outline-highlight',\n },\n isInvalid: {\n true: 'outline-serious',\n },\n size: {\n medium: 'text-body-s',\n small: 'text-body-xs',\n },\n },\n compoundVariants: [\n {\n isDisabled: true,\n isInvalid: true,\n className: 'outline-interactive-disabled',\n },\n ],\n defaultVariants: {\n size: 'medium',\n },\n },\n);\n\ninterface InputProps\n extends VariantProps<typeof textFieldStyles>,\n Omit<AriaInputProps, 'size'> {\n isReadOnly?: boolean;\n}\n\nconst Input = ({\n className,\n isReadOnly = false,\n size = 'medium',\n ...props\n}: InputProps) => {\n return (\n <AriaInput\n {...props}\n className={({ isDisabled, isInvalid }) =>\n cn(\n textFieldStyles({\n isDisabled,\n isInvalid,\n size,\n className,\n }),\n )\n }\n />\n );\n};\nInput.displayName = 'ComboBox.Input';\n\nexport interface ComboBoxProps<T extends IOptionsItem>\n extends Omit<\n VariantProps<typeof textFieldStyles>,\n 'isDisabled' | 'isInvalid' | 'isReadOnly'\n >,\n Omit<AriaComboBoxProps<T>, 'children'>,\n Pick<AriaVirtualizerProps<AriaListLayoutOptions>, 'layoutOptions'> {\n className?: string;\n children: ReactNode | ((item: T) => ReactNode);\n description?: string;\n errorMessage?: string;\n label?: string;\n placeholder?: string;\n}\n\nexport function ComboBox<T extends IOptionsItem>({\n children,\n className,\n description,\n errorMessage,\n isDisabled,\n isInvalid,\n isReadOnly,\n label,\n placeholder,\n layoutOptions,\n size = 'medium',\n ...props\n}: ComboBoxProps<T>) {\n const isSmall = size === 'small';\n const shouldShowDescription = !(isSmall || isInvalid) || isDisabled;\n const shouldShowError = isInvalid && !isDisabled && !isReadOnly;\n const shouldShowLabel = !isSmall && label;\n\n return (\n <AriaComboBox<T>\n {...props}\n isDisabled={isDisabled}\n isInvalid={isInvalid}\n isReadOnly={isReadOnly}\n className='flex flex-col gap-xs'\n >\n {({ isDisabled, isOpen }) => (\n <>\n {shouldShowLabel && (\n <Label\n className='empty:hidden'\n isDisabled={isDisabled}\n isRequired={props.isRequired}\n >\n {label}\n </Label>\n )}\n <div className='relative flex items-center'>\n <Input\n className={className}\n isReadOnly={isReadOnly}\n placeholder={placeholder}\n size={size}\n />\n <AriaButton\n className={cn([\n 'fg-default-light absolute right-xs transform',\n isDisabled && 'fg-disabled',\n isOpen && 'rotate-180',\n isReadOnly && 'hidden',\n ])}\n >\n <Icon className='block' size='large'>\n <ChevronDown />\n </Icon>\n </AriaButton>\n </div>\n {shouldShowDescription && (\n <AriaText\n className={cn([\n 'fg-default-dark text-body-xs empty:hidden',\n isDisabled && 'fg-disabled',\n ])}\n slot='description'\n >\n {description}\n </AriaText>\n )}\n {shouldShowError && (\n <AriaText\n className='fg-serious text-body-xs empty:hidden'\n slot='errorMessage'\n >\n {errorMessage}\n </AriaText>\n )}\n <AriaPopover className='w-(--trigger-width)'>\n <AriaVirtualizer\n layout={AriaListLayout}\n layoutOptions={layoutOptions}\n >\n <Options>{children}</Options>\n </AriaVirtualizer>\n </AriaPopover>\n </>\n )}\n </AriaComboBox>\n );\n}\nComboBox.displayName = 'ComboBox';\n\nComboBox.Item = OptionsItem;\n\ninterface ComboBoxSectionProps<T extends IOptionsItem>\n extends AriaListBoxSectionProps<T> {\n header?: string;\n}\n\nexport function ComboBoxSection<T extends IOptionsItem>({\n children,\n header,\n items,\n}: ComboBoxSectionProps<T>) {\n return (\n <AriaListBoxSection\n id={header}\n className='col-span-2 mt-s grid grid-cols-[auto_1fr] border-default-dark border-t first:border-none'\n >\n <AriaHeader className='col-span-2 m-xs my-s text-default-dark text-header-xs'>\n {header}\n </AriaHeader>\n <AriaListBoxCollection items={items}>{children}</AriaListBoxCollection>\n </AriaListBoxSection>\n );\n}\nComboBox.displayName = 'ComboBox.Section';\nComboBox.Section = ComboBoxSection;\n"]}
|
@@ -1,2 +1,2 @@
|
|
1
|
-
import {cn}from'./../../lib/utils.js';import y from'@accelint/icons/calendar';import'client-only';import {cva}from'cva';import {DateField,Text,FieldError,DateInput,DateSegment}from'react-aria-components';import {Icon}from'../icon/index.js';import {Label}from'../label/index.js';import {jsxs,jsx,Fragment}from'react/jsx-runtime';var I=["JAN","FEB","MAR","APR","MAY","JUN","JUL","AUG","SEP","OCT","NOV","DEC"],
|
1
|
+
import {cn}from'./../../lib/utils.js';import y from'@accelint/icons/calendar';import'client-only';import {cva}from'cva';import {DateField,Text,FieldError,DateInput,DateSegment}from'react-aria-components';import {Icon}from'../icon/index.js';import {Label}from'../label/index.js';import {jsxs,jsx,Fragment}from'react/jsx-runtime';var I=["JAN","FEB","MAR","APR","MAY","JUN","JUL","AUG","SEP","OCT","NOV","DEC"],R=({value:e,isFocused:o,isPlaceholder:i,placeholder:t,isReadOnly:s,shortMonth:l})=>{if(i)return t;let r=`${e}`;return !s&&o?r=r.padStart(2,"0"):l&&(r=I[(e??0)-1]),r},T=({segment:e,shortMonth:o,...i})=>e.type==="literal"&&e.text!==":"?jsx(Fragment,{}):jsx(DateSegment,{segment:e,className:"focus:bg-highlight focus:text-inverse-light focus:outline-none",...i,children:e.type==="month"?t=>jsx(R,{...t,shortMonth:o}):e.text}),O=cva(["flex w-full gap-xs rounded-medium px-s py-xs font-display outline outline-interactive"],{variants:{isDisabled:{true:"text-disabled outline-interactive-disabled placeholder:text-disabled",false:"text-default-light placeholder:text-default-dark focus-within:outline-highlight hover:outline-interactive-hover"},isInvalid:{true:"outline-serious"},isReadOnly:{true:"rounded-none p-0 outline-none"},size:{medium:["text-body-s","pl-[32px]"],small:"text-body-xs"}},compoundVariants:[{isDisabled:true,isInvalid:true,className:"outline-interactive-disabled"},{isDisabled:false,size:"medium"}],defaultVariants:{size:"medium"}}),V=({className:e,ref:o=null,size:i="medium",isReadOnly:t,...s})=>jsxs("div",{className:"relative flex",children:[i==="medium"?jsx(Icon,{className:cn(["-translate-y-1/2 absolute top-1/2 left-s",s.isDisabled?"text-disabled":"text-default-light"]),children:jsx(y,{})}):null,jsx(DateInput,{...s,className:({isDisabled:l,isInvalid:r})=>cn(O({isDisabled:l,isInvalid:r,isReadOnly:t,size:i,className:e}))})]});function q({className:e,description:o,errorMessage:i,isDisabled:t,isInvalid:s,isReadOnly:l,label:r,placeholder:E,slot:c,size:d="medium",shortMonth:f=true,...m}){let p=d==="small",D=o&&(!(p||s)||t),h=i&&s&&!t&&!l;return jsxs(DateField,{...m,isDisabled:t,isInvalid:s,isReadOnly:l,slot:c,className:"flex flex-col gap-xs",children:[!p&&jsx(Label,{className:"empty:hidden",isDisabled:t,isRequired:m.isRequired,children:r}),jsx(V,{className:e,isDisabled:t,size:d,isReadOnly:l,isInvalid:s,children:x=>jsx(T,{segment:x,shortMonth:f})}),D&&jsx(Text,{className:cn(["fg-default-dark text-body-xs empty:hidden",t&&"fg-disabled"]),slot:"description",children:o}),h&&jsx(FieldError,{className:"fg-serious text-body-xs empty:hidden",children:i})]})}export{q as DateField};//# sourceMappingURL=index.js.map
|
2
2
|
//# sourceMappingURL=index.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../../src/components/date-field/index.tsx"],"names":["value","isPlaceholder","placeholder","isReadOnly","displayValue","months","FormattedDateSegment","segment","Fragment","jsx","DateSegment","a","F","renderProps","dateFieldStyles","cva","g","jsxs","u","v","n","AriaDateInput","props","P","DateField","label","slot","size","isSmall","shouldShowDescription","isInvalid","isDisabled","shouldShowError","errorMessage","AriaDateField","N","AriaText","S","description","FieldError"],"mappings":"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","file":"index.js","sourcesContent":["/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n'use client';\nimport { cn } from '@/lib/utils';\nimport Calendar from '@accelint/icons/calendar';\nimport type { DateValue } from '@internationalized/date';\nimport type { DateSegment as TDateSegment } from '@react-stately/datepicker';\nimport 'client-only';\nimport { type VariantProps, cva } from 'cva';\nimport type { ForwardedRef } from 'react';\nimport {\n DateField as AriaDateField,\n type DateFieldProps as AriaDateFieldProps,\n DateInput as AriaDateInput,\n type DateInputProps as AriaDateInputProps,\n type DateSegmentProps as AriaDateSegmentProps,\n Text as AriaText,\n DateSegment,\n type DateSegmentRenderProps,\n FieldError,\n} from 'react-aria-components';\nimport { Icon } from '../icon';\nimport { Label } from '../label';\n\nconst months = [\n 'JAN',\n 'FEB',\n 'MAR',\n 'APR',\n 'MAY',\n 'JUN',\n 'JUL',\n 'AUG',\n 'SEP',\n 'OCT',\n 'NOV',\n 'DEC',\n];\n\nconst MonthDateSegment = ({\n value,\n isFocused,\n isPlaceholder,\n placeholder,\n isReadOnly,\n shortMonth,\n}: DateSegmentRenderProps & { shortMonth?: boolean }) => {\n if (isPlaceholder) {\n return placeholder;\n }\n\n let displayValue: string | undefined = `${value}`;\n\n if (!isReadOnly && isFocused) {\n displayValue = displayValue.padStart(2, '0');\n } else if (shortMonth) {\n displayValue = months[(value ?? 0) - 1];\n }\n\n return displayValue;\n};\n\ninterface FormattedDateSegmentProps extends AriaDateSegmentProps {\n segment: TDateSegment;\n shortMonth?: boolean;\n}\n\nconst FormattedDateSegment = ({\n segment,\n shortMonth,\n ...props\n}: FormattedDateSegmentProps) => {\n if (segment.type === 'literal' && segment.text !== ':') {\n return <></>;\n }\n\n return (\n <DateSegment\n segment={segment}\n className='focus:bg-highlight focus:text-inverse-light focus:outline-none' // Ensure caret color is visible, RAC sets the style prop and it is not overridable. Thanks for that.\n {...props}\n >\n {segment.type === 'month'\n ? (renderProps) => (\n <MonthDateSegment {...renderProps} shortMonth={shortMonth} />\n )\n : segment.text}\n </DateSegment>\n );\n};\n\nconst dateFieldStyles = cva(\n [\n 'flex w-full gap-xs rounded-medium px-s py-xs font-display outline outline-interactive',\n ],\n {\n variants: {\n isDisabled: {\n true: 'text-disabled outline-interactive-disabled placeholder:text-disabled',\n false:\n 'text-default-light placeholder:text-default-dark focus-within:outline-highlight hover:outline-interactive-hover',\n },\n isInvalid: {\n true: 'outline-serious',\n },\n isReadOnly: {\n true: 'rounded-none p-0 outline-none',\n },\n size: {\n medium: ['text-body-s', 'pl-[32px]'],\n small: 'text-body-xs',\n },\n },\n compoundVariants: [\n {\n isDisabled: true,\n isInvalid: true,\n className: 'outline-interactive-disabled',\n },\n {\n isDisabled: false,\n size: 'medium',\n },\n ],\n defaultVariants: {\n size: 'medium',\n },\n },\n);\n\ninterface DateInputProps\n extends VariantProps<typeof dateFieldStyles>,\n Omit<AriaDateInputProps, 'size'> {\n ref?: ForwardedRef<HTMLDivElement>;\n}\n\nconst DateInput = ({\n className,\n ref = null,\n size = 'medium',\n isReadOnly,\n ...props\n}: DateInputProps) => {\n return (\n <div className='relative flex'>\n {size === 'medium' ? (\n <Icon\n className={cn([\n '-translate-y-1/2 absolute top-1/2 left-s',\n props.isDisabled ? 'text-disabled' : 'text-default-light',\n ])}\n >\n <Calendar />\n </Icon>\n ) : null}\n <AriaDateInput\n {...props}\n className={({ isDisabled, isInvalid }) =>\n cn(\n dateFieldStyles({\n isDisabled,\n isInvalid,\n isReadOnly: isReadOnly,\n size,\n className,\n }),\n )\n }\n />\n </div>\n );\n};\n\nexport interface DateFieldProps<T extends DateValue>\n extends Omit<\n VariantProps<typeof dateFieldStyles>,\n 'isDisabled' | 'isInvalid' | 'isReadOnly'\n >,\n Omit<AriaDateFieldProps<T>, 'className' | 'style'>, // Exclude className to avoid conflict with cva\n Omit<AriaDateInputProps, 'className' | 'children' | 'style'> {\n isDisabled?: boolean;\n isInvalid?: boolean;\n isReadOnly?: boolean;\n size?: 'small' | 'medium';\n className?: string;\n description?: string;\n errorMessage?: string;\n label?: string;\n placeholder?: string;\n shortMonth?: boolean;\n}\n\nexport function DateField<T extends DateValue>({\n className,\n description,\n errorMessage,\n isDisabled,\n isInvalid,\n isReadOnly,\n label,\n placeholder,\n slot,\n size = 'medium',\n shortMonth = true,\n ...props\n}: DateFieldProps<T>) {\n const isSmall = size === 'small';\n const shouldShowDescription =\n description && (!(isSmall || isInvalid) || isDisabled);\n const shouldShowError =\n errorMessage && isInvalid && !isDisabled && !isReadOnly;\n\n return (\n <AriaDateField<T>\n {...props}\n isDisabled={isDisabled}\n isInvalid={isInvalid}\n isReadOnly={isReadOnly}\n slot={slot}\n className={'flex flex-col gap-xs'}\n >\n {!isSmall && (\n <Label\n className='empty:hidden'\n isDisabled={isDisabled}\n isOptional={!props.isRequired}\n >\n {label}\n </Label>\n )}\n\n <DateInput\n className={className}\n isDisabled={isDisabled}\n size={size}\n isReadOnly={isReadOnly}\n isInvalid={isInvalid}\n >\n {(segment) => (\n <FormattedDateSegment segment={segment} shortMonth={shortMonth} />\n )}\n </DateInput>\n {shouldShowDescription && (\n <AriaText\n className={cn([\n 'fg-default-dark text-body-xs empty:hidden',\n isDisabled && 'fg-disabled',\n ])}\n slot='description'\n >\n {description}\n </AriaText>\n )}\n {shouldShowError && (\n <FieldError className='fg-serious text-body-xs empty:hidden'>\n {errorMessage}\n </FieldError>\n )}\n </AriaDateField>\n );\n}\n"]}
|
1
|
+
{"version":3,"sources":["../../../src/components/date-field/index.tsx"],"names":["value","isPlaceholder","placeholder","isReadOnly","displayValue","months","FormattedDateSegment","segment","Fragment","jsx","DateSegment","a","F","renderProps","dateFieldStyles","cva","g","jsxs","u","v","n","AriaDateInput","props","P","DateField","label","slot","size","isSmall","shouldShowDescription","isInvalid","isDisabled","shouldShowError","errorMessage","AriaDateField","b","Label","AriaText","S","description","FieldError"],"mappings":"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","file":"index.js","sourcesContent":["/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n'use client';\nimport { cn } from '@/lib/utils';\nimport Calendar from '@accelint/icons/calendar';\nimport type { DateValue } from '@internationalized/date';\nimport type { DateSegment as TDateSegment } from '@react-stately/datepicker';\nimport 'client-only';\nimport { type VariantProps, cva } from 'cva';\nimport type { ForwardedRef } from 'react';\nimport {\n DateField as AriaDateField,\n type DateFieldProps as AriaDateFieldProps,\n DateInput as AriaDateInput,\n type DateInputProps as AriaDateInputProps,\n type DateSegmentProps as AriaDateSegmentProps,\n Text as AriaText,\n DateSegment,\n type DateSegmentRenderProps,\n FieldError,\n} from 'react-aria-components';\nimport { Icon } from '../icon';\nimport { Label } from '../label';\n\nconst months = [\n 'JAN',\n 'FEB',\n 'MAR',\n 'APR',\n 'MAY',\n 'JUN',\n 'JUL',\n 'AUG',\n 'SEP',\n 'OCT',\n 'NOV',\n 'DEC',\n];\n\nconst MonthDateSegment = ({\n value,\n isFocused,\n isPlaceholder,\n placeholder,\n isReadOnly,\n shortMonth,\n}: DateSegmentRenderProps & { shortMonth?: boolean }) => {\n if (isPlaceholder) {\n return placeholder;\n }\n\n let displayValue: string | undefined = `${value}`;\n\n if (!isReadOnly && isFocused) {\n displayValue = displayValue.padStart(2, '0');\n } else if (shortMonth) {\n displayValue = months[(value ?? 0) - 1];\n }\n\n return displayValue;\n};\n\ninterface FormattedDateSegmentProps extends AriaDateSegmentProps {\n segment: TDateSegment;\n shortMonth?: boolean;\n}\n\nconst FormattedDateSegment = ({\n segment,\n shortMonth,\n ...props\n}: FormattedDateSegmentProps) => {\n if (segment.type === 'literal' && segment.text !== ':') {\n return <></>;\n }\n\n return (\n <DateSegment\n segment={segment}\n className='focus:bg-highlight focus:text-inverse-light focus:outline-none' // Ensure caret color is visible, RAC sets the style prop and it is not overridable. Thanks for that.\n {...props}\n >\n {segment.type === 'month'\n ? (renderProps) => (\n <MonthDateSegment {...renderProps} shortMonth={shortMonth} />\n )\n : segment.text}\n </DateSegment>\n );\n};\n\nconst dateFieldStyles = cva(\n [\n 'flex w-full gap-xs rounded-medium px-s py-xs font-display outline outline-interactive',\n ],\n {\n variants: {\n isDisabled: {\n true: 'text-disabled outline-interactive-disabled placeholder:text-disabled',\n false:\n 'text-default-light placeholder:text-default-dark focus-within:outline-highlight hover:outline-interactive-hover',\n },\n isInvalid: {\n true: 'outline-serious',\n },\n isReadOnly: {\n true: 'rounded-none p-0 outline-none',\n },\n size: {\n medium: ['text-body-s', 'pl-[32px]'],\n small: 'text-body-xs',\n },\n },\n compoundVariants: [\n {\n isDisabled: true,\n isInvalid: true,\n className: 'outline-interactive-disabled',\n },\n {\n isDisabled: false,\n size: 'medium',\n },\n ],\n defaultVariants: {\n size: 'medium',\n },\n },\n);\n\ninterface DateInputProps\n extends VariantProps<typeof dateFieldStyles>,\n Omit<AriaDateInputProps, 'size'> {\n ref?: ForwardedRef<HTMLDivElement>;\n}\n\nconst DateInput = ({\n className,\n ref = null,\n size = 'medium',\n isReadOnly,\n ...props\n}: DateInputProps) => {\n return (\n <div className='relative flex'>\n {size === 'medium' ? (\n <Icon\n className={cn([\n '-translate-y-1/2 absolute top-1/2 left-s',\n props.isDisabled ? 'text-disabled' : 'text-default-light',\n ])}\n >\n <Calendar />\n </Icon>\n ) : null}\n <AriaDateInput\n {...props}\n className={({ isDisabled, isInvalid }) =>\n cn(\n dateFieldStyles({\n isDisabled,\n isInvalid,\n isReadOnly: isReadOnly,\n size,\n className,\n }),\n )\n }\n />\n </div>\n );\n};\n\nexport interface DateFieldProps<T extends DateValue>\n extends Omit<\n VariantProps<typeof dateFieldStyles>,\n 'isDisabled' | 'isInvalid' | 'isReadOnly'\n >,\n Omit<AriaDateFieldProps<T>, 'className' | 'style'>, // Exclude className to avoid conflict with cva\n Omit<AriaDateInputProps, 'className' | 'children' | 'style'> {\n isDisabled?: boolean;\n isInvalid?: boolean;\n isReadOnly?: boolean;\n size?: 'small' | 'medium';\n className?: string;\n description?: string;\n errorMessage?: string;\n label?: string;\n placeholder?: string;\n shortMonth?: boolean;\n}\n\nexport function DateField<T extends DateValue>({\n className,\n description,\n errorMessage,\n isDisabled,\n isInvalid,\n isReadOnly,\n label,\n placeholder,\n slot,\n size = 'medium',\n shortMonth = true,\n ...props\n}: DateFieldProps<T>) {\n const isSmall = size === 'small';\n const shouldShowDescription =\n description && (!(isSmall || isInvalid) || isDisabled);\n const shouldShowError =\n errorMessage && isInvalid && !isDisabled && !isReadOnly;\n\n return (\n <AriaDateField<T>\n {...props}\n isDisabled={isDisabled}\n isInvalid={isInvalid}\n isReadOnly={isReadOnly}\n slot={slot}\n className={'flex flex-col gap-xs'}\n >\n {!isSmall && (\n <Label\n className='empty:hidden'\n isDisabled={isDisabled}\n isRequired={props.isRequired}\n >\n {label}\n </Label>\n )}\n\n <DateInput\n className={className}\n isDisabled={isDisabled}\n size={size}\n isReadOnly={isReadOnly}\n isInvalid={isInvalid}\n >\n {(segment) => (\n <FormattedDateSegment segment={segment} shortMonth={shortMonth} />\n )}\n </DateInput>\n {shouldShowDescription && (\n <AriaText\n className={cn([\n 'fg-default-dark text-body-xs empty:hidden',\n isDisabled && 'fg-disabled',\n ])}\n slot='description'\n >\n {description}\n </AriaText>\n )}\n {shouldShowError && (\n <FieldError className='fg-serious text-body-xs empty:hidden'>\n {errorMessage}\n </FieldError>\n )}\n </AriaDateField>\n );\n}\n"]}
|
@@ -1,10 +1,10 @@
|
|
1
|
-
import * as
|
1
|
+
import * as react from 'react';
|
2
2
|
import { RefObject, PropsWithChildren, ReactNode } from 'react';
|
3
3
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
4
4
|
import { DialogTriggerProps, DialogRenderProps } from 'react-aria-components';
|
5
|
-
import { ButtonProps } from '../button/
|
6
|
-
import '
|
7
|
-
import '
|
5
|
+
import { ButtonProps } from '../button/types.js';
|
6
|
+
import 'tailwind-variants';
|
7
|
+
import '../button/styles.js';
|
8
8
|
|
9
9
|
type DialogSize = 'sm' | 'lg';
|
10
10
|
interface DialogProps extends DialogTriggerProps {
|
@@ -28,7 +28,7 @@ declare const Dialog: {
|
|
28
28
|
Title: ({ children, className, }: PropsWithChildren<{
|
29
29
|
className?: string;
|
30
30
|
}>) => react_jsx_runtime.JSX.Element;
|
31
|
-
Body:
|
31
|
+
Body: react.ForwardRefExoticComponent<DialogBodyProps & react.RefAttributes<HTMLDivElement>>;
|
32
32
|
};
|
33
33
|
interface DialogBodyProps {
|
34
34
|
children: ReactNode | ReactNode[] | ((opts: DialogRenderProps) => ReactNode);
|
@@ -1,2 +1,2 @@
|
|
1
|
-
import {cn}from'./../../lib/utils.js';import {useIsSSR}from'@react-aria/ssr';import'client-only';import {cva}from'cva';import {createContext,forwardRef,useState,useEffect,useContext}from'react';import {ModalOverlay,Modal,Dialog,DialogTrigger,Heading}from'react-aria-components';import {Button}from'../button/index.js';import {jsx}from'react/jsx-runtime';var M=cva("flex flex-col align-end font-light text-body-m text-default-dark",{variants:{size:{sm:"min-w-[280px] max-w-[280px] rounded-medium p-l",lg:"min-w-[320px] max-w-[720px] rounded-large p-xl"},defaultVariants:{size:"sm"}}}),E={sm:"small",lg:"medium"},b=createContext({size:"sm"}),r=()=>{let e=useContext(b);if(!e)throw new Error("Dialog components must be used within <Dialog>");return e},l=({children:e,size:t,isOpen:o,onOpenChange:i,isDismissable:a=true,isKeyboardDismissDisabled:m=true,parentRef:p})=>jsx(DialogTrigger,{children:jsx(b.Provider,{value:{size:t??"sm",isDismissable:a,isOpen:o,onOpenChange:i,parentRef:p,isKeyboardDismissDisabled:m},children:e})});l.displayName="Dialog";var x=forwardRef(({children:e,...t},o)=>{let{size:i,isDismissable:a,isOpen:m,onOpenChange:p,parentRef:c,isKeyboardDismissDisabled:
|
1
|
+
import {cn}from'./../../lib/utils.js';import {useIsSSR}from'@react-aria/ssr';import'client-only';import {cva}from'cva';import {createContext,forwardRef,useState,useEffect,useContext}from'react';import {ModalOverlay,Modal,Dialog,DialogTrigger,Heading}from'react-aria-components';import {Button}from'../button/index.js';import {jsx}from'react/jsx-runtime';var M=cva("flex flex-col align-end font-light text-body-m text-default-dark",{variants:{size:{sm:"min-w-[280px] max-w-[280px] rounded-medium p-l",lg:"min-w-[320px] max-w-[720px] rounded-large p-xl"},defaultVariants:{size:"sm"}}}),E={sm:"small",lg:"medium"},b=createContext({size:"sm"}),r=()=>{let e=useContext(b);if(!e)throw new Error("Dialog components must be used within <Dialog>");return e},l=({children:e,size:t,isOpen:o,onOpenChange:i,isDismissable:a=true,isKeyboardDismissDisabled:m=true,parentRef:p})=>jsx(DialogTrigger,{children:jsx(b.Provider,{value:{size:t??"sm",isDismissable:a,isOpen:o,onOpenChange:i,parentRef:p,isKeyboardDismissDisabled:m},children:e})});l.displayName="Dialog";var x=forwardRef(({children:e,...t},o)=>{let{size:i,isDismissable:a,isOpen:m,onOpenChange:p,parentRef:c,isKeyboardDismissDisabled:y}=r(),d=useIsSSR(),[u,D]=useState(d?null:document.body);return useEffect(()=>{let f=c?.current,g=d?null:document.createElement("div");return f&&g&&(f.appendChild(g),D(g)),()=>{g?.remove(),D(d?null:document.body);}},[d,c]),u?jsx(ModalOverlay,{UNSTABLE_portalContainer:u,isKeyboardDismissDisabled:!a&&y,isOpen:m,onOpenChange:p,isDismissable:a,className:"absolute inset-0 flex items-center justify-center",...t,children:jsx(Modal,{ref:o,className:cn("flex flex-col justify-center bg-surface-overlay align-start",i==="sm"&&"rounded-medium",i==="lg"&&"rounded-large"),children:jsx(Dialog,{className:M({size:i}),children:e})})}):null});x.displayName="DialogBody";var H=({children:e,className:t})=>{let{size:o}=r();return jsx("div",{className:cn("flex flex-col",o==="sm"&&"gap-xs",o==="lg"&&"gap-l",t),children:e})},j=({children:e,className:t})=>{let{size:o}=r();return jsx(Heading,{slot:"title",className:cn("text-default-light",o==="sm"&&"mb-s text-header-m",o==="lg"&&"mb-m text-header-l",t),children:e})},K=({children:e,className:t,...o})=>{let{size:i}=r(),a=E[i];return jsx(Button,{size:a,...o,className:cn("pressed:bg-initial",t),children:e})},L=({children:e,className:t})=>{let{size:o}=r();return jsx("div",{className:cn("flex justify-end gap-xs",o==="sm"&&"mt-l",o==="lg"&&"mt-xl",t),children:e})};l.Button=K;l.Content=H;l.Footer=L;l.Title=j;l.Body=x;export{l as Dialog,j as DialogTitle};//# sourceMappingURL=index.js.map
|
2
2
|
//# sourceMappingURL=index.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../../src/components/dialog/index.tsx"],"names":["h","useDialogContext","useContext","DialogContext","z","ctx","size","isOpen","RACDialogTrigger","s","B","Dialog","forwardRef","v","ref","isSSR","useIsSSR","portal","setPortal","y","useState","N","useEffect","parentRef","port","node","jsx","RACModalOverlay","n","O","DialogBody","className","S","buttonSize","buttonSizes","dialogSize","DialogButton","DialogContent","DialogFooter","DialogTitle"],"mappings":"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","file":"index.js","sourcesContent":["/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n'use client';\nimport { cn } from '@/lib/utils';\nimport { useIsSSR } from '@react-aria/ssr';\nimport 'client-only';\nimport { cva } from 'cva';\nimport {\n type PropsWithChildren,\n type ReactNode,\n type RefObject,\n createContext,\n forwardRef,\n useContext,\n useEffect,\n useState,\n} from 'react';\nimport {\n type DialogRenderProps,\n type DialogTriggerProps,\n Dialog as RACDialog,\n DialogTrigger as RACDialogTrigger,\n Heading as RACHeading,\n Modal as RACModal,\n ModalOverlay as RACModalOverlay,\n} from 'react-aria-components';\nimport { Button, type ButtonProps } from '../button';\n\nconst dialogClasses = cva(\n 'flex flex-col align-end font-light text-body-m text-default-dark',\n {\n variants: {\n size: {\n sm: 'min-w-[280px] max-w-[280px] rounded-medium p-l',\n lg: 'min-w-[320px] max-w-[720px] rounded-large p-xl',\n },\n defaultVariants: {\n size: 'sm',\n },\n },\n },\n);\n\nconst buttonSizes: Record<string, ButtonProps['size']> = {\n sm: 'small',\n lg: 'medium',\n};\n\ntype DialogSize = 'sm' | 'lg';\n\ninterface DialogContextValue {\n size: DialogSize;\n isDismissable?: boolean;\n isKeyboardDismissDisabled?: boolean;\n isOpen?: boolean;\n onOpenChange?: (isOpen: boolean) => void;\n parentRef?: RefObject<HTMLElement | null>;\n}\n\nconst DialogContext = createContext<DialogContextValue>({ size: 'sm' });\n\nconst useDialogContext = () => {\n const ctx = useContext(DialogContext);\n if (!ctx) {\n throw new Error('Dialog components must be used within <Dialog>');\n }\n return ctx;\n};\n\nexport interface DialogProps extends DialogTriggerProps {\n size?: DialogSize;\n isDismissable?: boolean;\n isKeyboardDismissDisabled?: boolean;\n isOpen?: boolean;\n onOpenChange?: (isOpen: boolean) => void;\n parentRef?: RefObject<HTMLElement | null>;\n}\n\nexport const Dialog = ({\n children,\n size,\n isOpen,\n onOpenChange,\n isDismissable = true,\n isKeyboardDismissDisabled = true,\n parentRef,\n}: DialogProps) => {\n return (\n <RACDialogTrigger>\n <DialogContext.Provider\n value={{\n size: size ?? 'sm',\n isDismissable,\n isOpen,\n onOpenChange,\n parentRef,\n isKeyboardDismissDisabled,\n }}\n >\n {children}\n </DialogContext.Provider>\n </RACDialogTrigger>\n );\n};\nDialog.displayName = 'Dialog';\n\ninterface DialogBodyProps {\n children: ReactNode | ReactNode[] | ((opts: DialogRenderProps) => ReactNode);\n}\n\nconst DialogBody = forwardRef<HTMLDivElement, DialogBodyProps>(\n ({ children, ...rest }, ref) => {\n const {\n size,\n isDismissable,\n isOpen,\n onOpenChange,\n parentRef,\n isKeyboardDismissDisabled,\n } = useDialogContext();\n const isSSR = useIsSSR();\n const [portal, setPortal] = useState(isSSR ? null : document.body);\n\n useEffect(() => {\n const node = parentRef?.current;\n /* Ensure proper ssr hydration TODO */\n const port = isSSR ? null : document.createElement('div');\n\n if (node && port) {\n node.appendChild(port);\n setPortal(port);\n }\n\n return () => {\n port?.remove();\n\n setPortal(isSSR ? null : document.body);\n };\n }, [isSSR, parentRef]);\n\n return portal ? (\n <RACModalOverlay\n UNSTABLE_portalContainer={portal}\n isKeyboardDismissDisabled={!isDismissable && isKeyboardDismissDisabled}\n isOpen={isOpen}\n onOpenChange={onOpenChange}\n isDismissable={isDismissable}\n className='absolute inset-0 flex items-center justify-center'\n {...rest}\n >\n <RACModal\n ref={ref}\n className={cn(\n 'flex flex-col justify-center bg-surface-overlay align-start',\n size === 'sm' && 'rounded-medium',\n size === 'lg' && 'rounded-large',\n )}\n >\n <RACDialog className={dialogClasses({ size })}>{children}</RACDialog>\n </RACModal>\n </RACModalOverlay>\n ) : null;\n },\n);\nDialogBody.displayName = 'DialogBody';\n\nconst DialogContent = ({\n children,\n className,\n}: PropsWithChildren<{ className?: string }>) => {\n const { size } = useDialogContext();\n return (\n <div\n className={cn(\n 'flex flex-col',\n size === 'sm' && 'gap-xs',\n size === 'lg' && 'gap-l',\n className,\n )}\n >\n {children}\n </div>\n );\n};\n\nexport const DialogTitle = ({\n children,\n className,\n}: PropsWithChildren<{ className?: string }>) => {\n const { size } = useDialogContext();\n return (\n <RACHeading\n slot='title'\n className={cn(\n 'text-default-light',\n size === 'sm' && 'mb-s text-header-m',\n size === 'lg' && 'mb-m text-header-l',\n className,\n )}\n >\n {children}\n </RACHeading>\n );\n};\n\nconst DialogButton = ({ children, className, ...props }: ButtonProps) => {\n const { size: dialogSize } = useDialogContext();\n const buttonSize = buttonSizes[dialogSize];\n return (\n <Button\n size={buttonSize}\n {...props}\n //overriding the style to deal with rac's pressed state inherited\n //from the trigger state\n className={cn('dtk-pressed:bg-initial', className)}\n >\n {children}\n </Button>\n );\n};\n\nconst DialogFooter = ({\n children,\n className,\n}: PropsWithChildren<{ className?: string }>) => {\n const { size } = useDialogContext();\n return (\n <div\n className={cn(\n 'flex justify-end gap-xs',\n size === 'sm' && 'mt-l',\n size === 'lg' && 'mt-xl',\n className,\n )}\n >\n {children}\n </div>\n );\n};\n\nDialog.Button = DialogButton;\nDialog.Content = DialogContent;\nDialog.Footer = DialogFooter;\nDialog.Title = DialogTitle;\nDialog.Body = DialogBody;\n"]}
|
1
|
+
{"version":3,"sources":["../../../src/components/dialog/index.tsx"],"names":["h","useDialogContext","useContext","DialogContext","z","ctx","size","isOpen","RACDialogTrigger","s","B","Dialog","forwardRef","v","ref","isSSR","useIsSSR","portal","setPortal","C","useState","N","useEffect","parentRef","port","node","jsx","RACModalOverlay","n","O","DialogBody","className","S","buttonSize","buttonSizes","dialogSize","DialogButton","DialogContent","DialogFooter","DialogTitle"],"mappings":"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","file":"index.js","sourcesContent":["/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n'use client';\nimport { cn } from '@/lib/utils';\nimport { useIsSSR } from '@react-aria/ssr';\nimport 'client-only';\nimport { cva } from 'cva';\nimport {\n type PropsWithChildren,\n type ReactNode,\n type RefObject,\n createContext,\n forwardRef,\n useContext,\n useEffect,\n useState,\n} from 'react';\nimport {\n type DialogRenderProps,\n type DialogTriggerProps,\n Dialog as RACDialog,\n DialogTrigger as RACDialogTrigger,\n Heading as RACHeading,\n Modal as RACModal,\n ModalOverlay as RACModalOverlay,\n} from 'react-aria-components';\nimport { Button } from '../button';\nimport type { ButtonProps } from '../button/types';\n\nconst dialogClasses = cva(\n 'flex flex-col align-end font-light text-body-m text-default-dark',\n {\n variants: {\n size: {\n sm: 'min-w-[280px] max-w-[280px] rounded-medium p-l',\n lg: 'min-w-[320px] max-w-[720px] rounded-large p-xl',\n },\n defaultVariants: {\n size: 'sm',\n },\n },\n },\n);\n\nconst buttonSizes: Record<string, ButtonProps['size']> = {\n sm: 'small',\n lg: 'medium',\n};\n\ntype DialogSize = 'sm' | 'lg';\n\ninterface DialogContextValue {\n size: DialogSize;\n isDismissable?: boolean;\n isKeyboardDismissDisabled?: boolean;\n isOpen?: boolean;\n onOpenChange?: (isOpen: boolean) => void;\n parentRef?: RefObject<HTMLElement | null>;\n}\n\nconst DialogContext = createContext<DialogContextValue>({ size: 'sm' });\n\nconst useDialogContext = () => {\n const ctx = useContext(DialogContext);\n if (!ctx) {\n throw new Error('Dialog components must be used within <Dialog>');\n }\n return ctx;\n};\n\nexport interface DialogProps extends DialogTriggerProps {\n size?: DialogSize;\n isDismissable?: boolean;\n isKeyboardDismissDisabled?: boolean;\n isOpen?: boolean;\n onOpenChange?: (isOpen: boolean) => void;\n parentRef?: RefObject<HTMLElement | null>;\n}\n\nexport const Dialog = ({\n children,\n size,\n isOpen,\n onOpenChange,\n isDismissable = true,\n isKeyboardDismissDisabled = true,\n parentRef,\n}: DialogProps) => {\n return (\n <RACDialogTrigger>\n <DialogContext.Provider\n value={{\n size: size ?? 'sm',\n isDismissable,\n isOpen,\n onOpenChange,\n parentRef,\n isKeyboardDismissDisabled,\n }}\n >\n {children}\n </DialogContext.Provider>\n </RACDialogTrigger>\n );\n};\nDialog.displayName = 'Dialog';\n\ninterface DialogBodyProps {\n children: ReactNode | ReactNode[] | ((opts: DialogRenderProps) => ReactNode);\n}\n\nconst DialogBody = forwardRef<HTMLDivElement, DialogBodyProps>(\n ({ children, ...rest }, ref) => {\n const {\n size,\n isDismissable,\n isOpen,\n onOpenChange,\n parentRef,\n isKeyboardDismissDisabled,\n } = useDialogContext();\n const isSSR = useIsSSR();\n const [portal, setPortal] = useState(isSSR ? null : document.body);\n\n useEffect(() => {\n const node = parentRef?.current;\n /* Ensure proper ssr hydration TODO */\n const port = isSSR ? null : document.createElement('div');\n\n if (node && port) {\n node.appendChild(port);\n setPortal(port);\n }\n\n return () => {\n port?.remove();\n\n setPortal(isSSR ? null : document.body);\n };\n }, [isSSR, parentRef]);\n\n return portal ? (\n <RACModalOverlay\n UNSTABLE_portalContainer={portal}\n isKeyboardDismissDisabled={!isDismissable && isKeyboardDismissDisabled}\n isOpen={isOpen}\n onOpenChange={onOpenChange}\n isDismissable={isDismissable}\n className='absolute inset-0 flex items-center justify-center'\n {...rest}\n >\n <RACModal\n ref={ref}\n className={cn(\n 'flex flex-col justify-center bg-surface-overlay align-start',\n size === 'sm' && 'rounded-medium',\n size === 'lg' && 'rounded-large',\n )}\n >\n <RACDialog className={dialogClasses({ size })}>{children}</RACDialog>\n </RACModal>\n </RACModalOverlay>\n ) : null;\n },\n);\nDialogBody.displayName = 'DialogBody';\n\nconst DialogContent = ({\n children,\n className,\n}: PropsWithChildren<{ className?: string }>) => {\n const { size } = useDialogContext();\n return (\n <div\n className={cn(\n 'flex flex-col',\n size === 'sm' && 'gap-xs',\n size === 'lg' && 'gap-l',\n className,\n )}\n >\n {children}\n </div>\n );\n};\n\nexport const DialogTitle = ({\n children,\n className,\n}: PropsWithChildren<{ className?: string }>) => {\n const { size } = useDialogContext();\n return (\n <RACHeading\n slot='title'\n className={cn(\n 'text-default-light',\n size === 'sm' && 'mb-s text-header-m',\n size === 'lg' && 'mb-m text-header-l',\n className,\n )}\n >\n {children}\n </RACHeading>\n );\n};\n\nconst DialogButton = ({ children, className, ...props }: ButtonProps) => {\n const { size: dialogSize } = useDialogContext();\n const buttonSize = buttonSizes[dialogSize];\n return (\n <Button\n size={buttonSize}\n {...props}\n //overriding the style to deal with rac's pressed state inherited\n //from the trigger state\n className={cn('pressed:bg-initial', className)}\n >\n {children}\n </Button>\n );\n};\n\nconst DialogFooter = ({\n children,\n className,\n}: PropsWithChildren<{ className?: string }>) => {\n const { size } = useDialogContext();\n return (\n <div\n className={cn(\n 'flex justify-end gap-xs',\n size === 'sm' && 'mt-l',\n size === 'lg' && 'mt-xl',\n className,\n )}\n >\n {children}\n </div>\n );\n};\n\nDialog.Button = DialogButton;\nDialog.Content = DialogContent;\nDialog.Footer = DialogFooter;\nDialog.Title = DialogTitle;\nDialog.Body = DialogBody;\n"]}
|
@@ -1,11 +1,11 @@
|
|
1
1
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
2
|
-
import * as
|
2
|
+
import * as react from 'react';
|
3
3
|
import { ContextValue } from 'react-aria-components';
|
4
4
|
import { IconProps, IconProviderProps } from './types.js';
|
5
5
|
import './styles.js';
|
6
6
|
import 'tailwind-variants';
|
7
7
|
|
8
|
-
declare const IconContext:
|
8
|
+
declare const IconContext: react.Context<ContextValue<IconProps, HTMLSpanElement>>;
|
9
9
|
declare function IconProvider({ children, ...props }: IconProviderProps): react_jsx_runtime.JSX.Element;
|
10
10
|
declare namespace IconProvider {
|
11
11
|
var displayName: string;
|
@@ -1,10 +1,8 @@
|
|
1
|
-
import { PropsWithChildren, RefAttributes } from 'react';
|
1
|
+
import { PropsWithChildren, RefAttributes, HTMLAttributes } from 'react';
|
2
2
|
import { IconStyleVariants } from './styles.js';
|
3
3
|
import 'tailwind-variants';
|
4
4
|
|
5
|
-
type IconProps = PropsWithChildren<RefAttributes<HTMLSpanElement> &
|
6
|
-
|
7
|
-
}>;
|
8
|
-
type IconProviderProps = PropsWithChildren<IconStyleVariants>;
|
5
|
+
type IconProps = PropsWithChildren<RefAttributes<HTMLSpanElement> & HTMLAttributes<HTMLSpanElement> & IconStyleVariants>;
|
6
|
+
type IconProviderProps = PropsWithChildren<Omit<IconProps, 'ref'>>;
|
9
7
|
|
10
8
|
export type { IconProps, IconProviderProps };
|
@@ -1,14 +1,17 @@
|
|
1
1
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
2
|
-
import
|
2
|
+
import * as react from 'react';
|
3
|
+
import { ContextValue } from 'react-aria-components';
|
4
|
+
import { LabelProps, LabelProviderProps } from './types.js';
|
3
5
|
|
4
|
-
|
5
|
-
|
6
|
-
|
6
|
+
declare const LabelContext: react.Context<ContextValue<LabelProps, HTMLLabelElement>>;
|
7
|
+
declare function LabelProvider({ children, ...props }: LabelProviderProps): react_jsx_runtime.JSX.Element;
|
8
|
+
declare namespace LabelProvider {
|
9
|
+
var displayName: string;
|
7
10
|
}
|
8
|
-
declare function Label({
|
11
|
+
declare function Label({ ref, ...props }: LabelProps): react_jsx_runtime.JSX.Element;
|
9
12
|
declare namespace Label {
|
10
13
|
var displayName: string;
|
11
|
-
var
|
14
|
+
var Provider: typeof LabelProvider;
|
12
15
|
}
|
13
16
|
|
14
|
-
export { Label };
|
17
|
+
export { Label, LabelContext };
|
@@ -1,2 +1,2 @@
|
|
1
|
-
import
|
1
|
+
import'client-only';import {createContext}from'react';import {useContextProps,Label}from'react-aria-components';import {LabelStyles}from'./styles.js';import {jsxs,jsx}from'react/jsx-runtime';var a=createContext(null);function o({children:l,...e}){return jsx(a.Provider,{value:e,children:l})}o.displayName="Label.Provider";function t({ref:l,...e}){[e,l]=useContextProps(e,l??null,a);let{children:i,className:n,isDisabled:s,isRequired:r,...b}=e;return jsxs(Label,{...b,className:LabelStyles({className:n}),"data-disabled":s||null,"data-required":r||null,children:[i,!r&&" (optional)"]})}t.displayName="Label";t.Provider=o;export{t as Label,a as LabelContext};//# sourceMappingURL=index.js.map
|
2
2
|
//# sourceMappingURL=index.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../../src/components/label/index.tsx"],"names":["
|
1
|
+
{"version":3,"sources":["../../../src/components/label/index.tsx"],"names":["LabelContext","createContext","children","jsx","props","LabelProvider","Label","ref","useContextProps","className","isDisabled","isRequired","jsxs","AriaLabel","rest","LabelStyles"],"mappings":"+LAuBaA,IAAAA,CACXC,CAAAA,aAA0D,CAAA,IAAI,EAEhE,UAAuB,CAAE,CAAA,QAAAC,CAAAA,CAAU,CAAA,GAAS,CAAA,CAAuB,CACjE,CAAA,OACEC,GAACH,CAAAA,CAAa,CAAA,QAAb,CAAsB,CAAA,KAAOI,EAAQ,CAAA,QAAAF,CAAAA,CAAS,CAEnD,CACAG,CAAAA,CAAc,CAAA,WAAc,CAAA,gBAErB,CAAA,SAASC,CAAM,CAAE,CAAA,GAAAC,CAAAA,CAAK,CAAA,GAAS,EAAe,CACnD,CAACH,CAAAA,CAAOG,CAAG,CAAA,CAAIC,CAAAA,eAAgBJ,EAAOG,CAAAA,CAAAA,EAAO,IAAMP,CAAY,CAAA,CAE/D,CAAA,GAAQ,SAAAE,CAAAA,CAAU,CAAA,SAAAO,CAAAA,CAAW,CAAA,UAAAC,CAAAA,CAAY,CAAA,UAAAC,CAAAA,CAAY,CAAA,GAAQ,CAAA,CAAIP,CAAAA,CAEjE,CAAA,OACEQ,IAACC,CAAAA,KAAA,CACE,CAAA,GAAGC,CACJ,CAAA,SAAWC,CAAAA,WAAY,CAAE,CAAA,SAAAN,CAAU,CAAC,CAAA,CACpC,CAAA,eAAeC,CAAAA,CAAAA,EAAc,IAC7B,CAAA,eAAeC,IAAc,IAE5B,CAAA,QAAA,CAAAT,CAAAA,CACA,CAACS,CAAAA,CAAAA,EAAc,aAAA,CAClB,CAEJ,CACAL,CAAAA,CAAM,CAAA,WAAc,CAAA,OACpBA,CAAAA,CAAM,CAAA,QAAWD,CAAAA,CAAAA","file":"index.js","sourcesContent":["/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n'use client';\n\nimport 'client-only';\nimport { createContext } from 'react';\nimport {\n Label as AriaLabel,\n type ContextValue,\n useContextProps,\n} from 'react-aria-components';\nimport { LabelStyles } from './styles';\nimport type { LabelProps, LabelProviderProps } from './types';\n\nexport const LabelContext =\n createContext<ContextValue<LabelProps, HTMLLabelElement>>(null);\n\nfunction LabelProvider({ children, ...props }: LabelProviderProps) {\n return (\n <LabelContext.Provider value={props}>{children}</LabelContext.Provider>\n );\n}\nLabelProvider.displayName = 'Label.Provider';\n\nexport function Label({ ref, ...props }: LabelProps) {\n [props, ref] = useContextProps(props, ref ?? null, LabelContext);\n\n const { children, className, isDisabled, isRequired, ...rest } = props;\n\n return (\n <AriaLabel\n {...rest}\n className={LabelStyles({ className })}\n data-disabled={isDisabled || null}\n data-required={isRequired || null}\n >\n {children}\n {!isRequired && ' (optional)'}\n </AriaLabel>\n );\n}\nLabel.displayName = 'Label';\nLabel.Provider = LabelProvider;\n"]}
|
@@ -0,0 +1,5 @@
|
|
1
|
+
import * as tailwind_variants from 'tailwind-variants';
|
2
|
+
|
3
|
+
declare const LabelStyles: tailwind_variants.TVReturnType<{} | {} | {}, undefined, string[], {} | {}, undefined, tailwind_variants.TVReturnType<unknown, undefined, string[], unknown, unknown, undefined>>;
|
4
|
+
|
5
|
+
export { LabelStyles };
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"sources":["../../../src/components/label/styles.ts"],"names":["e"],"mappings":"sCAeE,IAAA,CAAA,CAAAA,EAAM,CAAC,CAAA,IAAA,CAAA,CAAA,eAAiB,CAAA,0BAA4B,CAAA,sBACrD,CAAA,CAAA","file":"styles.js","sourcesContent":["/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport { tv } from '@/lib/utils';\n\nexport const LabelStyles = tv({\n base: ['text-header-s', 'enabled:fg-default-light', 'disabled:fg-disabled'],\n});\n"]}
|
@@ -0,0 +1,10 @@
|
|
1
|
+
import { RefAttributes, PropsWithChildren } from 'react';
|
2
|
+
import { LabelProps as LabelProps$1 } from 'react-aria-components';
|
3
|
+
|
4
|
+
type LabelProps = LabelProps$1 & RefAttributes<HTMLLabelElement> & {
|
5
|
+
isDisabled?: boolean;
|
6
|
+
isRequired?: boolean;
|
7
|
+
};
|
8
|
+
type LabelProviderProps = PropsWithChildren<LabelProps>;
|
9
|
+
|
10
|
+
export type { LabelProps, LabelProviderProps };
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"sources":[],"names":[],"mappings":"","file":"types.js"}
|
@@ -1,5 +1,5 @@
|
|
1
1
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
2
|
-
import * as
|
2
|
+
import * as react from 'react';
|
3
3
|
import { ListBoxProps, ListBoxSectionProps } from 'react-aria-components';
|
4
4
|
import { IOptionsItem, OptionsItemProps, OptionsItem } from '../options-item/index.js';
|
5
5
|
import 'cva/types';
|
@@ -14,7 +14,7 @@ interface OptionsProps<T extends IOptionsItem> extends ListBoxProps<T> {
|
|
14
14
|
size?: OptionsItemProps<T>['size'];
|
15
15
|
type?: OptionsItemProps<T>['type'];
|
16
16
|
}
|
17
|
-
declare const OptionsContext:
|
17
|
+
declare const OptionsContext: react.Context<Pick<OptionsProps<IOptionsItem>, "size" | "type">>;
|
18
18
|
declare function Options<T extends IOptionsItem>({ children, className, description, errorMessage, label, placeholder, size, type, ...props }: OptionsProps<T>): react_jsx_runtime.JSX.Element;
|
19
19
|
declare namespace Options {
|
20
20
|
var displayName: string;
|
@@ -1,2 +1,2 @@
|
|
1
|
-
import {mergeProps}from'@react-aria/utils';import'client-only';import {cva}from'cva';import {useContext,useMemo}from'react';import {ListBoxItem,Text}from'react-aria-components';import {Icon}from'../icon/index.js';import {OptionsContext}from'../options/index.js';import {jsx,jsxs,Fragment}from'react/jsx-runtime';var
|
1
|
+
import {mergeProps}from'@react-aria/utils';import'client-only';import {cva}from'cva';import {useContext,useMemo}from'react';import {ListBoxItem,Text}from'react-aria-components';import {Icon}from'../icon/index.js';import {OptionsContext}from'../options/index.js';import {jsx,jsxs,Fragment}from'react/jsx-runtime';var O=cva(["fg-default-light flex items-center gap-s p-s text-body-s ","**:data-[slot=description]:fg-default-dark **:data-[slot=description]:text-body-xs","hover:fg-inverse-light hover:**:data-[slot=description]:fg-inverse-light","focus:fg-inverse-light focus:**:data-[slot=description]:fg-inverse-light ","disabled:fg-disabled disabled:**:data-[slot=description]:fg-disabled disabled:bg-transparent","hover:bg-highlight-bold focus:bg-highlight-bold"],{variants:{type:{destructive:"hover:bg-serious-bold focus:bg-serious-bold",default:"hover:bg-highlight-bold focus:bg-highlight-bold"},size:{large:"pt-s pb-s",small:"pt-xs pb-xs"}},defaultVariants:{size:"large"}});function T({children:e,className:c,description:s,prefixIcon:i,suffixIcon:o,name:a,type:r,size:n,...f}){let p=useContext(OptionsContext)??{},{size:g,type:x}=useMemo(()=>mergeProps(p,{size:n,type:r}),[p,n,r]);return jsx(ListBoxItem,{textValue:a,...f,className:O({type:x,size:g,className:c}),children:u=>typeof e=="function"?e(u):jsxs(Fragment,{children:[i&&jsx("span",{className:"flex w-[16px] items-center",children:jsx(Icon,{children:i})}),jsxs("div",{className:"flex min-w-0 flex-auto flex-col gap-xxs",children:[jsx(Text,{className:"truncate",slot:"label",children:a}),s&&jsx(Text,{className:"truncate","data-slot":"description",slot:"description",children:s})]}),o&&jsx("span",{className:"flex w-[16px] items-center",children:jsx(Icon,{size:"small",children:o})})]})})}T.displayName="OptionsItem";export{T as OptionsItem};//# sourceMappingURL=index.js.map
|
2
2
|
//# sourceMappingURL=index.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../../src/components/options-item/index.tsx"],"names":["cva","b","children","className","prefixIcon","suffixIcon","name","typeProp","sizeProp","useContext","OptionsContext","N","size","useMemo","v","optionsContext","AriaListBoxItem","y","optionsItemStyles","type","renderProps","jsxs","Fragment","
|
1
|
+
{"version":3,"sources":["../../../src/components/options-item/index.tsx"],"names":["cva","b","children","className","prefixIcon","suffixIcon","name","typeProp","sizeProp","useContext","OptionsContext","N","size","useMemo","v","optionsContext","AriaListBoxItem","y","optionsItemStyles","type","renderProps","jsxs","Fragment","A","jsx","t","Icon","d","m","AriaText","l","description","OptionsItem"],"mappings":"wTAyBA,IAA0BA,CAAAA,CACxBC,GACE,CAAA,CAAA,2DACA,CAAA,oFACA,CAAA,0EACA,CAAA,2EACA,CAAA,8FACA,CAAA,iDAEF,CACE,CAAA,CAAA,QACE,CAAA,CAAA,IACE,CAAA,CAAA,yDACA,CAAA,OAAS,CAAA,iDAEX,CAAA,CAAA,IACE,OAAO,CAAA,WACP,CAAA,KAAO,CAAA,aAEX,CACA,CAAA,CAAA,eACE,CAAA,CAAA,IAAM,CAAA,OAGZ,CAAA,CAoBO,CAAA,CAAA,SAA6C,CAClD,CAAA,CAAA,QAAAC,CACA,CAAA,CAAA,SAAAC,CACA,CAAA,CAAA,YACA,CAAA,CAAA,UAAAC,CACA,CAAA,CAAA,UAAAC,CACA,CAAA,CAAA,IAAAC,CACA,MAAMC,CACN,CAAA,CAAA,IAAMC,CACN,CAAA,CAAA,GACF,CAAwB,CACtB,CAAA,CAAA,IAAuBC,CAAAA,CAAWC,UAAc,CAAAC,cAAA,CAAK,IAE7C,CAAA,CAAA,IAAAC,CAAM,CAAA,CAAA,IAAK,CAAA,CAAIC,EACrBC,OAAA,CAAA,IACaC,WAAgB,CACzB,CAAA,CAAA,KACA,CAAA,CAAA,IACF,CAAC,CAAA,CACH,CAACA,CAAAA,CAAgBP,EAAUD,CAAQ,CACrC,CAAA,CAEA,CAAA,CAAA,OACGS,GAAAA,CAAAC,WACC,CAAA,CAAA,SAAWX,CACV,CAAA,CAAA,GACD,CAAA,CAAA,SAAWY,CAAkB,CAAE,CAAA,CAAA,IAAAC,CAAM,CAAA,CAAA,IAAAP,CAAM,CAAA,CAAA,SAAU,CAAC,CAAA,CAErD,CAAA,CAAA,QAACQ,CAAAA,CACI,EAAA,OAAOlB,CAAa,EAAA,WACNkB,CAAW,CAAA,CAI3BC,CAAAA,CAAAC,IAAAA,CAAAC,QACG,CAAA,CAAA,QAAAnB,GACCoB,EAACC,GAAA,CAAA,MAAK,CAAA,CAAA,SAAU,CAAA,4BACd,CAAA,QAAAD,CAACE,IAAAC,IAAM,CAAA,CAAA,QAAAvB,CAAW,CAAA,CACpB,CAAA,CAEFiB,CAAAA,CAACO,UAAI,CAAA,CAAA,SAAU,CAAA,yCACb,CAAA,QAAAJ,CAAAA,CAACK,GAAAA,CAAAC,IAAS,WAAU,CAAA,UAAW,CAAA,IAAK,CAAA,OACjC,CAAA,QAAAxB,CACH,CAAA,CACCyB,GACCP,EAACK,GAAAA,CAAAC,IACC,CAAA,CAAA,SAAU,CAAA,UACV,CAAA,yBACA,CAAA,IAAK,CAAA,aAEJ,CAAA,QAAAC,CACH,CAAA,CAAA,CAEJ,CAAA,CACC1B,GACCmB,EAACC,GAAA,CAAA,MAAK,CAAA,CAAA,SAAU,CAAA,4BACd,CAAA,QAAAD,CAACE,IAAAC,IAAK,CAAA,CAAA,IAAK,CAAA,OAAS,CAAA,QAAAtB,CAAW,CAAA,CACjC,GAEJ,CAAA,CAGN,CAEJ,CACA2B,CAAAA,CAAY,CAAA,CAAA,WAAc,CAAA,aAAA","file":"index.js","sourcesContent":["/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n'use client';\nimport { mergeProps } from '@react-aria/utils';\nimport 'client-only';\nimport { type VariantProps, cva } from 'cva';\nimport { type ReactNode, useContext, useMemo } from 'react';\nimport {\n ListBoxItem as AriaListBoxItem,\n type ListBoxItemProps as AriaListBoxItemProps,\n Text as AriaText,\n} from 'react-aria-components';\nimport { Icon } from '../icon';\nimport { OptionsContext } from '../options';\n\nconst optionsItemStyles = cva(\n [\n 'fg-default-light flex items-center gap-s p-s text-body-s ',\n '**:data-[slot=description]:fg-default-dark **:data-[slot=description]:text-body-xs',\n 'hover:fg-inverse-light hover:**:data-[slot=description]:fg-inverse-light',\n 'focus:fg-inverse-light focus:**:data-[slot=description]:fg-inverse-light ',\n 'disabled:fg-disabled disabled:**:data-[slot=description]:fg-disabled disabled:bg-transparent',\n 'hover:bg-highlight-bold focus:bg-highlight-bold',\n ],\n {\n variants: {\n type: {\n destructive: 'hover:bg-serious-bold focus:bg-serious-bold',\n default: 'hover:bg-highlight-bold focus:bg-highlight-bold',\n },\n size: {\n large: 'pt-s pb-s',\n small: 'pt-xs pb-xs',\n },\n },\n defaultVariants: {\n size: 'large',\n },\n },\n);\n\nexport interface IOptionsItem {\n children?: IOptionsItem[];\n description?: string;\n prefixIcon?: ReactNode;\n suffixIcon?: ReactNode;\n id?: string | number;\n name: string;\n}\n\nexport interface OptionsItemProps<T extends IOptionsItem>\n extends VariantProps<typeof optionsItemStyles>,\n AriaListBoxItemProps<T> {\n description?: string;\n prefixIcon?: ReactNode;\n suffixIcon?: ReactNode;\n name: string;\n}\n\nexport function OptionsItem<T extends IOptionsItem>({\n children,\n className,\n description,\n prefixIcon,\n suffixIcon,\n name,\n type: typeProp,\n size: sizeProp,\n ...props\n}: OptionsItemProps<T>) {\n const optionsContext = useContext(OptionsContext) ?? {};\n\n const { size, type } = useMemo(\n () =>\n mergeProps(optionsContext, {\n size: sizeProp,\n type: typeProp,\n }),\n [optionsContext, sizeProp, typeProp],\n );\n\n return (\n <AriaListBoxItem<T>\n textValue={name}\n {...props}\n className={optionsItemStyles({ type, size, className })}\n >\n {(renderProps) => {\n if (typeof children === 'function') {\n return children(renderProps);\n }\n\n return (\n <>\n {prefixIcon && (\n <span className='flex w-[16px] items-center'>\n <Icon>{prefixIcon}</Icon>\n </span>\n )}\n <div className='flex min-w-0 flex-auto flex-col gap-xxs'>\n <AriaText className='truncate' slot='label'>\n {name}\n </AriaText>\n {description && (\n <AriaText\n className='truncate'\n data-slot='description'\n slot='description'\n >\n {description}\n </AriaText>\n )}\n </div>\n {suffixIcon && (\n <span className='flex w-[16px] items-center'>\n <Icon size='small'>{suffixIcon}</Icon>\n </span>\n )}\n </>\n );\n }}\n </AriaListBoxItem>\n );\n}\nOptionsItem.displayName = 'OptionsItem';\n"]}
|
@@ -4,18 +4,18 @@ declare const PopoverStyles: tailwind_variants.TVReturnType<{
|
|
4
4
|
[key: string]: {
|
5
5
|
[key: string]: tailwind_variants.ClassValue | {
|
6
6
|
content?: tailwind_variants.ClassValue;
|
7
|
+
title?: tailwind_variants.ClassValue;
|
7
8
|
body?: tailwind_variants.ClassValue;
|
8
9
|
footer?: tailwind_variants.ClassValue;
|
9
|
-
title?: tailwind_variants.ClassValue;
|
10
10
|
};
|
11
11
|
};
|
12
12
|
} | {
|
13
13
|
[x: string]: {
|
14
14
|
[x: string]: tailwind_variants.ClassValue | {
|
15
15
|
content?: tailwind_variants.ClassValue;
|
16
|
+
title?: tailwind_variants.ClassValue;
|
16
17
|
body?: tailwind_variants.ClassValue;
|
17
18
|
footer?: tailwind_variants.ClassValue;
|
18
|
-
title?: tailwind_variants.ClassValue;
|
19
19
|
};
|
20
20
|
};
|
21
21
|
} | {}, {
|
@@ -27,9 +27,9 @@ declare const PopoverStyles: tailwind_variants.TVReturnType<{
|
|
27
27
|
[key: string]: {
|
28
28
|
[key: string]: tailwind_variants.ClassValue | {
|
29
29
|
content?: tailwind_variants.ClassValue;
|
30
|
+
title?: tailwind_variants.ClassValue;
|
30
31
|
body?: tailwind_variants.ClassValue;
|
31
32
|
footer?: tailwind_variants.ClassValue;
|
32
|
-
title?: tailwind_variants.ClassValue;
|
33
33
|
};
|
34
34
|
};
|
35
35
|
} | {}, {
|
@@ -1,2 +1,2 @@
|
|
1
|
-
import {LockFill,Delete,Duplicate}from'@accelint/icons';import'client-only';import {useMemo,createContext,useCallback}from'react';import {QueryBuilder}from'react-querybuilder';import {cn}from'../../lib/utils.js';import {
|
1
|
+
import {LockFill,Delete,Duplicate}from'@accelint/icons';import'client-only';import {useMemo,createContext,useCallback}from'react';import {QueryBuilder}from'react-querybuilder';import {cn}from'../../lib/utils.js';import {Button}from'../button/index.js';import {Icon}from'../icon/index.js';import {Label}from'../label/index.js';import {Radio}from'../radio/index.js';import {Tooltip}from'../tooltip/index.js';import {ActionElement}from'./action-element.js';import {RuleGroup,RuleGroupHeaderComponent,RuleGroupFooterComponent}from'./group.js';import {Rule}from'./rule.js';import {getValidationResult,pressToMouseEvent}from'./utils.js';import {ValueEditor}from'./value-editor.js';import {ValueSelector}from'./value-selector.js';import {jsx,jsxs}from'react/jsx-runtime';var z={AND:"All rules below must be true for a match",OR:"One of the rules below must be true for a match"};function C({options:r,value:n,handleOnChange:l}){return jsxs(Radio.Group,{value:n,onChange:l,orientation:"horizontal",children:[jsx(Label,{children:"Combinator"}),r.map(o=>jsx(Radio,{value:o.label,children:jsxs(Tooltip,{children:[jsx(Tooltip.Trigger,{children:jsx("span",{children:o.label})}),jsx(Tooltip.Body,{placement:"top",children:z[o.label]})]})},o.label))]})}function x({handleOnClick:r,className:n,...l}){let o=useCallback(i=>r(pressToMouseEvent(i)),[r]);return jsx(Button,{size:"small",variant:"icon",onPress:o,className:n,...l,children:jsx(Icon,{children:jsx(Delete,{})})})}function u({handleOnClick:r,className:n,...l}){let o=useCallback(i=>r(pressToMouseEvent(i)),[r]);return jsx(Button,{size:"small",variant:"icon",onPress:o,className:n,...l,children:jsx(Icon,{children:jsx(LockFill,{})})})}function p({handleOnClick:r,className:n,...l}){let o=useCallback(i=>r(pressToMouseEvent(i)),[r]);return jsx(Button,{size:"small",variant:"icon",onPress:o,className:n,...l,children:jsx(Icon,{children:jsx(Duplicate,{})})})}function t({controlClassnames:r,controlElements:n,orientation:l="horizontal",showRuleLines:o=true,...i}){let G=useMemo(()=>({combinatorSelector:C,cloneGroupAction:p,cloneRuleAction:p,removeRuleAction:x,lockGroupAction:u,lockRuleAction:u,ruleGroup:RuleGroup,rule:Rule,actionElement:ActionElement,valueSelector:ValueSelector,valueEditor:ValueEditor,...n}),[n]),y=useMemo(()=>({queryBuilder:"border border-transparent",ruleGroup:"group col-span-full flex flex-col gap-s p-s border border-info rounded-medium",header:"flex gap-s",body:cn("group grid gap-x-s empty:hidden",o?"grid-cols-[10px_minmax(100px,_1fr)_min-content]":"grid-cols-[minmax(100px,_1fr)_min-content]"),combinators:"my-s",addRule:"",addGroup:"",cloneRule:"fg-interactive hover:fg-interactive-hover",cloneGroup:"fg-interactive hover:fg-interactive-hover",removeGroup:"",rule:cn("flex gap-xs py-s",l==="vertical"?"flex-col":"min-height-[50px] items-start"),fields:"w-full",operators:"",value:"w-full",removeRule:"",valid:"",invalid:"",disabled:"",lockRule:"fg-interactive hover:fg-interactive-hover",lockGroup:"fg-interactive hover:fg-interactive-hover",valueSource:"",valueListItem:""}),[l,o]),Q=useMemo(()=>({...y,...r}),[r,y]),E=createContext({orientation:l,showRuleLines:o});return jsx(QueryBuilder,{showNotToggle:false,showShiftActions:false,enableDragAndDrop:false,controlClassnames:Q,controlElements:G,context:E,listsAsArrays:true,...i})}t.CombinatorSelector=C;t.RemoveRuleAction=x;t.LockAction=u;t.CloneAction=p;t.ActionElement=ActionElement;t.Rule=Rule;t.RuleGroup=RuleGroup;t.RuleGroupHeaderComponent=RuleGroupHeaderComponent;t.RuleGroupFooterComponent=RuleGroupFooterComponent;t.getValidationResult=getValidationResult;t.ValueEditor=ValueEditor;t.ValueSelector=ValueSelector;export{t as QueryBuilder};//# sourceMappingURL=index.js.map
|
2
2
|
//# sourceMappingURL=index.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../../src/components/query-builder/index.tsx"],"names":["CombinatorSelector","options","jsxs","Radio","v","g","handleOnChange","jsx","Label","e","V","option","Tooltip","a","RemoveRuleAction","className","handlePress","event","handleOnClick","c","f","IconButton","d","Icon","Delete","T","LockAction","LockFill","w","CloneAction","Duplicate","F","QueryBuilder","orientation","mergedElements","s","RuleGroup","B","P","b","A","ValueEditor","h","defaultClassnames","useMemo","R","mergedClassnames","QueryBuilderContext","createContext","D","RQBBuilder","S","L","I","k","ValueSelector"],"mappings":"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","file":"index.js","sourcesContent":["/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n'use client';\nimport { Delete, Duplicate, LockFill } from '@accelint/icons';\nimport type { PressEvent } from '@react-types/shared';\nimport 'client-only';\nimport { type ReactElement, createContext, useCallback, useMemo } from 'react';\nimport {\n type ActionProps,\n type Classnames,\n type CombinatorSelectorProps,\n type FullCombinator,\n type FullField,\n type FullOperator,\n QueryBuilder as RQBBuilder,\n type Classnames as RQBClassnames,\n type Field as RQBField,\n type QueryBuilderProps as RQBProps,\n type RuleGroupType as RQBRuleGroupType,\n type ValueEditorProps,\n} from 'react-querybuilder';\nimport type { LiteralUnion } from 'type-fest';\nimport { cn } from '../../lib/utils';\nimport { Icon } from '../icon';\nimport { IconButton } from '../icon-button';\nimport { Label } from '../label';\nimport { Radio } from '../radio';\nimport { Tooltip } from '../tooltip';\nimport { ActionElement } from './action-element';\nimport {\n RuleGroup,\n RuleGroupFooterComponent,\n RuleGroupHeaderComponent,\n} from './group';\nimport { Rule } from './rule';\nimport { getValidationResult, pressToMouseEvent } from './utils';\nimport { ValueEditor } from './value-editor';\nimport { ValueSelector } from './value-selector';\n\nexport type RuleGroupType = RQBRuleGroupType;\nexport type Field = RQBField;\n\nexport type DefaultRQBProps = RQBProps<\n RuleGroupType,\n FullField,\n FullOperator,\n FullCombinator\n>;\n\n// TODO: need to add multiselect back in when we have a compatible component\nexport type QueryBuilderValueEditors = Record<\n LiteralUnion<\n Exclude<ValueEditorProps['type'], null | undefined | 'multiselect'>,\n string\n >,\n (props: ValueEditorProps) => ReactElement\n>;\n\n/**\n * Omitted props are currently unsupported functionality\n */\nexport type QueryBuilderProps = Partial<\n Omit<\n DefaultRQBProps,\n | 'showCombinatorsBetweenRules'\n | 'independentCombinators'\n | 'listsAsArrays'\n | 'enableDragAndDrop'\n | 'showNotToggle'\n | 'showShiftActions'\n > & {\n orientation?: 'horizontal' | 'vertical';\n showRuleLines?: boolean;\n }\n>;\n\n/**\n * Omitted classnames are for unsupported features\n */\nexport type ClassNames = Omit<\n RQBClassnames,\n | 'betweenRules'\n | 'branches'\n | 'dndDragging'\n | 'dndOver'\n | 'dndCopy'\n | 'dndGroup'\n | 'dragHandle'\n | 'shiftActions'\n | 'notToggle'\n>;\n\nexport type QueryBuilderContextType = Pick<\n QueryBuilderProps,\n 'showRuleLines' | 'orientation'\n>;\n\nconst operatorDescriptions: Record<string, string> = {\n AND: 'All rules below must be true for a match',\n OR: 'One of the rules below must be true for a match',\n};\n\nfunction CombinatorSelector({\n options,\n value,\n handleOnChange,\n}: CombinatorSelectorProps) {\n return (\n <Radio.Group\n value={value}\n onChange={handleOnChange}\n orientation='horizontal'\n >\n <Label>Combinator</Label>\n {options.map((option) => (\n <Radio key={option.label} value={option.label}>\n <Tooltip>\n <Tooltip.Trigger>\n <span>{option.label}</span>\n </Tooltip.Trigger>\n <Tooltip.Body placement='top'>\n {operatorDescriptions[option.label]}\n </Tooltip.Body>\n </Tooltip>\n </Radio>\n ))}\n </Radio.Group>\n );\n}\n\nfunction RemoveRuleAction({ handleOnClick, className, ...rest }: ActionProps) {\n // TODO: remove pressToMouseEvent when design-system is removed\n const handlePress = useCallback(\n (event: PressEvent) => handleOnClick(pressToMouseEvent(event)),\n [handleOnClick],\n );\n\n return (\n <IconButton\n size='small'\n onPress={handlePress}\n className={className}\n {...rest}\n >\n <Icon>\n <Delete />\n </Icon>\n </IconButton>\n );\n}\n\nfunction LockAction({ handleOnClick, className, ...rest }: ActionProps) {\n // TODO: remove pressToMouseEvent when design-system is removed\n const handlePress = useCallback(\n (event: PressEvent) => handleOnClick(pressToMouseEvent(event)),\n [handleOnClick],\n );\n\n return (\n <IconButton\n size={'small'}\n onPress={handlePress}\n className={className}\n {...rest}\n >\n <Icon>\n <LockFill />\n </Icon>\n </IconButton>\n );\n}\n\nfunction CloneAction({ handleOnClick, className, ...rest }: ActionProps) {\n // TODO: remove pressToMouseEvent when design-system is removed\n const handlePress = useCallback(\n (event: PressEvent) => handleOnClick(pressToMouseEvent(event)),\n [handleOnClick],\n );\n\n return (\n <IconButton\n size={'small'}\n onPress={handlePress}\n className={className}\n {...rest}\n >\n <Icon>\n <Duplicate />\n </Icon>\n </IconButton>\n );\n}\n\nexport function QueryBuilder({\n controlClassnames,\n controlElements,\n orientation = 'horizontal',\n showRuleLines = true,\n ...rest\n}: QueryBuilderProps) {\n /**\n * Represents the list of available controls that the component can use as a custom\n * component override.Passed in as a map of our custom defaults, but can be\n * overridden by using the controlElements prop\n */\n const mergedElements = useMemo(\n () => ({\n combinatorSelector: CombinatorSelector,\n cloneGroupAction: CloneAction,\n cloneRuleAction: CloneAction,\n removeRuleAction: RemoveRuleAction,\n lockGroupAction: LockAction,\n lockRuleAction: LockAction,\n ruleGroup: RuleGroup,\n rule: Rule,\n actionElement: ActionElement,\n valueSelector: ValueSelector,\n valueEditor: ValueEditor,\n ...controlElements,\n }),\n [controlElements],\n );\n\n /**\n * Represents the list of available classnames that the component will recognize.\n * Passed in as a map as all the default styling, but can be overridden by using the\n * controlClassnames prop\n */\n const defaultClassnames: Partial<Classnames> = useMemo(\n () => ({\n queryBuilder: 'border border-transparent',\n ruleGroup:\n 'group col-span-full flex flex-col gap-s p-s border border-info rounded-medium',\n header: 'flex gap-s',\n body: cn(\n 'group grid gap-x-s empty:hidden',\n showRuleLines\n ? 'grid-cols-[10px_minmax(100px,_1fr)_min-content]'\n : 'grid-cols-[minmax(100px,_1fr)_min-content]',\n ),\n combinators: 'my-s',\n addRule: '',\n addGroup: '',\n cloneRule: 'fg-interactive hover:fg-interactive-hover',\n cloneGroup: 'fg-interactive hover:fg-interactive-hover',\n removeGroup: '',\n rule: cn(\n 'flex gap-xs py-s',\n orientation === 'vertical'\n ? 'flex-col'\n : 'min-height-[50px] items-start',\n ),\n fields: 'w-full',\n operators: '',\n value: 'w-full',\n removeRule: '',\n valid: '',\n invalid: '',\n disabled: '',\n lockRule: 'fg-interactive hover:fg-interactive-hover',\n lockGroup: 'fg-interactive hover:fg-interactive-hover',\n valueSource: '',\n valueListItem: '',\n }),\n [orientation, showRuleLines],\n );\n\n const mergedClassnames = useMemo(() => {\n return {\n ...defaultClassnames,\n ...controlClassnames,\n };\n }, [controlClassnames, defaultClassnames]);\n\n const QueryBuilderContext = createContext<QueryBuilderContextType>({\n orientation,\n showRuleLines,\n });\n\n return (\n <RQBBuilder\n showNotToggle={false}\n showShiftActions={false}\n enableDragAndDrop={false}\n controlClassnames={mergedClassnames}\n controlElements={mergedElements}\n context={QueryBuilderContext}\n listsAsArrays\n {...rest}\n />\n );\n}\n\nQueryBuilder.CombinatorSelector = CombinatorSelector;\nQueryBuilder.RemoveRuleAction = RemoveRuleAction;\nQueryBuilder.LockAction = LockAction;\nQueryBuilder.CloneAction = CloneAction;\nQueryBuilder.ActionElement = ActionElement;\nQueryBuilder.Rule = Rule;\nQueryBuilder.RuleGroup = RuleGroup;\nQueryBuilder.RuleGroupHeaderComponent = RuleGroupHeaderComponent;\nQueryBuilder.RuleGroupFooterComponent = RuleGroupFooterComponent;\nQueryBuilder.getValidationResult = getValidationResult;\nQueryBuilder.ValueEditor = ValueEditor;\nQueryBuilder.ValueSelector = ValueSelector;\n"]}
|
1
|
+
{"version":3,"sources":["../../../src/components/query-builder/index.tsx"],"names":["CombinatorSelector","options","jsxs","Radio","v","g","handleOnChange","jsx","Label","e","V","option","Tooltip","a","RemoveRuleAction","className","handlePress","event","handleOnClick","m","f","Button","c","Icon","Delete","T","LockAction","LockFill","w","CloneAction","Duplicate","F","QueryBuilder","orientation","mergedElements","s","RuleGroup","B","P","b","A","ValueEditor","h","defaultClassnames","useMemo","R","mergedClassnames","QueryBuilderContext","createContext","D","RQBBuilder","S","k","L","N","ValueSelector"],"mappings":"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","file":"index.js","sourcesContent":["/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n'use client';\nimport { Delete, Duplicate, LockFill } from '@accelint/icons';\nimport type { PressEvent } from '@react-types/shared';\nimport 'client-only';\nimport { type ReactElement, createContext, useCallback, useMemo } from 'react';\nimport {\n type ActionProps,\n type Classnames,\n type CombinatorSelectorProps,\n type FullCombinator,\n type FullField,\n type FullOperator,\n QueryBuilder as RQBBuilder,\n type Classnames as RQBClassnames,\n type Field as RQBField,\n type QueryBuilderProps as RQBProps,\n type RuleGroupType as RQBRuleGroupType,\n type ValueEditorProps,\n} from 'react-querybuilder';\nimport type { LiteralUnion } from 'type-fest';\nimport { cn } from '../../lib/utils';\nimport { Button } from '../button';\nimport { Icon } from '../icon';\nimport { Label } from '../label';\nimport { Radio } from '../radio';\nimport { Tooltip } from '../tooltip';\nimport { ActionElement } from './action-element';\nimport {\n RuleGroup,\n RuleGroupFooterComponent,\n RuleGroupHeaderComponent,\n} from './group';\nimport { Rule } from './rule';\nimport { getValidationResult, pressToMouseEvent } from './utils';\nimport { ValueEditor } from './value-editor';\nimport { ValueSelector } from './value-selector';\n\nexport type RuleGroupType = RQBRuleGroupType;\nexport type Field = RQBField;\n\nexport type DefaultRQBProps = RQBProps<\n RuleGroupType,\n FullField,\n FullOperator,\n FullCombinator\n>;\n\n// TODO: need to add multiselect back in when we have a compatible component\nexport type QueryBuilderValueEditors = Record<\n LiteralUnion<\n Exclude<ValueEditorProps['type'], null | undefined | 'multiselect'>,\n string\n >,\n (props: ValueEditorProps) => ReactElement\n>;\n\n/**\n * Omitted props are currently unsupported functionality\n */\nexport type QueryBuilderProps = Partial<\n Omit<\n DefaultRQBProps,\n | 'showCombinatorsBetweenRules'\n | 'independentCombinators'\n | 'listsAsArrays'\n | 'enableDragAndDrop'\n | 'showNotToggle'\n | 'showShiftActions'\n > & {\n orientation?: 'horizontal' | 'vertical';\n showRuleLines?: boolean;\n }\n>;\n\n/**\n * Omitted classnames are for unsupported features\n */\nexport type ClassNames = Omit<\n RQBClassnames,\n | 'betweenRules'\n | 'branches'\n | 'dndDragging'\n | 'dndOver'\n | 'dndCopy'\n | 'dndGroup'\n | 'dragHandle'\n | 'shiftActions'\n | 'notToggle'\n>;\n\nexport type QueryBuilderContextType = Pick<\n QueryBuilderProps,\n 'showRuleLines' | 'orientation'\n>;\n\nconst operatorDescriptions: Record<string, string> = {\n AND: 'All rules below must be true for a match',\n OR: 'One of the rules below must be true for a match',\n};\n\nfunction CombinatorSelector({\n options,\n value,\n handleOnChange,\n}: CombinatorSelectorProps) {\n return (\n <Radio.Group\n value={value}\n onChange={handleOnChange}\n orientation='horizontal'\n >\n <Label>Combinator</Label>\n {options.map((option) => (\n <Radio key={option.label} value={option.label}>\n <Tooltip>\n <Tooltip.Trigger>\n <span>{option.label}</span>\n </Tooltip.Trigger>\n <Tooltip.Body placement='top'>\n {operatorDescriptions[option.label]}\n </Tooltip.Body>\n </Tooltip>\n </Radio>\n ))}\n </Radio.Group>\n );\n}\n\nfunction RemoveRuleAction({ handleOnClick, className, ...rest }: ActionProps) {\n // TODO: remove pressToMouseEvent when design-system is removed\n const handlePress = useCallback(\n (event: PressEvent) => handleOnClick(pressToMouseEvent(event)),\n [handleOnClick],\n );\n\n return (\n <Button\n size='small'\n variant='icon'\n onPress={handlePress}\n className={className}\n {...rest}\n >\n <Icon>\n <Delete />\n </Icon>\n </Button>\n );\n}\n\nfunction LockAction({ handleOnClick, className, ...rest }: ActionProps) {\n // TODO: remove pressToMouseEvent when design-system is removed\n const handlePress = useCallback(\n (event: PressEvent) => handleOnClick(pressToMouseEvent(event)),\n [handleOnClick],\n );\n\n return (\n <Button\n size='small'\n variant='icon'\n onPress={handlePress}\n className={className}\n {...rest}\n >\n <Icon>\n <LockFill />\n </Icon>\n </Button>\n );\n}\n\nfunction CloneAction({ handleOnClick, className, ...rest }: ActionProps) {\n // TODO: remove pressToMouseEvent when design-system is removed\n const handlePress = useCallback(\n (event: PressEvent) => handleOnClick(pressToMouseEvent(event)),\n [handleOnClick],\n );\n\n return (\n <Button\n size='small'\n variant='icon'\n onPress={handlePress}\n className={className}\n {...rest}\n >\n <Icon>\n <Duplicate />\n </Icon>\n </Button>\n );\n}\n\nexport function QueryBuilder({\n controlClassnames,\n controlElements,\n orientation = 'horizontal',\n showRuleLines = true,\n ...rest\n}: QueryBuilderProps) {\n /**\n * Represents the list of available controls that the component can use as a custom\n * component override.Passed in as a map of our custom defaults, but can be\n * overridden by using the controlElements prop\n */\n const mergedElements = useMemo(\n () => ({\n combinatorSelector: CombinatorSelector,\n cloneGroupAction: CloneAction,\n cloneRuleAction: CloneAction,\n removeRuleAction: RemoveRuleAction,\n lockGroupAction: LockAction,\n lockRuleAction: LockAction,\n ruleGroup: RuleGroup,\n rule: Rule,\n actionElement: ActionElement,\n valueSelector: ValueSelector,\n valueEditor: ValueEditor,\n ...controlElements,\n }),\n [controlElements],\n );\n\n /**\n * Represents the list of available classnames that the component will recognize.\n * Passed in as a map as all the default styling, but can be overridden by using the\n * controlClassnames prop\n */\n const defaultClassnames: Partial<Classnames> = useMemo(\n () => ({\n queryBuilder: 'border border-transparent',\n ruleGroup:\n 'group col-span-full flex flex-col gap-s p-s border border-info rounded-medium',\n header: 'flex gap-s',\n body: cn(\n 'group grid gap-x-s empty:hidden',\n showRuleLines\n ? 'grid-cols-[10px_minmax(100px,_1fr)_min-content]'\n : 'grid-cols-[minmax(100px,_1fr)_min-content]',\n ),\n combinators: 'my-s',\n addRule: '',\n addGroup: '',\n cloneRule: 'fg-interactive hover:fg-interactive-hover',\n cloneGroup: 'fg-interactive hover:fg-interactive-hover',\n removeGroup: '',\n rule: cn(\n 'flex gap-xs py-s',\n orientation === 'vertical'\n ? 'flex-col'\n : 'min-height-[50px] items-start',\n ),\n fields: 'w-full',\n operators: '',\n value: 'w-full',\n removeRule: '',\n valid: '',\n invalid: '',\n disabled: '',\n lockRule: 'fg-interactive hover:fg-interactive-hover',\n lockGroup: 'fg-interactive hover:fg-interactive-hover',\n valueSource: '',\n valueListItem: '',\n }),\n [orientation, showRuleLines],\n );\n\n const mergedClassnames = useMemo(() => {\n return {\n ...defaultClassnames,\n ...controlClassnames,\n };\n }, [controlClassnames, defaultClassnames]);\n\n const QueryBuilderContext = createContext<QueryBuilderContextType>({\n orientation,\n showRuleLines,\n });\n\n return (\n <RQBBuilder\n showNotToggle={false}\n showShiftActions={false}\n enableDragAndDrop={false}\n controlClassnames={mergedClassnames}\n controlElements={mergedElements}\n context={QueryBuilderContext}\n listsAsArrays\n {...rest}\n />\n );\n}\n\nQueryBuilder.CombinatorSelector = CombinatorSelector;\nQueryBuilder.RemoveRuleAction = RemoveRuleAction;\nQueryBuilder.LockAction = LockAction;\nQueryBuilder.CloneAction = CloneAction;\nQueryBuilder.ActionElement = ActionElement;\nQueryBuilder.Rule = Rule;\nQueryBuilder.RuleGroup = RuleGroup;\nQueryBuilder.RuleGroupHeaderComponent = RuleGroupHeaderComponent;\nQueryBuilder.RuleGroupFooterComponent = RuleGroupFooterComponent;\nQueryBuilder.getValidationResult = getValidationResult;\nQueryBuilder.ValueEditor = ValueEditor;\nQueryBuilder.ValueSelector = ValueSelector;\n"]}
|
@@ -1,2 +1,2 @@
|
|
1
|
-
import {useCallback}from'react';import {useValueEditor}from'react-querybuilder';import {Checkbox}from'../checkbox/index.js';import {Radio}from'../radio/index.js';import {Switch}from'../switch/index.js';import {
|
1
|
+
import {useCallback}from'react';import {useValueEditor}from'react-querybuilder';import {Checkbox}from'../checkbox/index.js';import {Radio}from'../radio/index.js';import {Switch}from'../switch/index.js';import {TextAreaField}from'../text-area-field/index.js';import {TextField}from'../text-field/index.js';import {multiValueOperators}from'./constants.js';import {getValidationResult}from'./utils.js';import {ValueSelector}from'./value-selector.js';import {jsx,Fragment}from'react/jsx-runtime';function k({disabled:a,fieldData:{name:e,validator:t},handleOnChange:l,rule:o,value:r}){let{valid:i}=getValidationResult(o,t);return jsx(Checkbox,{isDisabled:a,isSelected:r,onChange:l,"aria-invalid":!i,"aria-label":e})}function x({disabled:a,fieldData:{name:e,validator:t},handleOnChange:l,rule:o,value:r,values:i}){let{valid:u}=getValidationResult(o,t);return jsx(Radio.Group,{value:r,isDisabled:a,onChange:l,"aria-invalid":!u,"aria-label":e,"aria-labelledby":e,children:i?.map(n=>jsx(Radio,{value:n.value,children:n.label},n.name))})}var R=[];function S({disabled:a,fieldData:{name:e,validator:t},handleOnChange:l,rule:o,type:r,value:i,values:u=R,...n}){let{valid:p}=getValidationResult(o,t);return jsx(ValueSelector,{...n,disabled:a,multiple:r==="multiselect",options:u,title:e,validation:!p,value:i,handleOnChange:l,"aria-labelledby":e})}function T({disabled:a,fieldData:{name:e,validator:t},handleOnChange:l,rule:o,value:r}){let{valid:i}=getValidationResult(o,t);return jsx(Switch,{isDisabled:a,isSelected:!!r,onChange:l,"aria-invalid":!i,"aria-label":e,"aria-labelledby":e})}function w({disabled:a,fieldData:{name:e,placeholder:t,validator:l},handleOnChange:o,inputType:r,rule:i,value:u}){let{valid:n,reasons:p}=getValidationResult(i,l);return jsx(TextField,{isDisabled:a,isInvalid:!n,placeholder:t,type:r??"text",size:"small",value:u,onChange:o,"aria-invalid":!n,"aria-label":e,"aria-labelledby":e,errorMessage:p?.join("/n")})}function I({disabled:a,fieldData:{name:e,placeholder:t,validator:l},handleOnChange:o,rule:r,value:i}){let{valid:u,reasons:n}=getValidationResult(r,l);return jsx(TextAreaField,{size:"small",errorMessage:n?.join("/n"),inputProps:{placeholder:t},value:i,isDisabled:a,isInvalid:!u,onChange:o,"aria-label":e,"aria-invalid":!u,"aria-labelledby":e})}var O={checkbox:k,radio:x,select:S,switch:T,text:w,textarea:I};function q(a){let{fieldData:{name:e,valueEditorType:t},operator:l,rule:o}=a,{valueAsArray:r,multiValueHandler:i}=useValueEditor({...a,skipHook:true}),u=useCallback(s=>({...o,value:r[s]}),[o,r]),n=useCallback(s=>i(s,0),[i]),p=useCallback(s=>i(s,1),[i]),E=(typeof t=="function"?t(l):t)??"text",f=O?.[E];return l==="null"||l==="notNull"||!f?null:multiValueOperators.includes(l)?jsx(Fragment,{children:["start","end"].map((s,v)=>jsx("div",{children:jsx(f,{...a,rule:u(v),value:r[v],handleOnChange:v?p:n})},`${e}-${s}`))}):jsx("div",{children:jsx(f,{...a})})}export{q as ValueEditor};//# sourceMappingURL=value-editor.js.map
|
2
2
|
//# sourceMappingURL=value-editor.js.map
|