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.

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

Adding additonal split string to convert variables to Token Studio syntax and remove unwanted characters and pull out specific parts of the output parameters #60

Open
mikeysouthwell opened this issue Aug 14, 2024 · 0 comments

Comments

@mikeysouthwell
Copy link

mikeysouthwell commented Aug 14, 2024

Hi Jake,

I believe this is the section of your code in the "snippets.ts" script that needs to be adjusted to allow this change:

export function transformStringWithFilter(
  string: string,
  rawString: string,
  filter: SnippetStringFilter = "hyphen"
) {
  const splitString = string.split("-");
  const capitalize = (s: string) => s.charAt(0).toUpperCase() + s.substring(1);
  switch (filter) {
    case "camel":
      return splitString
        .map((word, i) => (i === 0 ? word : capitalize(word)))
        .join("");
    case "constant":
      return splitString.join("_").toUpperCase();
    case "hyphen":
      return splitString.join("-").toLowerCase();
    case "pascal":
      return splitString.map(capitalize).join("");
    case "raw":
      return rawString;
    case "snake":
      return splitString.join("_").toLowerCase();
  }
  return splitString.join(" ");
}

Is it just as simple as adding this code below to the section of code above?

    case "tokenstudio":
      return rawString.join("/");

The objective here is to change something like this:

Colours/Surface/button-white

To this:

Colours.Surface.button-white

The custom Code Syntax option for variables is painful as you have to do this for each individual variable and if you change the name or move it you have to rename the custom code syntax!

Could we also use the same string transform filters on things like this to pull out the parts we need or remove the "px" next to the numbers?

"css.border": "var(--Stroke-stroke-2xs, 0.5px) solid Colours.Border.neutral"

"css.boxShadow": 0px 0.5px 1px 0px rgba(0, 0, 0, 0.10)

@mikeysouthwell mikeysouthwell changed the title Adding additional split string to convert "/" variable folder syntax to "." Token Studio syntax Adding additonal split string to convert variables to Token Studio syntax and remove unwanted characters and pull out specific parts of the output Aug 16, 2024
@mikeysouthwell mikeysouthwell changed the title Adding additonal split string to convert variables to Token Studio syntax and remove unwanted characters and pull out specific parts of the output Adding additonal split string to convert variables to Token Studio syntax and remove unwanted characters and pull out specific parts of the output parameters Aug 16, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant