Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Autocomplete: Passthrough to input not working #6922

Closed
Nandovga opened this issue Jul 24, 2024 · 4 comments · Fixed by #6926, #6938, leoo1992/GeradorQRCode#80 or leoo1992/GeradorQRCode#85 · May be fixed by mtech-31-quemistry/quemistry_client_web#20
Closed

Autocomplete: Passthrough to input not working #6922

Nandovga opened this issue Jul 24, 2024 · 4 comments · Fixed by #6926, #6938, leoo1992/GeradorQRCode#80 or leoo1992/GeradorQRCode#85 · May be fixed by mtech-31-quemistry/quemistry_client_web#20
Assignees
@melloware
Labels
Typescript Issue or pull request is *only* related to TypeScript definition
Milestone
10.8.0

Comments

@Nandovga
Copy link

Describe the bug

When passing the property to PrimeReactProvider, the autocomplete component is not receiving the className parameterized in the object

import { AutoCompletePassThroughOptions } from "primereact/autocomplete";

export const autocomplete: AutoCompletePassThroughOptions = {
    root: {
        className: "w-100 fs-7 p-0 d-flex"
    },
    input: {
        className: "autocomplete-custom"
    }
};

import { PrimeReactProvider } from "primereact/api";
import { configPrimeReact } from "../primereact";

<PrimeReactProvider value={{ pt: configPrimeReact }}>
    <App {...props}/>
</PrimeReactProvider>

Reproducer

No response

PrimeReact version

10.7.0

React version

18.x

Language

TypeScript

Build / Runtime

Vite

Browser(s)

Chrome 127, Edge

Steps to reproduce the behavior

No response

Expected behavior

No response
@Nandovga Nandovga added the Status: Needs Triage Issue will be reviewed by Core Team and a relevant label will be added as soon as possible label Jul 24, 2024
@melloware
Copy link
Member

your syntax is wrong see: https://stackblitz.com/edit/efgeef?file=src/App.jsx

<AutoComplete
        value={value}
        suggestions={items}
        completeMethod={search}
        onChange={(e) => setValue(e.value)}
        pt={{
          root: {
            className: 'w-100 fs-7 p-0 d-flex',
          },
          input: {
            root: {
              className: 'autocomplete-custom',
            },
          },
        }}
      />

@melloware melloware added Resolution: Cannot Replicate Issue could not be replicated by Core Team and removed Status: Needs Triage Issue will be reviewed by Core Team and a relevant label will be added as soon as possible labels Jul 24, 2024
@github-actions GitHub Actions
Copy link

We're unable to replicate your issue, if you are able to create a reproducer or add details please edit this issue. This issue will be closed if no activities in 20 days.

@melloware melloware changed the title Autocomplete - PrimeReactProvider Autocomplete: Passthrough to input not working Jul 25, 2024
@Nandovga
Copy link
Author

That way it worked. But checking the AutoCompletePassThroughOptions typing, I think it's not correct because it doesn't recommend using root within the input.

@melloware melloware added Typescript Issue or pull request is *only* related to TypeScript definition and removed Resolution: Cannot Replicate Issue could not be replicated by Core Team labels Jul 25, 2024
@melloware
Copy link
Member

let me fix the Typescript.

melloware added a commit to melloware/primereact that referenced this issue Jul 25, 2024
@melloware
Fix primefaces#6922: Autocomplete fix input passthrough TS
47bb7ca
@melloware melloware mentioned this issue Jul 25, 2024
Merged
@melloware melloware self-assigned this Jul 25, 2024
@melloware melloware added this to the 10.7.1 milestone Jul 25, 2024
melloware added a commit to melloware/primereact that referenced this issue Jul 27, 2024
@melloware
Fix primefaces#6922: fix input passthrough TS
140c568
@melloware melloware mentioned this issue Jul 27, 2024
Merged
melloware added a commit that referenced this issue Jul 27, 2024
@melloware
Fix #6922: fix input passthrough TS (#6938)
0587fda
@leoo1992 leoo1992 mentioned this issue Aug 19, 2024
Merged
@hiterharris hiterharris mentioned this issue Aug 19, 2024
Closed
@hiterharris hiterharris mentioned this issue Aug 27, 2024
Closed
@leoo1992 leoo1992 mentioned this issue Aug 27, 2024
Merged
@raymondhtet raymondhtet mentioned this issue Sep 25, 2024
Open
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@melloware melloware

Labels
Typescript Issue or pull request is *only* related to TypeScript definition
Projects
None yet
Milestone
10.8.0
2 participants
@melloware @Nandovga